Как запросить нативные элементы html при тестировании приложения React с помощью Jest?

Question

Когда я рендерим элементы React, например, Button, в DOM создается эквивалентный элемент кнопки HTML.

Но, когда я запрашиваю DOM, я все еще получаю обернутый элемент .

HTMLButtonElement {
      '__reactInternalInstance$gt1haeiqrhv': FiberNode {
        tag: 5,
        key: null,
        ...
}

Почему я не получаю нативный элемент, как если бы я рендерил обычный div с использованием JSDOM? Есть ли способ получить его?

Answer 1

Полагаю, вам нужно запросить getDOMNode:

const button = wrapper.find('button').getDOMNode();
// const button = wrapper.getDOMNode(); // <---if wrapper is button element

Это даст вам лежачий элемент dom в компоненте.