cypress系列（12）-cypress编写和组织测试用例篇之断言(代码片段)

关键词：

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

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

前言

• 断言是测试用例的必要组成部分
• 没有断言，咱们就不知道测试用例的有效性，到底通过没通过
• Cypress 的断言基于 Chai 断言库，并且增加了对 Sinon-Chai、Chai-jQuery 断言库的支持，其中就包括 BDD 和 TDD 格式的断言

BDD 格式的断言

• expect
• should

TDD 格式的断言

assert

常见的断言方式

以下列出了常见的元素断言

长度（Length）

// 重试，直至找到3个匹配的<li.selected>
cy.get(‘li.selected‘).should(‘have.length‘,3)

重点： hava.length 

类（Class）

// 重试，直至这个input不再有disabled的class
cy.get(‘form‘).find(‘input‘).should(‘not.hava.class‘,‘disabled‘)

重点： not.hava.class 

值（Value）

// 重试，直至这个textarea的值为 poloyy
cy.get(‘textarea‘).should(‘have.value‘,‘poloyy‘)

重点： have.value 

文本内容（Text Content）

// 重试，直至这个span不再包含‘click me‘
cy.get(‘a‘).parent(‘span.help‘).should(‘not.contain‘,‘click me‘)

重点： not.contain 

针对元素是否可见（Visibility）

// 重试，直至button可见
cy.get(‘button‘).should(‘be.visible‘)

重点： be.visible 

针对元素是否存在（Existence）

