Cypress安裝使用（E2E測試框架）

 

 

1、簡介

　　Cypress是爲現代網絡打造的下一代前端測試工具，解決了開發人員和QA工程師在測試現代應用程序時面臨的關鍵難點問題。

　　Cypress包含免費的、開源的、可本地安裝的Test Runner 和 可以記錄你測試的控制面板服務。

 

2、安裝

　　1)　經過npm來安裝Cypress：

　　　　①　那麼首先安裝node.js（npm是一個node包管理和分發工具），下載：https://nodejs.org/en/

　　　　②　打開CMD命令行，利用 mkdir 新建目錄，利用 cd 命令切換到指定目錄（也能夠手動先新建好）

　　　　　　

　　　　③　使用 npm install cypress --save-dev 安裝Cypress（若是有WARN可忽略，不影響）

　　　　　　

　　　　④　使用 node_modules\.bin\cypress open 啓動Cypress

　　　　　　

　　　　　　

　

　　2)　直接下載Cypress壓縮包

　　　　①　官網下載地址：https://download.cypress.io

 　　　  ②　解壓到指定目錄，而後進入目錄，執行Cypress.exe

　　　　　　

　　　　③　選擇你的項目路徑

 　　　　　　

 

3、使用

　　1）　默認已經爲咱們準備了一些豐富的例子 ，能夠直接點擊運行。

　　　　

　　　2）咱們也能夠本身新建一個測試文件：

　　　　①　首先切換至目錄 ~\Cypress\cypress\integration（任意編輯器均可以，我使用的時PyCharm）

　　　　

　　　　②　而後新建一個測試文件 sample_spec.js，代碼以下：

describe('My First Test', function () {
    it('Does not do much!', function () {
        cy.visit("https://www.baidu.com")
        cy.get("#kw").type("cypress test")
        cy.wait(60)
        cy.get("#su").click()
        cy.contains('cypress website').click()
    })
})

　　　　③　最後打開Cypress運行此文件便可，你會發現運行速度很快，這就是Cypress的優點所在。

　　　　④　更多API詳解參考：https://docs.cypress.io/zh-cn/guides/guides/module-api.html#cypress-run

 

4、設置

　　1）　運行狀況：　從左向右分別顯示成功數、失敗數、未運行、耗時，以及自動滾屏和從新運行按鈕

　　　　

 

　　2）　控件定位：　1.點擊選擇器　->2.點擊定位元素　->3.複製生成代碼

　　　　

 

　　3）　窗口設置：

　　　　①　默認狀況下，除非由cy.viewport命令指定，不然視口將爲1000*660px

　　　　

　　　　②　咱們能夠經過在cypress.json中指定這些值來覆蓋默認視口維度

{ 「viewportWidth」：1200， 「viewportHeight」：800 }

 

 

 ----- 轉載請註明原做，謝謝：http://www.javashuo.com/article/p-watsscrz-hg.html