CYPRESS(自动化测试工具——cypress)

更新时间:2024-12-17 13:34:19 所在栏目: 生活常识点击量:

主动化测试东西——cypress

cypress是比力新的一个主动化测试东西,惹起很剧烈的眷注,在github的star数现在以前是22k+,可见是很遭到宽大主动化测试事情者的接待。

cypress有哪些与众不同呢?

  1. 时间追溯,cypress可以在测试运转中主动存储视频以及出错时分截屏存储,鼠标滑过下令行时可以看到这个下令行实行时的动画。
  2. 可调试性,不必推测你的测试对否失败,像使用chrome的DevTools一样直接调试,并且可以快速的追踪到出错栈。
  3. 及时重加载,当测试代码窜改正之后,cypress会主动重新加载测试。
  4. 主动等候,不必要添加wait或是sleep在你的测试中,cypress会主动等候下令和assertion。
  5. 测试形态菜单,可以及时看到有几多个测试经过或是没经过。
  6. 拜候窗口的尺寸调停,可以随意调停页面拜候窗口的尺寸。
  7. 测试统计报告(加强功效,无偿版只能支持3个用户登录查察,以前500次的测试后果)

Cypress安装

cypress的安装好坏常的简便,国内发起使用npm安装,yarn会不休卡在安装步调。

npm install cypress --save-dev --registry=https://registry.npm.taobao.org

Cypress使用

安装完毕,我们就可以使用cypress测试了,起首必要添加cypress.json也就是cypress的设置文件。

这里简便编写,可以只写cypress必要拜候的办事地点。


{

"baseUrl": "http://localhost:8000", #测试拜候的路由地点

"reporter": "junit", #报告典范

"reporterOptions": {

"mochaFile": "results/test-[hash].xml", #输入的文件

"toConsole": true #对否输入的下令行

},

"viewportHeight": 800, # viewPort也就是预览窗的高度

"viewportWidth": 1600 # viewPort也就是预览窗的宽度

}



  编写完设置文件之后,我们可以经过cypress open当地掀开测试窗口

cypress open




可以看到第一次启动时分,会有一个examples的目次,这是cypress主动创建的例子代码,我们可以直接点击右侧的open in IDE掀开代码。

可以点击右上角的运转一切集成化测试,或是点击单个测试用例单独测试

Cypress的目次布局先容



├── fixtures # mock数据的存储目次,这里存放了一切mock的json文件

│ ├── orders.json

│ ├── panicBuyings.json

│ └── routers.json

├── integration # 测试用例代码目次

│ ├── orderManagement.spec.js

│ └── panicBuyingManagement.spec.js

├── plugins # 插件目次

│ └── index.js

└── support

├── commands.js

└── index.js



Cypress测试代码编写



describe('测试抢购订单办理', () => {

beforeEach(() => { #每个测试用例调用之前的利用

const mock = Cypress.env('MOCK') || 'false'; # 自界讨情况变量,运转时转达的话必要指定CYPRESS_前缀,这里使用是CYPRESS_MOCK=true cypress open

cy.server(); # 假如必要mock接口的话,必必要运转server

if (mock === true) {

cy.intercept('GET', '/panic-buying/manager/orders*', { fixture: 'orders.json' }).as(

'getOrders',

); # 拦阻
/panic-buying/manager/order*路由,并指定前往数据使用orders.json,界说这个接口是getOrders函数,用于后方测试使用。

} else {

cy.intercept('GET', '/panic-buying/manager/orders*').as('getOrders');

}

});

it('测试订单列表搜刮', () => {

cy.visit('/#/rush-order/list'); #拜候页面途径

cy.wait('@getOrders').its('response.statusCode').should('be.oneOf', [200, 304]); # 等候getOrders函数,也就是接口前往并推断前往形态是200或是304中的一个。

cy.wait(1000); # 体现的等候1秒

});

});



下令行运转cypress测试



Running: panicBuyingManagement.spec.js (2 of 2)

<?xml version="1.0" encoding="UTF-8"?>

<testsuites name="Mocha Tests" time="11.0930" tests="2" failures="0">

<testsuite name="Root Suite" timestamp="2021-03-10T15:00:52" tests="0" file="cypress/integration/panicBuyingManagement.spec.js" time="0.0000" failures="0">

</testsuite>

<testsuite name="测试抢购办理" timestamp="2021-03-10T15:00:52" tests="2" time="11.0930" failures="0">

<testcase name="测试抢购办理 测试新建抢购" time="9.2340" classname="测试新建抢购">

</testcase>

<testcase name="测试抢购办理 测试列表搜刮" time="1.8590" classname="测试列表搜刮">

</testcase>

</testsuite>

</testsuites>

(Results)

┌────────────────────────────────────────────────────────────────────────────────────────────────┐

│ Tests: 2 │

│ Passing: 2 │

│ Failing: 0 │

│ Pending: 0 │

│ Skipped: 0 │

│ Screenshots: 0 │

│ Video: true │

│ Duration: 11 seconds │

│ Spec Ran: panicBuyingManagement.spec.js │

└────────────────────────────────────────────────────────────────────────────────────────────────┘

(Video)

- Started processing: Compressing to 32 CRF

- Finished processing: /Users/hightall/work/wenyu/dashboard/panic-buying-managemen (0 seconds)

t/cypress/videos/panicBuyingManagement.spec.js.mp4

====================================================================================================

(Run Finished)

Spec Tests Passing Failing Pending Skipped

┌────────────────────────────────────────────────────────────────────────────────────────────────┐

│ ? orderManagement.spec.js 00:03 1 1 - - - │

├────────────────────────────────────────────────────────────────────────────────────────────────┤

│ ? panicBuyingManagement.spec.js 00:11 2 2 - - - │

└────────────────────────────────────────────────────────────────────────────────────────────────┘

? All specs passed! 00:14 3 3 - - -



  我们可以看到测试完成后,会主动天生测试运转历程的视频
panicBuyingManagement.spec.js.mp4

声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。