windows環境下通過npm安裝Cypress

一、前言

前幾年我們在做web端UI自動化測試時，首先想到的是基於Selenium工具，但隨着web端技術的升級，出現了不少前端測試框架，這些框架大多不依賴於Selenium，於是Cypress測試框架在這個技術更新換代的潮流中應運而生了。

二、Cypress簡述

（1）Cypress專爲現代網絡打造的下一代前端測試工具，解決了開發人員和質量工程師在測試現代應用程序時面臨的主要痛點。

（2）Cypress是基於 JavaScript 的前端測試工具，可以測試在瀏覽器中運行的任何內容。

（3）Cypress與Selenium工具進行比較，從根本上及架構上都是不同的，Cypress不受Selenium的限制，Cypress 底層協議不採用 WebDriver。

（4）Cypress 不同於其它UI自動化測試工具，它提供了一套完整的端到端測試，能夠編寫所有類型的測試（單元測試、集成測試），且可以設置測、編寫測試、執行測試、調試測試。

官方地址：https://www.cypress.io

詳細文檔：https://docs.cypress.io/guides/overview/why-cypress.html

備註：我們還可以參考蔡超老師編寫的《Cypress 從入門到精通》

 

三、環境要求

操作系統：Windows 7 版本或更高版本的操作系統。

Nodejs版本：要求Node.js 8或更高的版本。

Nodejs詳細安裝步驟請參考：https://blog.csdn.net/weixin_43184774/article/details/106719889

四、npm安裝

npm已經集成在新版的Node.js中了，能解決Node.js代碼部署上的很多問題，常見的使用場景有以下幾種：

（1）允許用戶從npm服務器下載別人編寫的第三方包到本地使用。

（2）允許用戶從npm服務器下載並安裝別人編寫的命令行程序到本地使用。

（3）允許用戶將自己編寫的包或命令上傳到npm服務器供別人使用。

◎ 由於新版本的Node.js已經集成了npm，所以可以通過在cmd窗口中輸入如下命令，來驗證是否成功安裝npm。

npm -v

◎ 如果npm版本過低，可以通過以下指令升級npm版本

npm install npm -g

五、Cypress安裝

首先在本地電腦上創建一個Cypress文件夾目錄（比如：D:\software\Cypress），然後在cmd窗口中，cd進入到你創建的這個Cypress的目錄下，執行如下命令，即可安裝Cypress

npm install cypress --save-dev

六、Cypress啓動

（1）在cmd窗口中，cd進入到Cypress安裝目錄的\node_modules\.bin目錄下，執行如下命令：

cypress open

（2）也可以通過npx來啓動，這樣就不用cd進入到node_modules.bin目錄了。執行命令如下：

npx cypress open

 

七、解決Cypress安裝警告問題

在前面安裝的時候，會看到缺少個文件 npm WARN saveError ENOENT: no such file or directory, open 'D:\software\Cypress\package.json'這個警告提示

解決辦法：

（1）在根目錄D:\software\Cypress下新建一個package.json文件。

 

（2）在package.json文件中輸入如下內容

{

    "scripts": {
        "cypress:open": "cypress open"
    }

}

 

（3）直接在Cypress目錄下執行如下命令即可正常啓動Cypress

npm run cypress:open