當前位置:編程學習大全網 - 源碼下載 - React Testing Library入門

React Testing Library入門

React Testing Library 基於 DOM Testing Library 的基礎上添加壹些API,主要用於測試React組件。如果是其它的技術棧,可以選擇對應的Testing Library庫。該庫在使用過程並不關註組件的內部實現,而是更關註測試。該庫基於react-dom和react-dom/test-utils,是以上兩者的輕量實現。

註:React Testing Library官方文檔需翻墻查看。

註:如果使用Create React App初始化React應用時,會有選項提示是否要使用React Testing Library

在編寫單元測試過程中,可以按照AAA模式實現。

更多例子: fetch

推薦教程: How to use React Testing Library Tutorial

render

render的參數:

render的結果:

render的例子:

文檔: /docs/react-testing-library/api#render

cleanup

相當於給組件置成unmount,壹般在afterEach()中執行,如果使用的Jest,不需要在afterEach中手動設置,框架已默認每次test結束後執行cleanup。

Queries

關於具體差別的例子可以看: /docs/react-testing-library/setup#add-custom-queries

詳細queries,查閱: /docs/react-testing-library/cheatsheet#queries

fireEvent

events API

act

對react-dom/test-utils中的 act 函數進行了壹層包裝。act的作用是在妳進行斷言之前,保證所有由組件渲染、用戶交互以及數據獲取產生的 更新 全部在dom實現。

waitFor

用於異步

screen

screen的方法繼承自queries, queries有的能力都有,此外還增加了debug()的能力.

(1) 關於更多自定義的東西,例如render、選擇器以及與Jest有的配置,查閱 官方文檔 吧,寫得也是很清楚哦!

(2)對於dom的壹些斷言,可以添加testing-library庫提供的jest-dom/extend-expect來更好得對dom進行斷言。

匹配器概覽:

具體用法,可以 查閱文檔

好啦,關於React testing Library的東西基本都涵蓋了,至於更深層的東西,就去查閱源碼吧!

  • 上一篇:X10BL解鎖失敗 開不了機怎麽辦 BL解鎖重啟動後。我再關了機開機就不到了,就是震動壹下壹直黑屏跟沒有開機
  • 下一篇:如何配置優化環境,讓wordpress訪問提速
  • copyright 2024編程學習大全網