Событие щелчка внутри модального окна: невозможно прочитать свойство 'click' из null

Question

Попытка выяснить, почему не работает событие проверки моего клика. Я применил ту же настройку для другого события клика в том же файле, и это сработало Использование Jest и Enzyme для реакции JS Цель: событие щелчка, способное захватить узел и пройти тестирование

Это то, что у меня есть для моего тестового примера:

Test.js

 describe("Test Modal Components and Events ", () => {
let mountingDiv;
let wrapper;

beforeEach(() => {
wrapper = mount(<MemoryRouter keyLength={0}  initialEntries={["/add"]} ><Policies {...baseProps} /></MemoryRouter>);
mountingDiv = document.createElement('div');
document.body.appendChild(mountingDiv);
})

контрольный пример

it('Test click event on Close - Modal', () => {
 ReactModal.setAppElement('body');
 wrapper = mount( <ReactModal isOpen></ReactModal>,
  {attachTo: mountingDiv}
 );
 wrapper.setState({
    quickFilterModalOpen: false,
 })
 wrapper.update()
 expect(!!document.body.querySelector('.fullmodal')).toEqual(true);
 expect(!!document.body.querySelector('.sidemodal_addnew_x')).toEqual(true)
 document.querySelector("#closemodal-id").click();
});

Вот файл.js

<Modal isOpen={this.state.quickFilterModalOpen} style={descriptionModalStyle}>
  <div>
    <div className='fullmodal'>
    <div className='sidemodal_addnew_x' id="closemodal-id" onClick={this.closeModal}>

Answer 1

модал должен быть виден для нажатия кнопки закрытия. Установите quickFilterModalOpen в true и используйте .find(selector), чтобы найти элемент, по которому нужно щелкнуть. (https://airbnb.io/enzyme/docs/api/ReactWrapper/find.html)

    wrapper.setState({
        quickFilterModalOpen: true,
    })
    wrapper.update()
    wrapper.find("#closemodal-id").simulate("click");

Answer 2

Я думаю, что это проблема обязательна, я пойду за слушателем событий или иным образом подойду onClick = {this.closeModal.bind (this)} или аналогичный, это зависит от вашего кода Надеюсь, это поможет