Cypress系列(22)- 可操作类型的命令 之 select()

简介: Cypress系列(22)- 可操作类型的命令 之 select()

如果想从头学起Cypress,可以看下面的系列文章哦

https://www.cnblogs.com/poloyy/category/1768839.html

 

.select()


<select> 中选择一个 <option>

 

语法格式

// 选中指定值的选项
.select(value)
// 选中指定值的多个选项
.select(values)
// 选中指定值的选项,且带参数
.select(value, options)
// 选中指定值的多个选项,且带参数
.select(values, options)


参数讲解

image.png


正确用法

// 选择 值=user的 option
cy.get('select').select('user')


错误用法

// 不能直接通过 cy 调用
cy.select('John Adams')
// location 并不是 select 元素
cy.location().select()


前端 html 代码


后面的多个 .select() 栗子都以这个 html 页面为基础哦

image.png


.select(value) 的栗子


测试文件代码

image.png


重点

.select() 可以传 value 属性(“1”),或者文本内容(“oranges”)

 

.select(values) 的栗子


测试文件代码

image.png


  • 后面再讲 .invoke()
  • 需要注意,如果要选多个 option 的话, <select> 必须这样写 <select multiple>

 

.select(value, options) 的栗子


测试文件代码

image.png

  • 它的错误提示也很明显指明了解决方案
  • use {force : true} to disable error checking【通过 { force : true } 来禁止错误检查】

 

再来看看元素不可见时,命令会提示啥

  • this element is not visible
  • 简直不要太人性化好吧

image.png


.select(values, options) 的栗子


测试文件代码

image.png


特殊场景


html 代码

<select disabled>
    <option value="sz">深圳</option>
    <option value="gz">广州</option>
</select>


重点是 select 加了 disabled

 

测试代码

cy.get("select").eq(2).select("sz", {force: true})

 

测试结果

image.png

即使加了 {force : true} ,也不会禁止检查 <select> 是否可以选择 option,如果加了disabled,代表不可选择,所以仍然报错

 

结尾


本文是博主基于对蔡超老师的《Cypress 从入门到精通》阅读理解完后输出的博文,并附上了自己的理解

对书籍感兴趣的,大家可以参考本篇博客:https://www.cnblogs.com/poloyy/p/13052972.html,考虑自身需求进行购买

 

我的博客即将同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=12vd92hxgwgj1

相关文章
|
6月前
|
测试技术
Cypress的skip 和only 字段如何使用?
Cypress的skip 和only 字段如何使用?
Cypress的skip 和only 字段如何使用?
|
6月前
|
C++
MFC编程 -- 列表删除单行及多行操作
MFC编程 -- 列表删除单行及多行操作
80 1
|
Go Python
Go-文件目录操作分类详解(创建、打开、关闭、读取、写入、判断等)
Go-文件目录操作分类详解(创建、打开、关闭、读取、写入、判断等)
423 0
Go-文件目录操作分类详解(创建、打开、关闭、读取、写入、判断等)
|
JSON Shell 测试技术
gookit/config - Go应用配置管理,支持多种格式,多文件加载,支持数据合并,解析环境变量名等等
gookit/config - Go应用配置管理,支持多种格式,多文件加载,支持数据合并,解析环境变量名,绑定数据到结构体等等
194 0
gookit/config - Go应用配置管理,支持多种格式,多文件加载,支持数据合并,解析环境变量名等等
|
JavaScript
Cypress系列(23)- 可操作类型的命令 之 trigger()
Cypress系列(23)- 可操作类型的命令 之 trigger()
334 0
Cypress系列(23)- 可操作类型的命令 之 trigger()
|
JavaScript 前端开发
Cypress系列(19)- 可操作类型的命令 之 type()
Cypress系列(19)- 可操作类型的命令 之 type()
235 0
Cypress系列(19)- 可操作类型的命令 之 type()
|
前端开发
Cypress系列(21)- 可操作类型的命令 之 check()、uncheck()
Cypress系列(21)- 可操作类型的命令 之 check()、uncheck()
319 0
Cypress系列(21)- 可操作类型的命令 之 check()、uncheck()
|
JavaScript
Cypress系列(20)- 可操作类型的命令 之 clear()
Cypress系列(20)- 可操作类型的命令 之 clear()
211 0
Cypress系列(20)- 可操作类型的命令 之 clear()
|
JavaScript
Cypress系列(18)- 可操作类型的命令 之 点击命令
Cypress系列(18)- 可操作类型的命令 之 点击命令
547 0
Cypress系列(18)- 可操作类型的命令 之 点击命令
Cypress系列(47)- 操作上一条命令返回结果的命令
Cypress系列(47)- 操作上一条命令返回结果的命令
181 0