cypress 基本用法

介绍

Cypress 是前端 E2E（端到端）自动化测试里非常常用的工具

官网地址: https://docs.cypress.io/api/commands/url

安装

npm install cypress --save-dev

打开 Cypress

npx cypress open

上面命令执行完成会出现下面图片显示的内容

• 第一次会在项目的跟目录生成 cypress 目录与 cypress.config.js文件
• 目录结构

cypress/
 ├─ e2e/              # 测试用例
 │   └─ login.cy.js
 ├─ fixtures/         # mock 数据
 ├─ support/
 │   ├─ commands.js   # 自定义命令
 │   └─ e2e.js        # 全局配置
cypress.config.js

简单示例

• 在cypress目录中的e2e目录下新建一个文件 xxx.cy.js 将下面代码粘贴到文件中

describe('首页测试', () => {
  it('能正常访问首页', () => {
    cy.visit('http://localhost:5173')
    cy.contains('欢迎')
  })
})

• 然后 cypress 打开的浏览器中找到 刚创建的文件 双击后运行

• 至此 最简单的使用 cypress 端到端测试 完成