cypressui对比testcafe_使用Cypress进行UI测试（一）安装Cypress&第一个测试用例

使用Cypress进行UI测试(一)安装Cypress&第一个测试用例

Cypress简介

安装cypress并运行官网示例

项目结构介绍

用例结构介绍

第一个测试用例

Cypress简介

Cypress同TestCafe一样，也是被誉为UI自动化测试后Selenium时代的三驾马车之一，从GitHub的star数量来说，Cypress远超TestCafe，可见其受欢迎程度。笔者项目中也是使用的Cypress，确实很好用，所以想要推荐给大家。

Cypress主要有以下特点：

1.Cypress记录了测试用例运行snapshots，可以查看用例运行轨迹，易于Debug

2.内置自动等待，不需要手动加wait或者sleep

3.交互式的TestRunner界面，测试情况一目了然

4.可以模拟网络请求流量

5.dashboard可以完美展示CI运行情况

之后的系列文章会一一介绍这些特点，今天这篇会介绍如何安装Cypress，然后使用Cypress运行第一个测试用例。

安装cypress并运行官网示例

1.在任意目录下新建一个空文件夹，然后执行：npm init 初始化一个项目

2.使用IntelliJ打开项目，在命令行执行：npm install cypress --save-dev

3.打开cypress：node_modules/.bin/cypress open

首次打开的cypress会自动加载一些example，如下图