如何使用赛普拉斯在特定的 HTML <select> 字段中选择 <option>？

Question

我想从下面的 HTML 代码中选择选项。 timeentry_lov1 是选择名称，它是 Page 中具有相同名称的第二个元素。我还检查了页面中没有框架。 但是 Cypress 中有没有像 selenium 这样的框架概念？如果没有，那么如何使用 Select 属性？

HTML：

]1

我尝试过的以下 Select 语句：

cy.get('timeentry_lov1',{timeout : 60000}).eq(1).select('NB-860').debug();
cy.get('timeentry_lov1').eq(1).select('NB-860-Test Automation');
cy.select('timeentry_lov1',{timeout : 7000}).eq(1).should('have.value','NB-860');
cy.find('timeentry_lov1').get('select').select('NB-860');

Answer 1

要在页面中查找名称等于“timeentry_lov1”的所有<select> 元素，请使用CSS selector 过滤name 属性，如下所示：

cy.get('select[name="timeentry_lov1"]')

要仅选择 second <select> 标记，您可以使用 :nth-of-type(2) 仅选择找到的第二个元素：

cy.get('select[name="timeentry_lov1"]:nth-of-type(2)')

现在，要实际选择元素，只需将cy.select() 与您要选择的<option> 的value 一起使用：

cy.get('select[name="timeentry_lov1"]:nth-of-type(2)')
.select('NB-860')

这应该可以完成您正在尝试做的事情。

---

提示：您可以使用 Cypress 的 Selector Playground 来帮助您找到在测试中使用的优秀 CSS 选择器。查看文档以获取有关其工作原理的视频。