2017-09-03 3 views
0

Je veux écrire un test, qui supprime un composant Puce matérielle-ui dans mon composant InputTag. Une idée de comment y parvenir? Ceci est mon meilleur coup jusqu'à présent:...simuler delete matérielle-ui Puce

import React from 'react'; 
import InputTag from '../../src/components/InputTag.js'; 
import renderer from 'react-test-renderer'; 
import {shallow, mount} from 'enzyme'; 
import {spy} from 'sinon'; 

describe('components/InputTag',() => { 
    it('should call onRquestDelete method', (done) => { 
     const deleteTag = spy(); 
     const wrapper = mount(
       <InputTag 
        addTag={() => {}} 
        deleteTag={deleteTag} 
        changeTag={() => {}} 
        tags={[{key: "t1", label: "test"}]} 
        tag="" 
       /> 
     ); 
     expect(wrapper.find('Chip')).toHaveLength(1); 

     spy(wrapper.instance(), 'handleRequestDelete'); 
     wrapper.find('Chip').first().find('DeleteIcon').simulate('click'); 

     expect.assertions(2); 
     setTimeout(() => { 
      expect(wrapper.instance().handleRequestDelete.callCount).toEqual(1); 
      expect(deleteTag.callCount).toEqual(1); 
      done(); 
     }, 0); 
    }); 
} 

La ligne en question est

wrapper.find ('Chip') premier() trouver ('DeleteIcon') simulent (clic ');

Comment puis-je trouver et cliquer sur le DeleteIcon ou l'action correspondante qui est handleDeleteIconClick?

Répondre

0

J'ai finalement trouvé un moyen:

// enzyme does not support touchTap currently 
    // @see https://github.com/airbnb/enzyme/issues/99 
    const node = ReactDOM.findDOMNode(
     ReactTestUtils.findRenderedDOMComponentWithTag(
      wrapper.instance(), 'svg' 
     ) 
    ); 
    ReactTestUtils.Simulate.touchTap(node); 

pas le meilleur coup que je suppose, que je recherche svg dans l'instance d'emballage complète et parce que je dois chercher svg du tout, mais il fonctionne au moins