博為峰老師直接接聽

400-029-0997 轉(zhuǎn) 28316 掃碼撥號
微信掃碼撥號

干貨來了！端到端測試中的測試種類及工具的說明！

作者：博為峰 來源：博為峰 2023年04月23日 更新

單元測試 即Unit Testing，簡稱 UT，是指對軟件中的最小可測試單元進行檢查和驗證，這是*低級別的測試活動，前端開發(fā)中單元可以是一個function也可以是一個class，也可以是一個組件。 對他們的輸出做斷言檢查，是一個白盒測試，一般由開發(fā)者進行編寫，開發(fā)者可以通過編寫執(zhí)行 UT 來判斷...

單元測試 即Unit Testing，簡稱 UT，是指對軟件中的最小可測試單元進行檢查和驗證，這是*低級別的測試活動，前端開發(fā)中單元可以是一個function也可以是一個class，也可以是一個組件。 對他們的輸出做斷言檢查，是一個白盒測試，一般由開發(fā)者進行編寫，開發(fā)者可以通過編寫執(zhí)行 UT 來判斷自己的邏輯是否正確。 集成測試 Integration Testing，其實集成測試就是根據(jù)業(yè)務功能需要把多個單元整合起來進行測試。 引用 React 官網(wǎng)上的說法：“單元測試”和“集成測試”之間的差別可能會很模糊。 如果你在測試一個表單，用例是否應該也測試表單里的按鈕呢？一個按鈕組件又需不需要有他自己的測試套件？重構(gòu)按鈕組件是否應該影響表單的測試用例？不同的團隊或產(chǎn)品可能會得出不同的答案。 端到端測試 end-to-end，簡稱 e2e，也被稱作功能測試（Functional Testing）或者瀏覽器測試或者冒煙測試，是指從使用者的角度出發(fā)，對真實系統(tǒng)進行測試。 e2e測試本質(zhì)上是一種黑盒測試，相當于模擬用戶訪問應用程序，主要檢查界面或功能是否正確，自動化測試不完善的時候通常是由人工來完成這項測試工作。 界面測試 User Interface Testing，簡稱 UI 測試，與 e2e 測試存在大量重疊，通常在做 e2e 的時候就能夠覆蓋 UI 測試。 TDD Test Drive Development 即測試驅(qū)動開發(fā)。 簡單的說就是先根據(jù)需求寫測試用例，再代碼實現(xiàn)，接著測試，循環(huán)此過程直到產(chǎn)品的實現(xiàn)。 可以看出來，TDD的基本思路就是通過測試來推動整個開發(fā)的進行，但測試驅(qū)動開發(fā)并不只是單純的測試工作，而是把需求分析、設(shè)計、質(zhì)量控制量化的過程。 BDD Behavior Drive Development即行為驅(qū)動開發(fā)，BDD 可以看作是對 TDD 的一種補充，或者說是 TDD 的一個分支。 在 TDD 中，我們并不能完全保證根據(jù)設(shè)計所編寫的測試就是用戶所期望的功能。BDD 將這一部分簡單和自然化，用自然語言來描述，讓開發(fā)、測試、BA 以及客戶都能在這個基礎(chǔ)上達成一致。 BDD 更加依賴于需求行為和文檔來驅(qū)動開發(fā)，這些文檔的描述跟測試代碼很相似。e2e 測試更多是和 BDD 的開發(fā)模式進行結(jié)合。 綜上所述，后文主要會針對單元測試和端到端測試常用的工具進行使用說明和對比。
前端測試工具
前端測試工具有很多，可以分為幾類： 斷言庫 測試覆蓋率工具 測試框架 斷言庫 測試的時候我們需要使用斷言來判斷代碼是否到達目的，如果沒有斷言，我們的測試也將失去意義。
0 1
assert assert 是 Node.JS 內(nèi)置的斷言庫，下面是一個簡單的例子： const assert 'assert' ); assert ( 1 2 ); const 'hello world' ; assert .strictEqual( 'helloworld' （左右滑動查看完整代碼）
0 2

chai 這個斷言庫很全很強大，提供了常用的 assert、should、expect 斷言關(guān)鍵字。

https://mmbiz.qpic.cn/mmbiz_png/BuV4gXrNvFpz7OkR8H9LSKVmTx126AILrVT0x2WOyQkc5TWrb0zFicGV7mPib6ibH8X6ju4UmnPMVic52JHDPDXEfA/640?wx_fmt=png

0 3
power-assert 如果你在使用assert的話，無需使用require('power-assert')來引入power-assert，它的API與assert一樣，而且擁有強大的提示信息，如下圖所示。
（左右滑動查看完整代碼） 安裝： npmipower- assert （左右滑動查看完整代碼） 測試覆蓋率工具
0 1
Istanbul 這個軟件以土耳其*大城市伊斯坦布爾命名，因為土耳其地毯世界聞名，而地毯是用來覆蓋的。 安裝： npm install-gistanbul （左右滑動查看完整代碼） 運行： istanbul coverpath （左右滑動查看完整代碼） 測試框架 測試框架的作用是提供一些方便的語法來描述測試用例，比如可以對一組用例進預處理和后處理（beforeAll、beforeEach、afterAll、afterEach等），使用 describe函數(shù)表示一組用例，下面將會列舉一些常見的測試框架，并做簡單的分析。
0 1
Jest Jest 是Facebook出品的一個測試框架，算是一個大而全的測試框架，內(nèi)置斷言、測試覆蓋率工具、Mock工具，開箱即用，支持瀏覽器和 NodeJS，支持BDD寫法（也就是expect語法）是React官方推薦使用的測試框架。 Jest既可以用來做單元測試，也可以用來做端到端測試，在做端到端測試的時候可以使用jsdom，網(wǎng)絡(luò)請求使用本地mock數(shù)據(jù)，這樣可以確保毫秒級完成單元測試，如果需要使用真實DOM，還是需要配合其它測試工具。
0 2
Mocha Macha也是一個功能豐富的JS測試框架，支持瀏覽器和 NodeJS，不過沒有內(nèi)置斷言庫、測試覆蓋率工具和Mock工具，需要和其他三方庫配合使用，比如配合chai使用 就可以支持TDD寫法（也就是assert.equal語法），當然 BDD 寫法也是支持的。 Mocha既可以用來做單元測試，也可以用來做端到端測試，做端到端測試的時候需要配合其它測試工具。
0 3
Jasmine Jasmine 是一個BDD 測試框架，支持瀏覽器和NodeJS 、內(nèi)置斷言庫、mock 工具等，經(jīng)常配合Karam使用，但是隨著Jest這種大而全的框架的崛起，Jasmine顯得比較老派，現(xiàn)在熱度逐年下降，使用的人也越來越少。 e2e測試工具
0 1
Cypress Cypress是一個e2e測試框架，測試界面和文檔做到的一個產(chǎn)品。
0 2
PhantomJS PhantomJS，一個基于 webkit 內(nèi)核的無頭瀏覽器，沒有 UI 界面。用js代碼模擬一些web界面上的操作，用起來比較不方便，不太推薦使用。
0 3
NightmareJS NightmareJS，一個輕量級瀏覽器自動化測試庫?；贓lectron，和PhantomJS類似，但是快了大約2倍且更現(xiàn)代。 Nightmare還有個優(yōu)點——它提供了一個Chrome插件 daydream，該插件可以通過錄制屏幕，自動化生成測試代碼，不過最近一次更新是在2019年，也不太推薦使用。
0 4
Playwright Playwright為現(xiàn)代web應用程序提供可靠的端到端測試。支持使用NodeJS、python、Java、.net四種編程語言的 API，同時支持Google Chrome和Microsoft Edge（帶有Chromium）、Apple Safari（帶有WebKit）和 Mozilla Firefox。 Playwright支持所有瀏覽器和所有平臺的無頭（無瀏覽器 UI）和有頭（帶瀏覽器 UI）模式。Headed非常適合調(diào)試，而Headless速度更快，適合CI/云執(zhí)行。
0 5
Storybook Storybook 是一個開源工具，用于獨立構(gòu)建 UI 組件和頁面，它簡化了 UI 開發(fā)、測試和文檔編制。
0 6
Selenium Selenium是e2e測試鼻祖級的框架，有多種編程語言的版本，它是基于webdriver而不是webkit內(nèi)核實現(xiàn)的，所以，Selenium的瀏覽器兼容性相對于其他瀏覽器要好很多。
0 7
Nightwatch Nightwatch原Selenium，是一個用于web網(wǎng)站或應用的自動化測試框架，使用node.js和W3C WebDriver API。 他也是一個完整和集成的解決方案，使用 BDD 方式，用于網(wǎng)絡(luò)應用程序和網(wǎng)站的端到端測試。它還可用于Node.js 單元和集成測試。 Nightwatch 的兼容性比較好，F(xiàn)irefox、Chrome、Safari、edge都可以測。
0 8
Protractor Protractor是一個針對Angular的e2e測試框架。 測試框架運行環(huán)境
0 1
Karam Karam官網(wǎng)介紹是一個可以在多個瀏覽器中執(zhí)行 js 代碼的簡單工具。它不是一個完整的測試框架，沒有斷言庫，只是啟動了一個 http 服務器，然后生成測試 html 文件，執(zhí)行測試用例的 js。 嚴格來講Karam其實不算是一個測試框架，而是一個運行測試框架的環(huán)境。
0 2
Puppeteer 既然是瀏覽器，那么我們手工可以在瀏覽器上做的事情Puppeteer都能勝任，另外，Puppeteer 翻譯成中文是”木偶”意思，所以聽名字就知道，操縱起來很方便。 配合headless-recorder，一個Chrome插件，可以對操作進行錄制，錄制的操作有puppeteer和playwright兩個版本。 其它測試工具
0 1
AVA AVA是Node.JS的測試工具，具有簡潔的API、詳細的錯誤輸出、支持新語法以及流程隔離。
End

鏈接： https://juejin.cn/post/6978852736976551950 本文為經(jīng)授權(quán)轉(zhuǎn)載，轉(zhuǎn)載文章所包含的文字來源于原作者。如因內(nèi)容或版權(quán)等問題，請聯(lián)系刪除

點擊下方 “閱讀原文” ，了解 職業(yè)新風向~

    相關(guān)資訊

  • 杭州博為峰IT培訓師資：多領(lǐng)域資深實戰(zhàn)講師團隊

    在IT培訓里，師資是學員能不能真正學懂技能的關(guān)鍵。杭州博為峰做了20年IT職業(yè)培訓，攢了一支覆蓋軟件測試、大數(shù)據(jù)、web前端、編程語言的實戰(zhàn)講師團隊——老師既有企業(yè)一線項目經(jīng)驗，還懂怎么教，復雜技術(shù)能拆成容易學的內(nèi)容，零基礎(chǔ)也能跟上。

    2026/3/15 23:33:02

  • 杭州博為峰大數(shù)據(jù)培訓：定制化培養(yǎng)簽就業(yè)協(xié)議

    數(shù)字經(jīng)濟時代，數(shù)據(jù)成“香餑餑”，可會“挖數(shù)據(jù)”的人才太少了。杭州博為峰做了20年IT培訓，靠“就業(yè)協(xié)議”（不就業(yè)全額退）和專職師資幫人學數(shù)據(jù)分析——8萬多學員里有零基礎(chǔ)6個月拿8K起薪的，還有終身職業(yè)護航（免費直播、中高級崗推薦），想轉(zhuǎn)行或提升的，不妨看看這家“敢兜底”的機構(gòu)。

    2026/3/14 23:29:37

  • 杭州博為峰Python培訓：從基礎(chǔ)到項目的全流程教學

    想入門Python卻怕學不會？擔心培訓后找不到工作？杭州博為峰Python培訓從基礎(chǔ)語法到項目實戰(zhàn)，3個月幫小白變技術(shù)達人——有就業(yè)協(xié)議保障、1對1面試輔導，更有終身職業(yè)護航：免費技能直播、中高級崗位推薦，陪你在IT行業(yè)長期成長。數(shù)據(jù)時代，Python是挖寶鑰匙，博為峰就是你的“尋寶指南”。

    2026/3/13 23:27:27

  • 杭州博為峰Web前端培訓：多語言多平臺雙就業(yè)路線

    零基礎(chǔ)想進Web前端？杭州博為峰的課從服務器端到React、Django這些框架全教，還有“學子商城”真項目練手。簽就業(yè)協(xié)議，7000+企業(yè)直接對接需求——去年大專生學3個月拿8Koffer，更有終身技能提升和崗位推薦，想入行或提升都能找它。

    2026/3/12 23:24:56

  • 杭州博為峰JAVA培訓：全棧課程覆蓋微服務架構(gòu)

    想從零基礎(chǔ)學Java全棧？杭州博為峰的課程或許是個好選擇——從Java基礎(chǔ)到微服務架構(gòu)全覆蓋，有應屆生小林靠它拿到互聯(lián)網(wǎng)公司后端offer的真實案例，搭配實戰(zhàn)項目、就業(yè)協(xié)議和資深師資，幫你穩(wěn)穩(wěn)踏入IT行業(yè)。

    2026/3/11 23:20:10

“杭州博為峰”是杭州博為峰軟件技術(shù)有限公司在教育寶平臺開設(shè)的店鋪，最后更新時間： 。若該店鋪內(nèi)信息涉嫌虛假或違法，請點擊這里向教育寶反饋，我們將及時進行處理。如需緊急協(xié)助建聯(lián)請撥打：400-601-2788（教育寶人工客服協(xié)助您與該機構(gòu)建聯(lián)）

機構(gòu)評分

環(huán)境：4.0師資：4.0服務：4.0效果：4.0

公示信息

店鋪名稱：杭州博為峰

單位名稱：杭州博為峰軟件技術(shù)有限公司

賬號名稱：hzbwfjy（180******75）

所屬城市：浙江杭州

入駐時長：23年

聯(lián)系電話： 400-029-0997 轉(zhuǎn) 28316

微信咨詢

返回頂部