Cypress的钩子函数

简介: Cypress的钩子函数

大家好,我是阿萨。昨天学习了如何使用describe,context,specify 和it 去组织自动化测试用例。大家也学会了如何去写好一个test suites了。


有同学就问了,之前用selenium 或者其他测试框架的时候,都有setup 和teardown 等函数。cypress 咋没见这2个函数。哪如何实现每个测试的suite 之前都执行某个代码逻辑或者是每个测试用例之前都需要执行代码?


今天我们就来学习下cypress的 钩子函数。


Cypress 和Mocha 一样提供四个钩子函数:

  • before() ----当前测试套件,所有测试用例之前执行。
  • after()---当前测试套件,所有测试用例之后执行。
  • beforeeach()----当前测试套件,每个测试用例之前执行。
  • aftereach()-----当前测试套件,每个测试用例之后执行。


它们的作用是测试开始时设置测试的先决条件(比如准备测试数据)。或者测试结束后对测试环境进行清理(例如清理DB)。使用个例子看一下。

 describe('1st Describe to show 1st suite ', () => {
     before(function(){
        cy.log("Will run before all test scripts.")
    }
    )
     beforeEach(function(){
        cy.log("Will run before each testing scripts.")
    })
     afterEach(function(){
        cy.log("Will run after each testing scripts.")
    })
     describe('Describe Inside Describe to show nested suite', () => {
        it('first test inside', () => {
            cy.log('first test inside')
            assert.equal(true, true)
        })
    })
    it('1st test', () => {
         cy.log('1st test')
        assert.equal(true, true)
    })
    specify('2nd test', () => {
        cy.log('2nd test')
        assert.equal(true, true)
    })
     after(function(){
        cy.log("Will run after all test scripts.")
    })
})
 context('2nd suite', () => {
    it('first test', () => {
        cy.log('first test')
        assert.equal(true, true)
    })
    it('2nd test', () => {
        cy.log('2nd test')
        assert.equal(true, true)
    })
  })


这是例子的执行结果,通过例子的执行结果可以清晰的看出作用域。

image.png

image.png


你学会了吗?


相关文章
|
3月前
|
前端开发 JavaScript
useReducer 钩子实战
【10月更文挑战第13天】在 React 中,`useState` 是常用的状态管理钩子,但面对复杂状态逻辑时,`useReducer` 提供了更结构化的方式。本文从基础到进阶介绍 `useReducer` 的使用方法、常见问题及解决方案,并通过计数器和表单组件的示例加深理解。
60 3
|
3月前
|
JavaScript
|
3月前
|
JavaScript
理解 Vue 的 setup 应用程序钩子
【10月更文挑战第3天】`setup` 函数是 Vue 3 中的新组件选项,在组件创建前调用,作为初始化逻辑的入口。它接收 `props` 和 `context` 两个参数,内部定义的变量和函数需通过 `return` 暴露给模板。`props` 包含父组件传入的属性,`context` 包含组件上下文信息。`setup` 可替代 `beforeCreate` 和 `created` 钩子,并提供类似 `data`、`computed` 和 `methods` 的功能,支持逻辑复用和 TypeScript 类型定义。
61 11
|
5月前
|
缓存 JavaScript API
vue学习之生命周期钩子
生命周期钩子
31 0
|
7月前
|
前端开发
|
8月前
|
JavaScript
深入理解Vue生命周期钩子及其应用
深入理解Vue生命周期钩子及其应用
37 0
|
8月前
|
JavaScript
第32节: Vue3 方法处理程序
第32节: Vue3 方法处理程序
43 0
|
JavaScript 前端开发
理解Vue2的生命周期钩子
从基础到实战,我们一环都不要少!
108 0
|
缓存 JavaScript 前端开发
【Vue3 第十章】生命周期钩子
【Vue3 第十章】生命周期钩子
213 2
|
JavaScript
Vue3入门指北(九)生命周期钩子
Vue3入门指北(九)生命周期钩子
Vue3入门指北(九)生命周期钩子