如何在Cypress中通过GRID_SELECTOR定位无直接属性的input元素？

方案一：修改GRID_SELECTOR为CSS选择器（推荐，无需额外配置） #

直接把GRID_SELECTOR的值改成包含目标input的CSS选择器组合：

GRID_SELECTOR = "[data-cy='our-grid'] input:nth-of-type(2)"

之后调用cy.get(selectors.GRID_SELECTOR)就能直接定位到<input bbbb>。

解释：[data-cy='our-grid']先定位到grid容器，input:nth-of-type(2)选中容器下所有input元素中的第二个，完全匹配你的需求。你可以在Chrome DevTools控制台用document.querySelector("[data-cy='our-grid'] input:nth-of-type(2)")提前验证这个选择器是否有效。

方案二：使用XPath（需额外配置插件） #

Cypress默认不支持XPath，要使用你在DevTools里测试的XPath表达式，需要先安装XPath插件：

1. 安装依赖：

npm install -D cypress-xpath

2. 在Cypress的支持文件（比如cypress/support/e2e.js）中导入插件：

require('cypress-xpath')

3. 修改GRID_SELECTOR为你的XPath字符串，然后用cy.xpath()调用：

GRID_SELECTOR = "//grid[@data-cy='our-grid']//input[2]"
// 调用方式
cy.xpath(selectors.GRID_SELECTOR)

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