1. 安装NodeJS
下载地址，安装完后通过node -v指令验证是否安装成功。
2. 创建package.json
我们可以使用命令npm init在项目的根目录下来初始化一个package.json文件，运行这个命令后，它会询问一些关于包的基本信息，根据实际情况回答即可。
如果不喜欢这种方式，可以使用npm init --yes （或npm init --y）命令直接使用默认的配置来创建package.json文件，最后根据需要修改创建好的package.json文件即可。
3. cypress安装
cd /your/project/path
npm install cypress --save-dev
确保你已经运行了
npm init，或者存在node_modules文件夹，或者在你项目的根目录存在package.json文件, 以此来确保cypress被安装到正确的路径下。
4. cypress启动
./node_modules/.bin/cypress open
问题——启动失败：
解决办法：
https://github.com/cypress-io/cypress/issues/1125
就是删除下图中的cypress文件，然后点击启动失败图中的“Try Again”：
启动成功：
5. 创建用例
-
IDE 选择微软的VSCode(安装教程)。
-
File>Open Folder， 选择项目目录中cypress文件夹，如E:\CypressTest\node_modules.bin\cypress
-
创建第一个用例，右击integration目录>New Folder， 起名为MyTests，再在MyTests下面新建一个mallcoo_C.js的文件，切换到Cypress，你是否发现Cypress自动给你刷新了目录，你新建的mallcoo_C.js测试集文件，它已经帮你监测到了！只不过它现在还没有任何内容。
Cypress提供了很多示例程序（examples），建议不要删除它们，方便参考。
- 现在我们开始写第一个自动化示例程序：
/// <reference types="Cypress" /> describe('XX模块UI自动化测试', function () { beforeEach(() => { cy.viewport('iphone-6') // Set viewport to 375px x 667px 需要手机模式访问时 // 浏览器模式访问时，可按照自己的需要设置窗口大小，如 cy.viewport(1920,1100) //访问10057商场C端首页 cy.visit('https://m-t.mallcoo.cn/a/home/10057') }) it.only('登录', function(){ //点击首页会员按钮 cy.get('#div_index > div.fixed_b_menu.dis_flex > a:nth-child(2)').click() //点击立即登录按钮 cy.get('#gotoLogin').click() //输入手机号和密码 cy.get('#mobile_p').type('xxxxxxxxxxx') cy.get('#pwd').type('xxxxxx') //点击登录按钮 cy.get('#btnLoginPwd').click() }) it('个人中心', function () { //使用会员卡 cy.get('#use_card').click() }) it.skip('活动中心', function () { //使用会员卡 cy.contains('活动列表').click() }) }) 代码解释：
1 . reference表示告诉VSCode要去Cypress package里找相关的语义解析，这样一来Cypress相关的语法和函数等就可以尽情地使用了；
2 . describe声明了一个测试用例集；
3 . beforeEach相当于单元测试的setup，即在每个测试用例运行前需要做的事；
4 . viewport控制应用程序屏幕的大小和方向，详见这里
5 . it声明了一个测试用例；
6 . cy.get接受一个js selector， 就是元素定位字符串，当然Cypress也支持xpath定位，详见这里；
-
it.only只测试这个,it.skip不要测这个
更方便起见，我们可以使用request方法登录：
修改 D:\testProject\CypressProject\node_modules.bin\cypress\support路径下的 commands.js 添加如下代码:
Cypress.Commands.add('login', (userType, options = {}) => { const accountTypes = { admin:{ "username":"xxx", "password":"xxx", } } cy.request({ url:'your URL address', method:'POST', body:accountTypes[userType] }) }) 用例中在需要登录的地方调用即可：
cy.login('admin')
6. 运行用例
保存代码，在Cypress应用程序里找到mallcoo_C.js，点击它，你会发现它跑起来了，而且如果再次对用例修改并保存，Cypress会自动检测到新的改动，并马上运行！当然，你也可以去掉这个自动重载机制...
Cypress会自动检测可用的浏览器，以防万一，建议把Chrome设置为默认浏览器，当然也可以在运行Cypress时手动指定cypress run --browser chrome。
7. 与Jenkins集成
构建结果：
推荐学习资料：《cypress从入门到精通》 一线资深测试经理蔡超编著