e2e測(cè)試之cypress怎么使用

今天小編給大家分享一下e2e測(cè)試之cypress怎么使用的相關(guān)知識(shí)點(diǎn)，內(nèi)容詳細(xì)，邏輯清晰，相信大部分人都還太了解這方面的知識(shí)，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來(lái)了解一下吧。

用e2e測(cè)試想要達(dá)到什么目的？

• 將被測(cè)試的單元放在特定環(huán)境下，選中并讓它發(fā)生交互，達(dá)到目標(biāo)結(jié)果。

• 在測(cè)試之前，為測(cè)試用例創(chuàng)造它需要的環(huán)境，并進(jìn)行測(cè)試，在測(cè)試結(jié)束后，將環(huán)境恢復(fù)原狀。

如何啟動(dòng)cypress測(cè)試？

• 在項(xiàng)目中安裝cypress 插件庫(kù)

• 在根目錄下可看見(jiàn)自動(dòng)生成的cypress文件夾以及cypress.config.ts，在cypress.config.ts中配置baseUrl等

• 編寫測(cè)試：在cypress/e2e文件夾下編寫測(cè)試用例

• 啟動(dòng)測(cè)試： 終端輸入 npx cypress open， 并選擇e2e，選擇瀏覽器，點(diǎn)擊需要測(cè)試的用例即可

了解目錄結(jié)構(gòu)：

• e2e: 存放編寫的測(cè)試用例

• support：cypress/support/index.js文件在每個(gè)規(guī)范文件之前運(yùn)行，比如有些動(dòng)作是適用于全局的，那么就可以放在這里。

• global.d.ts：存放編寫測(cè)試用例中的typing，尤其是自定義的函數(shù)需要編寫的ts都是存放在這里。

• fixtures：存放測(cè)試數(shù)據(jù)的地方，可以理解為放接口mock數(shù)據(jù)的地方

• plugins：存放插件，插件可以是自己編寫的，也可以是第三方，插件是在項(xiàng)目加載之前、瀏覽器啟動(dòng)之前和測(cè)試執(zhí)行期間在Node中執(zhí)行用的。

• integration： 一般測(cè)試用例會(huì)寫在integration下面，自帶官方示例測(cè)試用例文件。

• screenshot：當(dāng)測(cè)試發(fā)生錯(cuò)誤時(shí)，cypress會(huì)自動(dòng)截圖并保存

• video：當(dāng)測(cè)試發(fā)生錯(cuò)誤時(shí)，cypress會(huì)自動(dòng)錄屏并保存

• downloads: 存放測(cè)試過(guò)程中下載的文件

基礎(chǔ)概念

Cypress和cy的區(qū)別 cypress是一個(gè)全局對(duì)象，在整個(gè)測(cè)試的過(guò)程中會(huì)持續(xù)存在，當(dāng)你希望跟蹤整個(gè)程序未捕獲或者失敗事件時(shí)，比較有用。(以下代碼是自定義的fail方法，可以在各個(gè)測(cè)試用例中使用)

	Cypress.on('fail', (error, runnable) => {
		throe error;
	})

cy是單個(gè)測(cè)試的對(duì)象，它將綁定到每一個(gè)單獨(dú)測(cè)試中，并且，在完成這個(gè)測(cè)試后，自動(dòng)解綁和清理。

describe( )/context( ) 和 it( ) 對(duì)于一條可執(zhí)行的測(cè)試用例來(lái)說(shuō)，describe()和it()是兩個(gè)必要的組成部分，describe()表示測(cè)試套件，context()是它的別名，可以直接用context()代替

鉤子函數(shù) - before() 運(yùn)行cypress時(shí)，在開(kāi)始測(cè)試前都會(huì)調(diào)用這個(gè)鉤子函數(shù)，在鉤子中，可以將接口代理到mock數(shù)據(jù) - after() 在所有用例跑完后運(yùn)行 - beforeEach() 每個(gè)用例開(kāi)始前都會(huì)運(yùn)行 - afterEach() 每個(gè)用例結(jié)束后運(yùn)行。有人會(huì)在這里寫下以下代碼：

	describe('loggout', () => {
		beforeEach(() => {
			cy.login();
		})
	
		afterEach(() => {
			cy.logout();
		})
	})

這樣的行為可能是不必要的，原因是，當(dāng)測(cè)試用例跑完后，這些登錄狀態(tài)不僅在測(cè)試時(shí)被修改，而且會(huì)保存到程序的狀態(tài)中。意味著你測(cè)試完后退出登錄后，當(dāng)你運(yùn)行代碼時(shí)，就會(huì)發(fā)現(xiàn)自己回到了登錄頁(yè)(cypress保存了你退出登錄的狀態(tài)）。

使用場(chǎng)景：

如果你想要在不同的測(cè)試用例中共享同一個(gè)變量，你可以在before或beforeEach鉤子中定義這個(gè)變量，在隨后的用例中使用它。

在開(kāi)始測(cè)試前，準(zhǔn)備好測(cè)試環(huán)境（向后端發(fā)起請(qǐng)求，準(zhǔn)備好測(cè)試數(shù)據(jù)，或者mock數(shù)據(jù)）

以上就是“e2e測(cè)試之cypress怎么使用”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會(huì)為大家更新不同的知識(shí)，如果還想學(xué)習(xí)更多的知識(shí)，請(qǐng)關(guān)注億速云行業(yè)資訊頻道。