前言
web技術已經進化了，web的測試技術最終還是跟上了腳步，新一代的web自動化技術出現了？
Cypress可以對在浏覽器中運作的任何東西進行快速、簡單和可靠的測試。
"The web has evolved.
Finally, testing has too.
Fast, easy and reliable testing for anything that runs in a browser."
官方位址https://www.cypress.io/,詳細的文檔介紹https://docs.cypress.io/guides/overview/why-cypress.html
windows環境安裝
系統要求：
- macOS 10.9 and above (64-bit only)
- Linux Ubuntu 12.04 and above, Fedora 21 and Debian 8 (64-bit only)
- Windows 7 and above
如果你使用
npm
安裝 Cypress，必須要求
Node.js 8
或更高版本
安裝node.js
官網下載下傳位址：
https://nodejs.org/en/download/
下載下傳後一路傻瓜式安裝，安裝完成後，運作cmd，輸入node –v檢視版本号，然後輸入npm -v
C:\Users\dell>node -v
v10.2.0
C:\Users\dell>npm -v
6.14.5 npm安裝
NPM是随同NodeJS一起安裝的包管理工具，能解決NodeJS代碼部署上的很多問題，常見的使用場景有以下幾種：
- 允許使用者從NPM伺服器下載下傳别人編寫的第三方包到本地使用。
- 允許使用者從NPM伺服器下載下傳并安裝别人編寫的指令行程式到本地使用。
- 允許使用者将自己編寫的包或指令行程式上傳到NPM伺服器供别人使用。
由于新版的nodejs已經內建了 npm，是以之前 npm也 一并安裝好了。可以通過輸入 "npm -v"來測試是否成功安裝.
npm -v
如果npm版本過低，也可以通過以下指令更新npm版本
npm install npm -g
npm直接下載下傳會很慢，先修改下載下傳源
http://registry.npm.taobao.org
npm config set registry http://registry.npm.taobao.org
改完之後檢視是否改成功
npm config get registry
安裝 Cypress
自己本地電腦建立一個目錄，cd 到目錄，執行 npm 指令安裝
cd /your/project/path
npm install cypress --save-dev
安裝會有點慢，耐心等待！
D:\Cypress>npm install cypress --save-dev
> [email protected] postinstall D:\Cypress\node_modules\cypress
> node index.js --exec install
Installing Cypress (version: 4.5.0)
√ Downloaded Cypress
√ Unzipped Cypress
√ Finished Installation C:\Users\dell\AppData\Local\Cypress\Cache\4.5.0
You can now open Cypress by running: node_modules\.bin\cypress open
https://on.cypress.io/installing-cypress
npm WARN saveError ENOENT: no such file or directory, open 'D:\Cypress\package.json'
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN enoent ENOENT: no such file or directory, open 'D:\Cypress\package.json'
npm WARN Cypress No description
npm WARN Cypress No repository field.
npm WARN Cypress No README data
npm WARN Cypress No license field.
+ [email protected]
updated 1 package in 1142.836s
1 package is looking for funding
run `npm fund` for details 啟動cypress
先cd到node_modules/.bin目錄
cd node_modules/.bin
cypress open
D:\Cypress\node_modules\.bin>cypress open
It looks like this is your first time using Cypress: 4.5.0
√ Verified Cypress! C:\Users\dell\AppData\Local\Cypress\Cache\4.5.0\Cypress
Opening Cypress... 接下來桌面會出現啟動界面
也可以通過
npx
來啟動,這樣就不用cd 到 node_modules.bin 目錄了
npx cypress open
還可以通過
yarn
來啟動
yarn run cypress open
添加 npm 腳本
在前面安裝的時候，會看到缺少個檔案
npm WARN saveError ENOENT: no such file or directory, open 'D:\Cypress\package.json'
接下來在根目錄 D:\Cypress 下建立一個 package.json 檔案
{
"scripts": {
"cypress:open": "cypress open"
}
} 現在，您可以從項目根目錄調用指令，如下所示：
npm run cypress:open
D:\Cypress\node_modules\.bin>npm run cypress:open
> @ cypress:open D:\Cypress
> cypress open 接下來就可以看到正确的啟動 cypress 界面了