react-testing-library - 检查 HTML 元素类型以获取 React 测试库的 getByText 的结果？

Question

我可以通过它的文本找到一个元素并检查它是否是一个链接：

const Link = Parent.getByText('This is a link', { exact: false });
expect(Link).toHaveAttribute('href', 'www.somewhere.com');

如何检查这个其他元素（我通过文本找到）不是链接？

const NotALink = Parent.getByText('Not a link', { exact: false });

标签： react-testing-library

Answer 1

测试库文档有一个优先级，他们推荐的第一个查询是queryByRole，您可以在其中按特定角色查询，也可以按名称查询，这是您的情况。

你可以做：

expect(screen.getByRole('link', { name: /this is a link/i })).toBeInTheDocument();

expect(screen.queryByRole('link', { name: /not a link/i })).toBe(null);

请注意，如果元素不存在，则需要执行 queryBy，因为 getBy 查询将引发错误并使您的测试失败。