有两种使用查询的方法react-testing-library。您可以使用该render方法返回的查询：import React from 'react'import { render } from '@testing-library/react'...const { getByText } = render(<div>Foo</div>)expect(getByText('Foo')).toBeInTheDocument()或者你可以使用screen对象：import React from 'react'import { render, screen } from '@testing-library/react'...render(<div>Foo</div>)expect(screen.getByText('Foo')).toBeInTheDocument()但是文档中没有说明哪一个是最好的选择以及为什么。有人可以启发我吗？
3 回答
森栏
TA贡献1810条经验 获得超5个赞
react-testing-library作者Kent C. Dodds本人最新推荐的选项是使用screen.
使用屏幕的好处是您不再需要在添加/删除所需查询时保持渲染调用解构是最新的。您只需要输入屏幕。让您的编辑器神奇的自动完成功能来处理其余的事情。
唯一的例外是，如果您正在设置可能应该避免这样做的容器或 baseElement（老实说，我再也想不出这些选项的合法用例了，它们目前仅出于历史原因而存在）。
来源：https ://kentcdodds.com/blog/common-mistakes-with-react-testing-library#not-using-screen
慕姐8265434
TA贡献1813条经验 获得超2个赞
screen由 提供@testing-library/dom，这@testing-library/react是建立在它之上的。使用这些screen方法时，它们将在 html<body>元素中进行查询，如文档中所述：
因为查询整个 document.body 很常见，DOM 测试库还导出了一个 screen 对象，其中包含预先绑定到 document.body 的每个查询
render()仅在@testing-library/react. 它返回一个类似于的对象screen，默认情况下也将查询绑定到<body>. 默认情况下，几乎没有区别，但您可以通过传入 options来自定义其行为。
例如，您可以指定要在其中查询之外的元素<body>，甚至可以提供自定义查询方法。
为了回答您关于哪个是最好的问题，我会说 usingrender()更好，因为options它更灵活，但要引用文档：
您不需要经常指定选项
不过，我更喜欢使用 提供的方法render()，因为如果您决定添加选项，则无需记住更改所有查询。
添加回答
举报
0/150
提交
取消