Cypress.io最佳实践，通用选择器支持文件？

在阅读文档中的最佳实践时，我没有看到任何关于为所有选择器使用支持文件以提高可维护性的内容。

---

也许这是一个非常简单的问题，但在Cypress中，什么是最佳实践？我应该创建一个公共常量文件来传递到每个测试中，还是在commands.js文件中声明这些选择器？

这是一个很长的答案，但是如果我只是说“将它们保留在spec文件中”，而没有剩下的解释，那将是一个糟糕的建议

与共享选择器文件不同，我发现在spec文件中非常成功的做法是将选择器作为

const

对象保留在顶部，但使spec文件特定于页面/url。这样就不需要复制选择器，因为使用该选择器的所有操作都将存在于一个文件中

有一些例外情况，但一般来说，每当测试导航到一个新的URL时，测试将断言已经完成的任何工作，URL已经更新，测试将结束。如果另一个测试要求在不同的页面上进行设置，我们将通过API请求或存根网络请求以编程方式设置该状态，然后该测试将通过直接导航到它将要测试的页面的URL开始

有些组件可以跨多个页面共享，并且可以在多个规范中使用，例如导航栏、页眉或页脚。我们将创建一个包含该组件的操作和选择器的类，然后使用该类，而不是在几个不同的规范中复制操作和选择器

示例：如果您的测试是“用户可以编辑其配置文件”，请执行以下步骤：

user-profile-spec.js

：

• 登录
• 单击导航栏中的配置文件
• 在配置文件页面中单击“编辑”按钮
• 上传新的个人资料照片
• 编辑配置文件信息
• 拯救
• 断言更新所有字段和配置文件照片

它将成为：

主页-spec.js

：

• 通过共享自定义命令

  cy.login（用户名、密码）

• cy.visit（“/home”）

  中的

  beforeach（）

“用户可以导航到配置文件页”

• 单击“配置文件”访问配置文件
• 断言导航到

  /profile

  已成功

profile-page-spec.js

：

• 通过共享自定义命令

  cy.login（用户名、密码）

• cy.visit（“/profile”）

  在

  beforeach（）中

“用户可以导航到编辑配置文件页面”

• 单击“编辑配置文件”
• 断言导航到

  /profile/edit

  已成功

edit-profile-page-spec.js

：

• 通过共享自定义命令

  cy.login（用户名、密码）

• cy.visit（“/profile/edit”）

  在

  beforeach（）中

“用户可以编辑配置文件字段”

• 编辑一些字段
• 单击保存
• 使用

  cy.route

  断言已触发请求以更新后端中的配置文件

“用户可以更改个人资料照片”

• 上传新照片
• 使用

  cy.route

  断言已触发请求以更新后端中的照片

---

这似乎需要更多的前期工作，但设置步骤只进行一次明确测试，并在其他任何地方避免，这意味着如果设置步骤被破坏，您只会得到一次测试失败，因为

用户可以导航到配置文件页

——这很明显，但其他测试都会通过。您还可以快速引用选择器，因为它们位于使用它们的相同位置。所有这些都意味着易于维护和测试失败调查—这是UI测试的关键。

不确定您的要求，但我以前从未见过这样做。如果在多个文件中有相同的选择器，那么将其作为命令可能会起作用。我没有投你反对票。。