Блог

У меня есть <Review /> страница, на которой я хочу выполнить тесты, чтобы проверить, включена / отключена ли определенная функциональность в зависимости от существующего состояния в Redux.

Я чувствую, что, хотя текущее решение, которое у меня есть, работает, оно выглядит беспорядочным в тестах, и я хочу получить более широкое мнение о структуре теста.

Это базовый тестовый пример:

 it('shows `agree` button if the user has `role` of customer', async () => {
  const state = {
    user: {
      user: {
        _id: 't3stID',
        workspaces: [
          {
            preferred: true,
            member: {
              roles: ['customer'],
            },
          },
        ],
      },
    },
  };

  // Render with redux is a custom helper method that renders the component under test wrapped in `<Provider>` and the `state` passed in the args.

  const { findByRole } = renderWithRedux<DeepPartial<RootState>>(<Review />, {
    reducer, //imported
    state, // defined above
  });

  expect(await findByRole('button', { name: 'Agree' })).toBeInTheDocument();
});
 

Вопросы:

1. Является ли создание минимального состояния, необходимого для этого теста, а затем введение его с помощью метода визуализации, правильным способом для этого?
2. Я подумал о создании заводского класса, который генерирует этот объект состояния, используя значения / методы конструктора для установки значений. Будет ли это способом уменьшить количество «шаблонных» объектов?
3. Что вы думаете о создании повторяющихся объектов, подобных этому, которым обычно требуется только одно изменение свойства в состоянии? Я думал о рендеринге компонента в a beforeEach() , но не могу сосредоточиться на изменении состояния перед каждым тестом.