阅读时间： 3 分钟
大家好。在这篇博客中，我们将了解如何使用Cypress处理控件UI。什么是Web控件？Web控件的用户界面基本上是被包裹的HTML元素。它是ASP+中易于使用的脚本标签，在你的表格或页面中提供丰富的功能。它的范围从简单的文本框到先进的围栏和列表。网络控制用户界面分为五类：显示、输入、选择、验证和特殊用途。让我们深入了解一下如何使用Cypress处理Web控件用户界面？
我们可以将我们的主题细分为。
- 首先，如何验证和自动处理复选框？
- 其次，处理静态下拉
- 最后，处理可见和不可见元素
如何验证和自动处理复选框？
有一些基本的命令被用来验证和自动处理复选框。其中一些命令如下
- 点击所有的复选框
- 点击一个有ID的复选框
- 点击一个值为 "Real "的复选框的命令
cy.get('input[type="checkbox"]').check('Real')
- 点击有选项的复选框
cy.get('.chk').check({force : true})
- 取消所有的复选框
- 取消点击一个带有id的复选框
cy.get('#chk').uncheck()
- 取消点击一个值为 "Real "的复选框
cy.get('.chk').uncheck('Real', options)
让我们写一个程序来检查和取消Gmail注册页面的 "显示密码"。
输出是。
如何处理静态下拉菜单？
同样地，下面是一些处理静态下拉的命令。
- 首先，用于选择 "真实 "选项的命令
- 然后，选择 "真实 "和 "虚幻 "选项的命令
- 最后，选择多个选项值的命令
让我们写一个静态下拉程序。这里我们将用选项'99'来选择国家。
因此，输出是。
如何处理可见和不可见的元素？
Cypress可以处理不可见元素。对于处理隐藏的元素，Cypress采取了jQuery方法show的帮助。它使用命令**（invoke['show']）。**
让我们写一个程序，从亚马逊网页 "登录 "中找到隐藏的元素。
输出是
