首页 > 解决方案 > 使用反应测试库检查文本是否出现在元素内

问题描述

我正在使用Testing Library为 React 应用程序编写一些测试。我想检查是否出现了一些文本,但我需要检查它是否出现在特定位置,因为我知道它已经出现在其他地方。

查询的测试库文档getByText查询需要一个container参数,我猜它可以让您在该容器中搜索。我尝试这样做,并按照文档中指定的顺序使用containerand参数:text

const container = getByTestId('my-test-id');
expect(getByText(container, 'some text')).toBeTruthy();

我得到一个错误:matcher.test is not a function

如果我把参数反过来:

const container = getByTestId('my-test-id');
expect(getByText('some text', container)).toBeTruthy();

我得到一个不同的错误:Found multiple elements with the text: some text

这意味着它不在指定的容器内搜索。

我想我不明白它是如何getByText工作的。我究竟做错了什么?

标签: javascriptreactjsreact-testing-library

解决方案


最好within用于此类事情:

const { getByTestId } = render(<MyComponent />)
const { getByText } = within(getByTestId('my-test-id'))
expect(getByText('some text')).toBeInTheDocument()

推荐阅读