持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第15天，点击查看活动详情
.select()
在 <select> 中选择一个 <option>
语法格式
// 选中指定值的选项
.select(value)
// 选中指定值的多个选项
.select(values)
// 选中指定值的选项，且带参数
.select(value, options)
// 选中指定值的多个选项，且带参数
.select(values, options)
参数讲解
正确用法
// 选择 值=user的 option
cy.get('select').select('user')
错误用法
// 不能直接通过 cy 调用
cy.select('John Adams')
// location 并不是 select 元素
cy.location().select()
前端 html 代码
后面的多个 .select() 栗子都以这个 html 页面为基础哦
.select(value) 的栗子
测试文件代码
重点
.select() 可以传 value 属性（“1”），或者文本内容（“oranges”）
.select(values) 的栗子
测试文件代码
- 后面再讲 .invoke()
- 需要注意，如果要选多个 option 的话， 必须这样写
.select(value, options) 的栗子
测试文件代码
重点
因为第二个<select> 默认是不可见状态，所以不加 {force:true} 会报错，如下图
- 它的错误提示也很明显指明了解决方案
- use {force : true} to disable error checking 【通过 { force : true } 来禁止错误检查】
再来看看元素不可见时，命令会提示啥
- this element is not visible
- 简直不要太人性化好吧
.select(values, options) 的栗子
测试文件代码
特殊场景
html 代码
<select disabled>
<option value="sz">深圳</option>
<option value="gz">广州</option>
</select>
重点是 select 加了 disabled
测试代码
cy.get("select").eq(2).select("sz", {force: true})
测试结果
即使加了 {force : true} ，也不会禁止检查 <select> 是否可以选择 option，如果加了disabled，代表不可选择，所以仍然报错
