前端E2E测试-Cypress

官网：https://haomo-tech.com

作者：毫末科技

邮箱：hxg@haomo-studio.com

概述

使用

# 开发期间
cypress open

# 自动执行或在CI中执行
cypress run

测试四步骤

Cypress测试四步骤：

  1. 打开一个网页：
cy.visit('https://example.cypress.io')
  1. 找到目标元素
cy.get('#element-id')
  1. 跟目标元素交互
cy.get('#element-id').click()
  1. 执行assert

Cypress采用 should 语法进行断言。另外，默认采用Chai的断言。毫末采用了jest-adapter替代Chai，采用jest断言。

cy.get('.default-component').find('[role=tablist]').should('have.length', 7);
// 或者
cy.get('.default-component').find('[role=tablist]').its('length').then(length => { 
  expect(length).toBe(7);
});
// 或者

最佳实践

采用屏幕录制的办法生成代码 Cypress Recorder

常用用法

使用 jQuery 类似语法打印元素：

// 使用cy.$$，等同于jQuery的$
cy.$$('#element-id')

cy.get('#element-id').then($ele => {
  // 这里的$ele为元素的jQuery对象
  console.log($ele);
})

参考

results matching ""

    No results matching ""