// 重试，直至 id=loading 元素不再存在
cy.get(‘#loading‘).should(‘not.exist‘)

重点： not.exist 

针对元素状态（State）

// 重试，直至radio状态是checked
cy.get(‘:radio‘).should(‘be.checked‘)

重点： be.checked 

针对 CSS

// 重试，直至complete这个类有匹配的css为止
cy.get(‘.completed‘).should(‘have.css‘,‘text-decoration‘,‘line-through‘)

重点： hava.css 

针对回调函数（callback）

如果内建的断言没有满足你的需求，可以自己写断言函数，然后作为一个回调以参数的形式传给 .should() 

假设源HTML如下

<div class="main-abc123 heading-xyz987">Introduction</div>

自己写的断言函数

cypress系列-cypress编写和组织测试用例篇之钩子函数hook

如果想从头学起Cypress，可以看下面的系列文章哦https://www.cnblogs.com/poloyy/category/1768839.html Hook就是常说的钩子函数，在 pytest框架里面也有hook这个概念；接下来就让我们来看看Mocha提供的Hook函数叭！ Mocha提供的Hook函数&n... 查看详情

cypress系列-cypress编写和组织测试用例篇之.skip()和.only()的详细使用

如果想从头学起Cypress，可以看下面的系列文章哦https://www.cnblogs.com/poloyy/category/1768839.html 前言在做自动化测试中，跳过执行某些测试用例，或只运行某些指定的测试用例，这种情况是很常见的Cypress中也提供了这种功能 跳... 查看详情

cypress系列-cypress的初次体验(代码片段)

如果想从头学起Cypress，可以看下面的系列文章哦https://www.cnblogs.com/poloyy/category/1768839.html 前言这里的栗子项目时Cypress提供的，在 github上，所以要clone到本地的话需要装Git哦！ 下载被测应用进入要安装该应用的目录，c... 查看详情

cypress系列-解析cypress的默认文件结构

如果想从头学起Cypress，可以看下面的系列文章哦https://www.cnblogs.com/poloyy/category/1768839.html 默认文件结构在使用 cypressopen 命令首次打开Cypress，Cypress会自动进行初始化配置并生成一个默认的文件夹结构，如下图 前言... 查看详情

cypress系列之----03自定义命令customcommands(代码片段)

...建各种自定义命令，重写命令，官方参考资料：https://on.cypress.io/custom-commands////***********************************************//--Thisisaparentcommand--父命令，用cy可以直接调用//Cypress.Commands.add(‘login‘,(email,password)=>...)////--Thisisachildcommand--... 查看详情

cypress那点事

参考技术ACypress初体验Cypress测试用例的一些编写技巧Cypress查找元素的一些技巧CypressExist控件存在操作判断Cypress一些鼠标事件Cypress键盘按键事件Cypress发送api请求Cypress设置LocalStorageCypress命令行操作Cypress增加自定义header访问Cypress... 查看详情

如何在 Cypress 中访问 baseURL 的值

】如何在Cypress中访问baseURL的值【英文标题】：HowtoaccessthevalueofbaseURLinCypress【发布时间】：2019-03-2919:12:10【问题描述】：我刚刚开始学习JavaScript，并且一直在使用Cypress来自动化一些回归测试。我目前编写的测试旨在验证页眉和... 查看详情

cypress系列（38）-go()命令详解(代码片段)

如果想从头学起Cypress，可以看下面的系列文章哦https://www.cnblogs.com/poloyy/category/1768839.html 作用在浏览器历史记录中，访问前一个或后一个URL 语法格式cy.go(direction)cy.go(direction,options)options：只有timeout和log，不再展开讲了&nbs... 查看详情

cypress高级用法系列一(代码片段)

1.MultipleAssertionscy.get(\'[data-cy=task]\').then(item=>expect(item[0]).to.contain.text(\'bread\')expect(item[1]).to.contain.text(\'milk\'))用then()就不会retry,即使页面发生变化，expectassertion也不会retry.cy.g 查看详情

Cypress 在自定义命令中加载环境变量

】Cypress在自定义命令中加载环境变量【英文标题】：Cypressloadenvironmentvariablesincustomcommands【发布时间】：2021-05-1020:46:54【问题描述】：我正在构建一个Next.js应用程序并使用Cypress编写我的测试。我在本地使用.env.localfile配置环境... 查看详情

在 github 操作中使用 .shadow() 和 cypress.io

】在github操作中使用.shadow()和cypress.io【英文标题】：Using.shadow()withcypress.ioingithubactions【发布时间】：2021-12-0523:54:41【问题描述】：我正在使用Cypress在React中编写一些e2e测试。我让它在我的本地开发环境中正常工作，但是当测试... 查看详情

运行cypress第一个测试脚本(代码片段)

一.启动Cypress　　进入cypress安装目录，输入yarnruncypressopen启动cypress　　  二.启动测试项目　　进入到项目文件夹启动测试项目　　 三.编写测试脚本　　在生成的integration文件夹下编写测试用例testLogin.js1//testLogin.js2///... 查看详情

运行cypress第一个测试脚本(代码片段)

一.启动Cypress　　进入cypress安装目录，输入yarnruncypressopen启动cypress　　  二.启动测试项目　　进入到项目文件夹启动测试项目　　 三.编写测试脚本　　在生成的integration文件夹下编写测试用例testLogin.js1//testLogin.js2///... 查看详情

Cypress：类型组合键

】Cypress：类型组合键【英文标题】：Cypress:typecombinationofkeys【发布时间】：2021-05-1802:50:00【问题描述】：我正在尝试编写键盘快捷键\'ctrl+space\'我试过了cy.get(\'body\').type(\'ctrlspace\');但它不起作用你有什么建议？【问题讨论】：您... 查看详情

前端自动化测试框cypress入门

一：Cypress简介随便着Web应用项目的不断发展，测试也要不断发展，Cypress是为现代网络打造的，基于JavaScript语言的一种前端自动化测试工具，测试也是如此，对浏览器中运行的所有内容进行快速，轻松和可靠的测试。Cypress是自... 查看详情

如何使用 Cypress 测试 AWS Amplify Angular Authenticator 组件？

】如何使用Cypress测试AWSAmplifyAngularAuthenticator组件？【英文标题】：HowcanItestAWSAmplifyAngularAuthenticatorcomponentusingCypress?【发布时间】：2020-12-2206:03:12【问题描述】：我希望能够在cypress测试中将测试输入“键入”到AWSAmplifyAuthenticator... 查看详情

如何在cypress Cucumber中编写Given，When，Then等可以使用的通用步骤定义

】如何在cypressCucumber中编写Given，When，Then等可以使用的通用步骤定义【英文标题】：HowtowriteacommonstepdefinitionwhichcanbeusedbyGiven,When,Thenetc.incypressCucumber【发布时间】：2021-09-0802:11:05【问题描述】：我最近将cucumber与cypress集成并添加... 查看详情

在 Cypress 中运行测试的所有断言

】在Cypress中运行测试的所有断言【英文标题】：RunallassertionsofatestinCypress【发布时间】：2020-06-3011:38:03【问题描述】：我有一个关于测试结构的问题。docs明确声明要编写具有多个断言的测试，而不是编写具有单个断言的多个测... 查看详情