到底可以在哪里添加要测试的元素的 data-cy 或 data-test-id 属性？

Question

我是 Cypress 自动化测试的初学者。我已经阅读了 Cypress E2E 的良好实践文档，其中建议使用data-cy或data-test-id进行元素选择。这可能是一个简单而愚蠢的问题，但我真的很想知道你们的答案。我尝试用谷歌搜索但没有运气。

究竟可以在哪里添加要测试的元素的data-cyor属性？data-test-id

A。我是否必须从开发人员团队中签出代码，然后在其中添加属性？b. 我可以invoke在 cypress 中使用该命令（就像我们可以在 jquery 中使用 invoke 添加/删除 attr 一样）吗？C。还有其他方法吗？

如果选项A. 是您的答案，那么您将遵循哪些步骤？应用代码和测试代码需要在一个项目中吗？您遵循什么层次结构的元素选择？

（更多信息：我有 Typescript 和 React 前端、sql 后端、cypress 测试项目）

Answer 1

如果data-cy或data-test-id属性未添加到项目中的元素中，则无法使用这些属性访问元素。

基本上，团队在开发前端应用程序时应该做出的决定是所有可测试元素都应该具有适当的data-cy或data-test-id提供有关元素的更多信息，并且可以轻松编写更稳定和可读的测试。

因此，我建议在团队内讨论定义将这些属性添加到现有代码和新代码中的策略。