與其他測試執行器的比較
Jest
Jest 透過提供對大多數 JavaScript 專案的開箱即用支援、舒適的 API(it
和 expect
)以及大多數設定所需的一整套測試功能(快照、模擬、覆蓋率),佔領了測試架構領域。我們感謝 Jest 團隊和社群建立了一個令人愉快的測試 API,並推動了許多現在成為 Web 生態系統標準的測試模式。
可以在 Vite 設定中使用 Jest。 @sodatea 建立了 vite-jest,其目標是為 Jest 提供一流的 Vite 整合。 Jest 中最後的阻礙 已解決,因此這是單元測試的有效選項。
然而,在 Vite 為最常見的 Web 工具(TypeScript、JSX、最受歡迎的 UI 架構)提供支援的世界中,Jest 代表了複雜性的重複。如果您的應用程式是由 Vite 提供支援,則沒有理由同時設定和維護兩個不同的管線。使用 Vitest,您可以將開發、建置和測試環境的設定定義為單一管線,並共用相同的外掛程式和相同的 vite.config.js。
即使您的程式庫未使用 Vite(例如,如果它是使用 esbuild 或 Rollup 建立的),Vitest 仍然是一個有趣的選項,因為它可以讓您的單元測試執行得更快,並透過使用 Vite 即時熱模組重新載入 (HMR) 的預設監控模式,提升 DX。Vitest 與大多數 Jest API 和生態系統程式庫相容,因此在大多數專案中,它應該是 Jest 的替代品。
Cypress
Cypress 是一個基於瀏覽器的測試執行器,也是 Vitest 的互補工具。如果您想使用 Cypress,我們建議在您的應用程式中使用 Vitest 處理所有無頭邏輯,並使用 Cypress 處理所有基於瀏覽器的邏輯。
Cypress 被稱為端對端測試工具,但他們的 新的元件測試執行器 非常支援測試 Vite 元件,而且是測試任何在瀏覽器中呈現內容的理想選擇。
基於瀏覽器的執行器,例如 Cypress、WebdriverIO 和 Web Test Runner,會偵測 Vitest 無法偵測到的問題,因為它們使用真正的瀏覽器和真正的瀏覽器 API。
Cypress 的測試驅動程式專注於判斷元素是否可見、可存取和可互動。Cypress 專門用於 UI 開發和測試,其 DX 以測試驅動您的視覺元件為中心。您會看到您的元件與測試報告員並排呈現。測試完成後,元件仍可互動,您可以使用瀏覽器開發人員工具除錯發生的任何失敗。
相反地,Vitest 專注於提供最佳的 DX,以進行極速、無頭測試。基於 Node 的執行器(例如 Vitest)支援各種部分實作的瀏覽器環境,例如 jsdom
,它實作了足夠的功能,讓您可以快速單元測試任何參照瀏覽器 API 的程式碼。折衷之處在於這些瀏覽器環境在它們可以實作的內容方面有其限制。例如,jsdom 缺少許多功能,例如 window.navigation
或版面引擎 (offsetTop
等)。
最後,與 Web Test Runner 相比,Cypress 測試執行器更像是一個 IDE,而不是一個測試執行器,因為您還可以在瀏覽器中看到實際呈現的元件,以及其測試結果和記錄。
Cypress 也已 將 Vite 整合到其產品中:使用 Vitesse 重新建構其應用程式的 UI,並使用 Vite 來測試驅動其專案的開發。
我們認為 Cypress 不是單元測試無頭程式碼的理想選擇,但使用 Cypress (進行 E2E 和元件測試) 和 Vitest (進行單元測試) 可以滿足您的應用程式測試需求。
WebdriverIO
WebdriverIO 與 Cypress 類似,是一種基於瀏覽器的替代測試執行器,也是 Vitest 的互補工具。它可用作端對端測試工具,也可用于測試 網頁元件。它甚至在幕後使用 Vitest 的元件,例如在元件測試中進行 模擬和存根。
WebdriverIO 具有與 Cypress 相同的優點,讓您可以在真實瀏覽器中測試邏輯。然而,它使用實際的 網路標準 進行自動化,這克服了在 Cypress 中執行測試時的一些折衷和限制。此外,它還允許您在行動裝置上執行測試,讓您可以在更多環境中測試應用程式。
網路測試執行器
@web/test-runner 在無頭瀏覽器中執行測試,提供與您的網路應用程式相同的執行環境,而不需要模擬瀏覽器 API 或 DOM。這也使得使用開發人員工具在真實瀏覽器中進行偵錯成為可能,儘管沒有顯示 UI 來逐步執行測試,就像在 Cypress 測試中一樣。
要將 @web/test-runner 與 Vite 專案搭配使用,請使用 @remcovaes/web-test-runner-vite-plugin。@web/test-runner 不包含斷言或模擬函式庫,因此由您來新增它們。
uvu
uvu 是 Node.js 和瀏覽器的測試執行器。它在單一執行緒中執行測試,因此測試並未隔離,且可能會在檔案間外洩。然而,Vitest 使用工作執行緒來隔離測試並平行執行它們。
在轉換程式碼方面,uvu 依賴於 require 和載入器掛鉤。Vitest 使用 Vite,因此檔案會透過 Vite 外掛系統的完整功能進行轉換。在 Vite 提供對最常見網路工具(TypeScript、JSX、最受歡迎的 UI 框架)提供支援的世界中,uvu 代表了複雜性的重複。如果您的應用程式是由 Vite 提供支援,則擁有兩個不同的管線來設定和維護是無法證明合理的。使用 Vitest,您可以將開發、建置和測試環境的設定定義為單一管線,共用相同的外掛和相同的設定。
uvu 沒有提供智慧型監控模式來重新執行已變更的測試,而 Vitest 則透過使用 Vite 即時熱模組重新載入 (HMR) 的預設監控模式,為您提供驚人的 DX。
uvu 是執行簡單測試的快速選項,但 Vitest 對於更複雜的測試和專案來說可能更快、更可靠。