я сделал небольшое репо, чтобы продемонстрировать свою проблему: https://github.com/msawatzky75/user-event-input-test
у меня есть несколько разных сценариев здесь:
каждый из них запускает запрос на выборку, который обрабатывается msw
. Я также настроил 2 разные среды DOM для запуска этих тестов: jsdom
и happy-dom
.
только тесты, которые взаимодействуют с элементами ввода (флажок и текстовый ввод), терпят неудачу, и результаты согласуются в средах DOM.
В чем проблема? это ошибка с @testing-library/user-event
? если нет, то как можно это исправить?
Проблема здесь в том, как компонент отображается. Точнее, как он прикреплен к телу документа.
исходный рендер выглядит следующим образом:
const root = document.createElement("div");
const { queryByText, getByTestId, debug } = render(BaseApp, {
container: root,
attachTo: document.body,
});
свойство attachTo
, кажется, ведет себя неправильно, но вместо этого решается следующим образом:
const root = document.createElement("div");
document.body.appendChild(root);
const { queryByText, getByTestId } = render(BaseApp, {
container: root,
});
это увеличивает количество пройденных тестов в этом примере с 4/8 до 7/8, при этом не проходит только тест флажка happy-dom.