Cypress学习总结
Cypress介绍：
1、基于javascript的前端测试⼯具，可以对浏览器中运⾏的任何内容进⾏快速，简单，可靠的测试；
2、Cypress是⾃集成的，提供了⼀套完整的端到端测试，⽆须借助其他外部⼯具，安装后即可快速的创建，编写，运⾏测试⽤例，且对每⼀步操作都⽀持回看；
3、不同于其他只能测试UI曾的前端测试⼯具，Cypress允许编写所有类型的测试，覆盖了测试⾦字塔模型的所有测试类型；
Cypress运⾏测试的⼤致流程：
1、运⾏测试后，Cypress使⽤⼯具将测试代码中的所有模块打包到⼀个js⽂件中；
2、然后，运⾏浏览器，并且将测试代码注⼊到⼀个空⽩页⾯中，然后它将在浏览器中运⾏测试代码【可以理解成Cypress将测试代码放到⼀个iframe中运⾏】
Cypress运⾏测试的技术流程：
1、每次测试⾸次加载Cypress时，内部Cypress web应⽤程序先把⾃⼰托管在本地的⼀个随机端⼝上；
2、在识别出测试中发出第⼀个cy.visit()命令后，Cypress会更改本地URL以匹配远程应⽤程序的Origin【满⾜同源策略】，这使得测试代码和应⽤程序可以在同⼀个Run loop中运⾏；
Cypress运⾏更快的根本原因：
cypress测试代码和应⽤程序均运⾏在cypress全权控制的浏览器中；且他们运⾏在同⼀个domain下的不同iframe中，所以cypress的测试代码可以直接操作dom，window object，local storages
Cypress稳定性，可靠性更⾼的原因：
cypress还可以在⽹络层进⾏即时读取和更改⽹络流量的操作；
cypress背后node.js process控制的proxy进⾏转发，这使得cypress不仅可以修改进出浏览器的的所有内容，还可以更改可能影响⾃动化操作的代码；
cypress相对于相对于其他测试⼯具来说，能从根本上控制整个⾃动化测试的流程；
Cypress安装（mac）：
通过node安装：
安装cypress ：npm install cypress
安装成功后输⼊命令：node_modules/.bin/cypress open打开cypress
e-example-recipes-master⽂件：在github中下载即可
该⽂件中放着cypress提供的演⽰项⽬，下载后，需要安装⼀个依赖包：npm install cnpm
依赖包安装成功后，使⽤该包的命令安装相关的配置包⽂件：cnpm install
在打开node端⼝前要保证本地端⼝是开着的，访问⽹页127.0.0.1，若成功访问，则是开始状态，若失败，使⽤命令：sudo apachectl start开启本地端⼝；
开启本地端⼝后，进⼊下载的⽂件夹中的logging-in_xhr-web-forms⽂件夹，输⼊命令：npm start；如果报：Error:Cannot find module
'morgan'等类似的缺包错误，使⽤命令：npm install 包名安装对应的包，再次输⼊命令：npm start；直到不再报错；
输⼊命令后展⽰如图信息，说明node端⼝启动成功了；
Cypress运⾏器：
Cypress默认⽂件结构：
1、fixtures：测试夹具：主要⽤来存储测试⽤例的外部静态数据；
fixture的实际应⽤场景：如果你的测试需要对某些外部接⼝进⾏访问并依赖它的返回值，则可以使⽤测试夹具⽽⽆须真正访问这个接⼝；使⽤测试夹具的好处：
（1）消除了对外部功能模块的依赖；
（2）已编写的测试⽤例可以使⽤测试夹具提供的固定返回值，并且你确切知道这个返回值是你想要的；
（3）因为⽆须真正的发送⽹络请求，所以测试更快；
2、integration⽂件夹：测试⽂件
3、plugin file：插件⽂件
插件的应⽤场景：
（1）动态更改来⾃cypress.json，v.json，CLI或系统环境变量的已解析配置和环境变量；
（2）修改特定浏览器的启动参数；
（3）将消息直接从测试代码传递到后端；
4、support file：⽀持⽂件
该⽬录是放置可重⽤配置项，如底层通⽤函数或全局默认配置；
该⽬录是放置可重⽤配置项，如底层通⽤函数或全局默认配置；
为了⽅便，每个测试⽂件运⾏之前，Cypress都会⾃动加载⽀持⽂件cypress/support/inddex.js;
5、cypress.json⽂件
这些配置都是默认的，要想改变的话，需要在cypress.json⽂件中对这些参数进⾏配置；
Cypress不能⽀持在⼀个测试⽤例⽂件⾥访问多个不同域名的URL（可以访问同⼀个超域下的所有⼦域），如果访问了多个不同域名的的站名，cypress会直接报错；
Cypress测试⽤⽤例的组织编写
Cypress结合Mocha，Cypress将Mocha硬编码在⾃⼰的框架中，所有编写测试⽤例都是基于Mocha提供的如下基本功能模块：
describe（）：测试套件；
context（）：和describe（）作⽤⼀样；
it（）：测试⽤例；
before（）：所有⽤例执⾏前置动作；
beforeEach（）：单个测试⽤例执⾏前置动作；
afterEach（）：单个⽤例执⾏后置动作；
after（）：所有⽤例执⾏后置动作；
only（）：指定测试⽤例或者测试套件执⾏；
skip（）：指定测试⽤例或者测试套件跳过不执⾏；
Cypress测试⽤例组织编写-断⾔：
断⾔是测试⽤例的必要组成部分，没有断⾔，我们就不知道测试⽤例的有效性，到底通过没通过；
Cypress的断⾔基于Chai断⾔库，其中就包括BDD和TDD格式的断⾔；
BDD风格的断⾔：expect、should、chai断⾔；
.not：反
.to.not.equal：不匹配
.deep：设置deep标记，然后使⽤equal和pqoperty断⾔，该标记可以让其后的断⾔不是⽐较队形本⾝，⽽是递归⽐较对象的键值对；.ok：断⾔⽬标为真值；
.true：断⾔⽬标为true，与ok的区别是不进⾏类型转换，只能为true才能通过断⾔；
.above（value）：断⾔⽬标⼤于value，least（)，below（)，most（）；
.ownProperty（name）：断⾔⽬标拥有名为name的⾃有属性；
.within（numb,numb）：长度在两个数字之间；
.closeTo（expected，delta）：断⾔⽬标数字等于expected，或在期望值的+/-delta范围内；
.oneOf（list）：断⾔⽬标出现在list数组的某个顶层位置（直接⼦元素，严格相等）：
expect('a').Of(['a'，'b'，'c'])
.increase（object，property）：断⾔⽬标⽅法会增加指定对象的属性；
Cypress元素定位器：
做UI⾃动化测试，每个测试⽤例都会包含对元素的操作；
健壮、可靠的元素定位策略可以保障测试成功率的提⾼；
相对于其他测试框架来说，Cypress提供了特别得到的定位策略，让你⽆须过多担⼼因定位失败⽽导致的测试失败；
Cypress提供了data-*属性，包含了下⾯三个定位器：
1、data-cy；
2、data-test；
3、data-testid；
重点：
1、它们都是Cypress专有的定位器，仅⽤来测试；
2、data-*属性和元素的的⾏为或样式⽆关，意味着即使CSS样式或JS⾏为改变，也不会导致测试失败；
前端测试和后端测试的区别
.get（）：获得元素；
.contains（）：获得元素；
.should（）：断⾔，判断元素；
.click（）：点击元素；
.check（）：针对input标签的单选框或者多选框，使其选中；
.log（）：打印信息；
.getCookies（）：得到页⾯cookie;
.
setCookies（）：设置页⾯cookie；
.clearCookies（）：清除页⾯cookie;
.title（）：获取页⾯title元素；
.url（）：获取页⾯url;
.pause（）：在页⾯执⾏中暂停执⾏并逐步执⾏；
.trigger()：触发⼀个元素，可以mousedown，可以morceover等，多⽤于悬空；
栗⼦：cy.xpath('元素').trigger('mouseover', { force: true })：到该元素并悬空，相当于puppeteer中的hover；RF中的 Mouse Over；.attachFile()：上传⽂件；
栗⼦：cy.get('元素').attachFile({ filePath: '⽂件名' });
Cypress PO模式：
1、将每个页⾯（或者带测试对象）封装成⼀个class，类⾥⾯包含了页⾯上所有元素及它们的操作⽅法（单步操作或者功能集合）；
2、测试代码和被测代码解耦，使⽤PO模式后，当页⾯发⽣改变，⽆须改变测试代码，仅改页⾯代码；Cypress完全⽀持PageObject模式，但存在⼀个问题，如果⼀个测试⽤例需要访问多个页⾯对象，就意味着测试中要初始化多个页⾯对象实例（new Page()）;
如果⼀个页⾯对象需要登录才能访问（⼤部分场景都是这样），则每次初始化都需要先登录后访问（只有登录后才能重⽤cookie），着⽆形增加了测试运⾏的时间；
Cypress Commands:
1、定义在cypress/support/commands.js中的命令可以像Cypress内置命令那样直接使⽤，⽆须import对应的的page（实际上PageObject模式在Cypress看来⽆⾮是数据/操作函数的共享）
2、⾃定义命令可以⽐PageObject模式运⾏更快，Cypress和应⽤程序运⾏在同⼀个浏览器，意味着Cypress可以直接发送请求到应⽤程序并设置运⾏测试所需要的⽤户状态，⽽这⼀切通常⽆须通过页⾯操作，这使得使⽤了⾃定义命令的测试更加稳定；
3、⾃定义命令允许重写Cypress内置命令，意味着可以⾃定义测试框架并⽴刻全局应⽤；

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。