React 测试：是否应该测试文本内容？

Question

应该测试元素的文本内容，还是只测试其可见性？我认为这是一个什么是实现细节的问题。

示例：

it('renders post body', async () => {
    getPost.resolves(fakePost)
    const { getByTestId } = render(<Post />)
    await wait(() => getByTestId('post-body'))
    expect(getByTestId('post-body')).toBeVisible()
    // Should this next line be included?
    expect(getByTestId('post-body')).toHaveTextContent(fakePost.body)
})

我觉得这是关于如何呈现正文文本的实现细节，我应该只关心呈现的内容。

例如，接下来我想将正文文本存储为 markdown 并将其呈现为 HTML。要实现这一点，我必须首先更改测试，因为存储的文本不再等于 DOM.

中呈现的文本

但是，如果只测试渲染元素的可见性，并不能保证元素实际上包含任何东西。我觉得测试应该比那更安全。

expect(getByTestId('post-body')).not.toBeEmpty() 出现在 jest-dom api 中，但即使该元素仅包含另一个没有实际文本内容的元素，它也会通过。

Answer 1

特别感谢 guiding principals，我认为可以公平地说，如果您测试组件或应用程序的方式与您指示人员在生产环境中测试它的方式相同，那么您做对了。

如果您的组件正在接受 API 调用，并将其格式化为 Markdown，那么您应该测试它是否确实在正确发生。组件如何呈现（并在您的测试中模仿它）是测试实现细节的一个示例。测试什么组件呈现的不是。

我知道这是一句很好的台词，但我认为你应该加上你的最后一行。我也认为如果你能找到一种通过 something other than test-id.

查询的方法就太好了

React 测试：是否应该测试文本内容？

React Testing: Should Text Contents Be Tested For?

javascript

reactjs

tdd

bdd

react-testing-library