Невозможно проверить щелчок: метод ошибки '' simulate '' предназначен для запуска на 1 узле - PullRequest
Новая
       8

Невозможно проверить щелчок: метод ошибки '' simulate '' предназначен для запуска на 1 узле

0 голосов
/ 26 февраля 2019

Мне удалось протестировать некоторые события onClick для этого файла, но когда дело доходит до кода ниже, я не могу проверить.Основная причина, по которой я верю, заключается в том, что внутри рендера есть класс, который я не могу проверить

Я пытался проверить по className, id и т. Д., Но все равно получаю ту же ошибку.

Использование jest и энзима - React JS

Вот событие onClick, которое я пытаюсь проверить: 

         <div className='report-wrapper'>

        <div className='fields-item-wrapper span-two-col'>
          <label className='workflow-label' for=''> Contacts </label>
          <Select
            className={'field-input-select margin-right'}              
            id=''
            value={this.state.Contact}
            onChange={(e) => {let val = e ? e.value : null; this.setState({Contact: e, Account: null, accountOptions: []}); this.getAccounts(e)}}
            onClick={() => {this.setState({showRequired: false})} }
            options={this.state.contactOptions}
            isDisabled={loading}
          />
        </div>

Использование jest и энзима - я уже смонтировал компонент 

describe(' Edit Data Test', () => {
 let wrapper;

  beforeEach(() => wrapper = mount(<BrowserRouter><Component {...baseProps} /></BrowserRouter>));

it("should check button click event - Select class", () => {
baseProps.onClick.mockClear();
wrapper.setState({
  showRequired: false,
});
wrapper.update() 
wrapper.find('#test').simulate("click");

  });

1 Ответ

0 голосов
/ 28 февраля 2019

Оказалось, что вы используете withRouter на тестируемом компоненте.По сути, доступ к компоненту, заключенному в HOC, немного сложнее, чем вы пытаетесь сделать.

Прежде всего, я бы предложил прочитать мою статью о Средняя , чтобы иметь общее представление о возникающей проблеме.Позвольте мне подчеркнуть следующее предложение, которое я взял оттуда:

Фактическая проблема заключается в том, что вы не можете получить доступ к компоненту в HOC напрямую, вместо этого вы должны получить соответствующий компонент с более глубокого уровня.

Во-вторых, вам следует изменить монтаж компонента следующим образом: 

// Imports ...

describe('something', () => {
   let wrapper;

   beforeEach(() => {
      // This can be used to do full DOM rendering: mount(shallow(<MyComponent />).get(0));
      wrapper = shallow(shallow(<MyComponent />).get(0)); 
      // Notice that I don't use <BrowserRouter />. Obviously, pass the necessary props to the component.
   });

   it('tests something', () => {
      // I don't know exactly what `baseProps` is in your code, probably you don't need that here.
      // What you need to do is find the corresponding component and simulate a click event.
      wrapper.find(Select).simulate('click');

      // And here, write the expected action which probably should be the same as it is in your case:
      expect(wrapper.state('showRequired')).toBeFalsy();
   });
});

Пожалуйста, в следующий раз предоставьте более точную информацию о кодах, структуреи актуальная проблема.Более того, отступ в примерах, который вы добавили выше, довольно плох, затрудняет понимание того, что на самом деле там происходит.

...