本文详解如何使用 cypress 的 eq() 命令精准选择多个具有相同类名和属性的 元素（如 ant design 的 ant-input-number-input），并可靠地执行 .type() 输入操作，避免因元素重复导致的定位失败。
在 Cypress 测试中，当页面存在多个结构完全一致的输入框（例如两个 Ant Design 的数字输入组件），仅靠通用选择器（如 .ant-input-number-input）会匹配多个 DOM 元素，而 cy.get() 默认只对第一个匹配元素执行后续命令。若直接调用 .type()，不仅可能作用于错误的目标，还可能因元素不可交互（如被遮挡、未渲染完成或 disabled 状态）而抛出“element not interactable”错误。
✅ 正确做法是：结合语义化属性增强选择器唯一性 + 使用 eq() 显式索引定位。
首先，观察 HTML 片段：
两个元素共享 class="ant-input-number-input" 和 role="spinbutton"。推荐优先利用 role 属性提升可访问性语义匹配精度，组合成更健壮的选择器：[role="spinbutton"].ant-input-number-input。
接着，使用 eq(n) 按 0 起始索引选取目标元素：
// ✅ 正确：定位第一个数字输入框并输入 25
cy.get('[role="spinbutton"].ant-input-number-input').eq(0).clear().type('25');
// ✅ 正确：定位第二个数字输入框并输入 42
cy.get('[role="spinbutton"].ant-input-number-input').eq(1).clear().type('42');⚠️ 注意事项：
- .text(25) 是错误用法 —— Cypress 中没有 .text() 这个命令用于输入；应使用 .type('25')（字符串形式）；
- 强烈建议在 .type() 前添加 .clear()，防止残留值干扰；
- 若需确保元素已就绪（如动态加载、动画后出现），可加显式等待：.should('be.visible').should('be.enabled')；
- 更健壮的替代方案包括：使用 data-cy 属性（推荐在开发阶段为关键输入框添加，如 data-cy="quantity-input-1"），或结合父容器上下文定位（如 cy.get('.form-section').find('.ant-input-number-input').eq(1)）。
? 总结：面对重复结构元素，避免依赖顺序隐式行为；始终通过组合属性、索引（eq()）或业务语义（data-cy）实现确定性定位——这是编写稳定、可维护 Cypress 测试的核心实践。
