使用 Jest 測試 React 應用程序時如何查詢原生 html 元素？

Question

當我渲染 React 元素時，例如一個 Button，然后在 DOM 中創建了一個等效的 HTML 按鈕元素。

但是，當我查詢 DOM 時，我仍然得到一個包裝元素。

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

為什么我不能像使用 JSDOM 渲染普通 div 一樣獲得本機元素？ 有沒有辦法得到它？

Answer 1

我想你必須查詢getDOMNode ：

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

它將為您提供組件中的謊言 dom 元素。