本文介绍在 cypress 测试中，如何对一组具有相同 css 选择器的多个 dom 元素（如 10 个）中仅点击指定子集（如前 5 个），避免 `multiple: true` 全量点击或 `cy.click()` 报“只能作用于单个元素”的错误。
在 Cypress 中，cy.get(selector) 返回的是一个链式命令对象（而非原生 NodeList 或数组），因此不能直接使用 .slice()、for 循环或 Lodash 工具函数（如 Cypress._.times()）来操作元素集合——这些操作会中断 Cypress 的命令队列，导致 cy.click() 报错：“can only be called on a single element”。
正确的方式是利用 Cypress 内置的 .each() 命令：它会逐个遍历匹配到的 DOM 元素，并将每个原生 DOM 元素（$el）及其索引（index）传入回调函数。此时，你可在回调中加入条件逻辑，再通过 cy.wrap($el) 将单个元素重新封装为 Cypress 链式对象，从而安全调用 .click()。
以下是一个典型示例，点击前 5 个匹配 .product-card 的元素：
cy.get('.product-card').each(($el, index) => {
if (index < 5) {
cy.wrap($el).click({ force: true }); // force 可选，用于处理遮挡或不可见场景
}
});你也可以灵活扩展逻辑，例如：
- 点击偶数索引元素：if (index % 2 === 0)
- 按文本内容筛选后点击：if ($el.text().includes('Premium'))
- 跳过禁用状态元素：if (!$el.prop('disabled'))
⚠️ 注意事项：
- 不要在 .each() 外部使用 cy.get().eq(n) 链式调用多个 .click()，因为 .eq() 会截断命令流，且无法批量控制；
- 避免在回调中使用 cy.get() 重新查询——这会导致冗余查找和潜在竞态问题；
- 若需确保所有点击按顺序执行（如依赖状态变更），.each() 天然保证串行；若需并行（不推荐），应改用自定义命令或 Promise.all（但会失去 Cypress 自动重试与截图能力）；
- 对于大量元素（如 >50），建议添加 cy.log(Clicking item #${index + 1}) 提升调试可读性。
总结：.each() 是 Cypress 官方推荐、语义清晰且符合其异步命令式设计范式的解决方案。它既规避了 multiple: true 的过度行为，又绕开了原生 JS 数组操作与 Cypress 命令链的兼容性陷阱，是处理“部分点击同选择器元素”场景的最佳实践。
