测试：在带有react-testing-library的react-router-dom中单击（fireEvent.click）链接不会触发

Question

我正在使用react-testing-library 测试来自“react-router-dom”的链接。

通常单击此链接，应该会出现linkId在页面上。

但是 fireEvent.click 在我的测试中，没有触发该操作。因此我没有我的内容。

      <ul>
        <li>
          <Link  data-testid="item" to={generatePath(LINK_TEST, { linkId: 'Link_test1' })}>Link Test 1</Link>
        </li>
... test : 

    const linkButton = getByText(/Link Test 1/)

    fireEvent.click(linkButton)

    const content = queryAllByText(/Page : Link_test1/)
    await waitForElement(() => content)
    expect(content).toHaveLength(1)

Answer 1

如果现在提供我的意见还不算太晚：

您正在启动单击，但未指定单击哪个按钮。您的代码行应该如下所示：

  fireEvent.click(linkButton, { button: 0});

As 的button: 0意思是“左键单击”。希望这可以帮助。

编辑：此外，我认为await在这种情况下不需要。如果这是整个代码的一部分，您可能确实需要它，但在类似的情况下，我只需触发单击事件，然后检查我期望在文档中出现的内容是否在文档中，例如：

expect(getByText('Page : Link_test1')).toBeInTheDocument();

或者类似的东西，因为我不太确定点击链接后您期望什么。请注意，这.toBeInTheDocument()是一个方法，'@testing-library/jest-dom'并且导入为

'@testing-library/jest-dom/extend-expect'