如何使用Cypress点击页面上的多个同名按钮？

• 按索引定位
  如果按钮位置固定，用eq(index)指定具体按钮（索引从0开始）。比如页面有3个"提交"按钮，点击第二个：

  cy.contains('提交').eq(1).click()
  

  也可以用first()、last()快速选中第一个或最后一个：

  cy.contains('提交').first().click()
  cy.contains('提交').last().click()
  

• 结合上下文/父元素定位
  按钮肯定属于不同的容器，先定位到按钮所属的父元素，再在范围内查找。比如按钮在第一个form-container类的表单里：

  cy.get('.form-container').first().contains('提交').click()
  

  用within()限定作用域，代码更清晰：

  cy.get('.user-profile-section').within(() => {
    cy.contains('保存').click() // 仅在该区域内查找"保存"按钮
  })
  

• 通过唯一属性区分
  多数按钮会有data-testid、id这类唯一标识属性，直接用它们定位最稳定：

  // 用data-testid定位
  cy.get('[data-testid="submit-order-btn"]').click()
  // 用id定位
  cy.get('#submit-user-form').click()
  

  如果没有现成标识，建议让开发添加data-testid，这是UI自动化测试的最佳实践，能避免文本或位置变动导致用例失效。

• 结合其他属性过滤
  若按钮有不同class或状态（如禁用/启用），用filter()筛选：

  // 选择可用的"提交"按钮（排除禁用状态）
  cy.contains('提交').filter(':not([disabled])').click()
  // 选择带特定class的按钮
  cy.contains('提交').filter('.primary-btn').click()
  

内容的提问来源于stack exchange，提问作者Atakshi Joshi