Cypress select 下拉列表中的最后一个选项

Question

我有一个动态生成的下拉菜单，其正常结构如下：

<select>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
etc.
</select>

这是一种分页，我不知道 table 中会有多少项目，也不想根据项目数计算下拉列表中有多少选项和哪些数字。

我想用 Cypress 实现的只是 select 最后一个选项。

我知道我可以 select 任何选项的名称或值，例如cy.get('select').select('10')

还有索引：cy.get('select').select(0)

但是我不知道最后一个索引。

我也试过 select().last() 但这不起作用，因为 select 不能为空。

Answer 1

你可以这样做。首先获取选项的数量，然后使用 select 最后一项。

cy.get('select')
  .find('option')
  .its('length')
  .then((len) => {
    cy.get('select').select(len - 1)
  })

Answer 2

如果您的选项是动态的，您应该确保在选择之前填充列表

cy.get('select option')
  .should('have.length.gt', 0)

cy.get('select option')
  .last()
  .then($lastOption => {
    cy.get('select').select($lastOption.text())
  })

Cypress select 下拉列表中的最后一个选项

Cypress select last option in dropdown

select

dynamic-content

cypress