image.png
本文章主要講解cypress 自動(dòng)化凫岖。github 地址:https://github.com/cypress-io/cypress
解決問題:UI 腳本自動(dòng)化執(zhí)行江咳。
例子:github 自動(dòng)登錄
級(jí)別:簡(jiǎn)單入門
一、環(huán)境安裝
準(zhǔn)備:必須有node 環(huán)境哥放,可以通過npm 安裝歼指。
下載cypress :
npm install cypress --save-dev
安裝完成后打開:
cypress open
#或
node_modules/.bin/cypress open
會(huì)啟動(dòng)一個(gè) Electron 程序。
image.png
自動(dòng)登錄效果:
github-test.gif
代碼預(yù)覽:
describe("github測(cè)試", () => {
it("github", () => {
cy.visit("https://github.com/login");
cy.get("#login_field")
.type("你的帳號(hào)");
cy.get("#password")
.type("你的密碼");
cy.get(".btn").click();
});
});
有人說甥雕,我不會(huì)寫代碼怎么辦踩身,別急。已經(jīng)有人為你考慮到了社露。
點(diǎn)擊這里可以檢測(cè)你所選中的選擇器挟阻。
image.png
例如我要到登錄帳號(hào)那個(gè)框框
image.png
里面去。
新建一個(gè)js文件呵哨。
describe("github測(cè)試", () => {
it("github", () => {
//這里放你的測(cè)試代碼
});
});
//把這句代碼拷貝到你剛剛的新建的文件里面
cy.get("#login_field")
下面是在輸入框里面填寫內(nèi)容
//在剛剛的代碼后面加上 .type("帳號(hào)")
cy.get("#login_field").type("帳號(hào)");
如果需要點(diǎn)擊某個(gè)按鈕 在獲取到某個(gè)按鈕后加 .click() 即可
cy.get(".btn").click();
當(dāng)然如果你想登錄后獲取Cookie赁濒,下次直接通過cookies 登錄,可以用cy.getCookis();
具體用法可以以看Example 里面的例子孟害。