Блог

Я изо всех сил пытаюсь протестировать компонент React без использования rerender функции.

 function renderDom(component, store) {
  return {
    ...render(<Provider store={store}>{component}</Provider>),
    store,
  };
}

it('Should render a TimeEditor component and ensure the  /- buttons function correctly', async () => {
  const store = configureStore(_initialState);
  const spy = jest.spyOn(store, 'dispatch');

  let component = {};
  component = await renderDom(
    <TimeEditor task={store.getState().stdForm.tasks[0]} />,
    store
  );

  const { queryByTestId, findByTestId } = component

  const minusButton = await findByTestId('subtract-minute');
  const plusButton = await findByTestId('add-minute');
  let duration = await findByTestId('start-service-duration');

  expect(duration.innerHTML).toEqual('5');
  expect(minusButton).toBeDisabled();

  await fireEvent.click(plusButton);
  expect(spy).toHaveBeenCalledTimes(1);
  expect(spy).toHaveBeenCalledWith({
    type: 'UPDATE_TASK_TIME',
    payload: { id: '330d8081-6c32-4d62-b0f1-64cdd28d4b75', estimatedMinutes: 6 },
  });

  // rerender(
  //   <Provider store={store}>
  //     {<TimeEditor task={store.getState().stdForm.tasks[0]} />}
  //   </Provider>
  // );

  await waitForElement(() => findByTestId('start-service-duration'));
  duration = await findByTestId('start-service-duration');
  expect(duration.innerHTML).toEqual('6');
});
 

Я перепробовал все, что мог придумать, чтобы заставить код работать без rerender , но ничего не работает. Чтобы быть более точным, я знаю, что редуктор Redux выполняет свою работу должным образом, но это не отражается обратно в компоненте, поэтому «5» не меняется на «6».

Есть ли способ запустить этот тест без rerender ?

Вероятно, проще использовать провайдера в качестве оболочки:

 function renderDom(component, store) {
  const WithStore = ({children}) => <Provider store={store}>{children}</Provider>

  return {
    ...render(component, {wrapper: WithStore}),
    store,
  };
}
 

Таким образом, вам не нужно обращать никакого внимания на поставщика при повторном запуске.