国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

端到端測試神器 cypress 淺入淺出

CarlBenjamin / 2645人閱讀

摘要：我之前寫過關(guān)于的文章，，最近在工作中用到比較多了，頓時(shí)覺得確實(shí)是比較優(yōu)秀的一個(gè)。

我之前寫過關(guān)于cypress的文章，https://segmentfault.com/a/11...，最近在工作中用到cypress比較多了，頓時(shí)覺得cypress確實(shí)是比較優(yōu)秀的一個(gè)。

1. 軟件安裝. 2. 安裝cypress

安裝cypress客戶端：http://download.cypress.io/de...

安裝vscode編輯器：https://code.visualstudio.com...

3. 初始化

假如項(xiàng)目目錄是 /test

打開cypress客戶端， 點(diǎn)擊箭頭位置，通過資源管理器選擇/test目錄

如果/test沒有cypress目錄，那么cypress就會(huì)在test目錄下新建cypress目錄，并初始化一些文件

4. cypress目錄分析 
- cypress // cypress目錄
---- fixtures 測試數(shù)據(jù)配置文件，可以使用fixture方法讀取
---- integration 測試腳本文件
---- plugin 插件文件
---- support 支持文件
- cypress.json // cypress全局配置文件
5. 基本例子

一般流程

訪問某個(gè)頁面

查找DOM進(jìn)行交互，例如輸入，點(diǎn)擊，選擇之類

進(jìn)行斷言

describe("Hacker News登錄測試", () => {
  it("登錄頁面", () => {
    cy.visit("https://news.ycombinator.com/login?goto=news")
    cy.get("input[name="acct"]").eq(0).type("test")
    cy.get("input[name="pw"]").eq(0).type("123456")
    cy.get("input[value="login"]").click()

    cy.get("body").should("contain", "Bad login")
  })
})

6. DOM選取

參考： https://docs.cypress.io/guide...

jquery選擇法

通過客戶端GUI工具選取

7. DOM交互

.click() 單擊

.dblclick() 雙擊

.type() 輸入

.clear() 清空

.check() 選中

.uncheck() 取消選中

.select() 下拉框選擇

.trigger() 反轉(zhuǎn)

8. 斷言

.contains() 查找匹配字符串

.should()

更多斷言參考 https://docs.cypress.io/guide...

8.1. 長度斷言 
// retry until we find 3 matching 
cy.get("li.selected").should("have.length", 3)
8.2. 類斷言 
// retry until this input does not have class disabled
cy.get("form").find("input").should("not.have.class", "disabled")
8.3. 值斷言 
// retry until this textarea has the correct value
cy.get("textarea").should("have.value", "foo bar baz")
8.4. 文本斷言 
// retry until this span does not contain "click me"
cy.get("a").parent("span.help").should("not.contain", "click me")
8.5. 可見性斷言 
// retry until this button is visible
cy.get("button").should("be.visible")
8.6. 存在性斷言 
// retry until loading spinner no longer exists
cy.get("#loading").should("not.exist")
8.7. 狀態(tài)斷言 
// retry until our radio is checked
cy.get(":radio").should("be.checked")
9. 讀取測試配置數(shù)據(jù)

Cypress.env() 可以讀取全局配置

fixture(文件名).as(變量), 可以將文件中的配置數(shù)據(jù)讀取為變量，作為后續(xù)的測試用例來使用，注意這一步是異步的，必須放在before或者beforeEach等鉤子函數(shù)中使用

describe("軟電話登錄", function () {
  before(() => {
    cy.fixture(Cypress.env("envName") + "-login-data.json").as("loginData")
  })

  it("wellClient test", function () {
    cy.log(this.loginData)

    cy.visit(this.loginData.url)

    cy.get("#config-env").select("CMB-TEST")
    cy.get("#config").click()

    cy.get("#well-code").type(this.loginData.jobNumber)
    cy.get("#well-password").type(this.loginData.password)
    cy.get("#well-namespace").type(this.loginData.domain)
    cy.get("#well-deviceId").type(this.loginData.ext)

    cy.get("#well-login").click()

    cy.wait(3000)
    cy.get("#well-login").should("not.be.visible")
  })
})
10. 全局配置 cypress.json

參考：https://docs.cypress.io/guide...

11. 變量與別稱

參考：https://docs.cypress.io/guide...

12. 鉤子函數(shù)

參考： https://docs.cypress.io/guide...

before()

beforeEach()

afterEach()

after()

13. 最佳實(shí)踐

參考： https://docs.cypress.io/guide...

其他

cy.window() 異步獲取window對(duì)象，無法直接使用window對(duì)象

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/96176.html

相關(guān)文章

  • 端到端測試神器Cypress!進(jìn)階

    摘要：前言官方文檔目前只支持英文，好處是官方入門視頻很多，對(duì)于英文水平不好的也很容易入手優(yōu)缺點(diǎn)優(yōu)點(diǎn)只要你學(xué)好語法上應(yīng)該不是很大問題獲取類似，對(duì)前端同學(xué)來說是好處缺點(diǎn)內(nèi)置的工具集成了谷歌內(nèi)核，決定你只能是在谷歌瀏覽器上測試，但隨著新版的內(nèi)核采用內(nèi)核 前言 官方文檔：https://docs.cypress.io 目前只支持英文，好處是官方入門視頻很多，對(duì)于英文水平不好的也很容易入手； 優(yōu)缺點(diǎn) ...

    oysun 評(píng)論0 收藏0

  • 端到端測試哪家強(qiáng)？不容錯(cuò)過的Cypress

    摘要：閱讀原文目前測試工具有哪些項(xiàng)目不需要不需要端到端測試一般都需要一個(gè)容器，來運(yùn)行前端應(yīng)用。向快速，一致和可靠的無剝落測試問好。 閱讀原文 1. 目前E2E測試工具有哪些？ 項(xiàng)目 Web Star puppeteer Chromium (~170Mb Mac, ~282Mb Linux, ~280Mb Win) 31906 nightmare Electron 15502 ...

    LancerComet 評(píng)論0 收藏0

  • SegmentFault 技術(shù)周刊 Vol.16 - 淺入淺出 JavaScript 函數(shù)式編程

    摘要：函數(shù)式編程，一看這個(gè)詞，簡直就是學(xué)院派的典范。所以這期周刊，我們就重點(diǎn)引入的函數(shù)式編程，淺入淺出，一窺函數(shù)式編程的思想，可能讓你對(duì)編程語言的理解更加融會(huì)貫通一些。但從根本上來說，函數(shù)式編程就是關(guān)于如使用通用的可復(fù)用函數(shù)進(jìn)行組合編程。 showImg(https://segmentfault.com/img/bVGQuc); 函數(shù)式編程（Functional Programming），一...

    csRyan 評(píng)論0 收藏0

  • Vue-cli淺入淺出

    摘要：別名相當(dāng)于前面先引入了路由插件，然后顯式聲明要用路由。注意到，等都是頁面也可以是組件，接著注冊(cè)路由器，然后開始配置路由。 搭建環(huán)境 工欲善其事必先利其器，我們的學(xué)習(xí)計(jì)劃從學(xué)會(huì)搭建Vue所需要的環(huán)境開始，node和npm的環(huán)境不用說是必須的，現(xiàn)在前端流程化很熱門，基本上新的技術(shù)都會(huì)在這套流程的基礎(chǔ)上做開發(fā)，我們只需要站在巨人的XX上裝*就可以了。我假設(shè)你的機(jī)子上已經(jīng)有了最新的node和n...

    endiat 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<