Ниже у меня есть код для моего тестового файла, и я добавил фотографии результатов моего терминала. Приложение представляет собой доску kanban, где нажатие на кнопку «вперед» переместит задачу на правильный уровень. В настоящее время задача 1 находится на этапе 0 и должна завершиться на этапе 1. Причина, по которой тест не пройден, заключается в том, что элемент задачи все еще имеет класс «clicked», который должен исчезнуть при повторном отображении React. Мне интересно, почему элемент getByTestId, по-видимому, не имеет обновленного элемента (без класса «clicked»), повторное получение data-testid, похоже, дает правильный ответ, а повторный рендеринг элемента в ожидаемом дает «clicked» класс.
Есть мысли?
Console.logs
Вывод теста
describe('6. Move a Task Back and Forth', () => {
it('can move task 1 to Stage 1', async () => {
const { getByTestId } = render(<App />);
let task1El = getByTestId('task-task-1');
console.log('El1', task1El.outerHTML);
fireEvent.click(task1El);
const forwardsEl = getByTestId('stage-0-move-right');
fireEvent.click(forwardsEl);
const stageEl = getByTestId('stage-1');
console.log('Stage', stageEl.outerHTML);
console.log('El2', task1El.outerHTML);
await waitForElement(
() => {
console.log('El3', getByTestId('task-task-1').outerHTML);
console.log('El4', task1El.outerHTML);
expect(stageEl.contains(task1El)).toBeTruthy();
},
{ task1El }
);
});
});