CODEWITHSUNDEEP
reactjsjestjsenzyme
usertestREACT
usertestREACT

Reputation: 263

Modal component - onClick event

Trying to test the following click event: Using Jest and Enzyme for ReactJS

<Modal isOpen={this.state.descriptionModalOpen} style={descriptionModalStyle}>
  <div>
   <div className='fullmodal'>
   <div className="fullmodal_title">
     <div className="fullmodal_title_add">Description</div>
   </div>             
   <div className='sidemodal_addnew_x' id="close-Modal-id" onClick={this.closeModal}>
     <FontAwesome name='xbutton' className='fa-times' />
    </div>
    </div>    
   {this.getDescription()}
      </div>
    </Modal>

Node cannot be found. The others click events test passed just fine, but this is the only one inside of a Modal.

Here is part of my test file

 beforeEach(() => (wrapper = mount(<MemoryRouter keyLength={0}><Notifications {...baseProps} /></MemoryRouter>)));

it("should check  button click events under  Modal Component", () => {
baseProps.onClick.mockClear();
wrapper.find('Notifications').setState({
  descriptionModalOpen: false,

});
wrapper.update() 
wrapper.find('Notifications').find('#close-Modal-id').simulate("click"); 
});

Upvotes: 1

Views: 408

Answers (1)

AlexZvl
AlexZvl

Reputation: 2302

did you try findWhere?

const yourElement = element.findWhere(node => node.id === "close-Modal-id")
yourElement.simulate('click');

If it doesn't, can you verify if findWhere traverses the node you're targeting?

Upvotes: 1

Related Questions