如何将 Cypress "data-cy" 添加到 Next.js Link？

Question

如果 Link 有一个 <a>，这就是我可以添加 data-cy 的方法。但是如果Link没有呢？

<Link href="/about/">
    <a data-cy="nav-item">About</a>
</Link>

https://imranhsayed.medium.com/using-cypress-with-next-js-for-end-to-end-testing-cypress-nextjs-example-af100609cf16

Answer 1

<Link> 永远不会实际出现在客户端 DOM 中。

是'just'用来让next.js知道你想要in-app导航。如果您单独使用 <a>，则每次单击 link 时都会重新加载整个页面。阅读更多 here

由于 Cypress 就像一个用户，实际点击 DOM 中的 <a>，在这种情况下您根本不需要担心 <Link>。