react hooks testing library下載 - react hooks testing library原始碼下載

react hooks testing library

其他源碼

v8.0.1

下載

反應鉤子測試庫

簡單而完整的 React hooks 測試實用程式鼓勵良好的測試實踐。

閱讀文件

關於 React 18 支援的說明

如果您使用的是目前版本的react-testing-library ，請替換

 import { renderHook } from '@testing-library/react-hooks'

和

 import { renderHook } from '@testing-library/react'

替換後，可以卸載@testing-library/react-hooks 。

細節

作為 React 18 變更的一部分，已決定該庫提供的renderHook API 將作為官方添加內容包含在react-testing-library (PR) 和react-native-testing-library (PR) 中目的是為我們的用戶提供更有凝聚力和一致的實施。

請耐心等待，我們將在各自的測試庫中完成這些變更。同時你可以安裝@testing-library/react@^13.1

問題

您正在編寫一個很棒的自訂鉤子並且想要測試它，但是一旦調用它，您就會看到以下錯誤：

不變違規：只能在函數元件體內呼叫掛鉤。

您真的不想只是為了測試這個鉤子而編寫一個組件，並且必須弄清楚如何觸發可以更新鉤子的所有各種方式，特別是考慮到如何將整個事物連接在一起的複雜性。

解決方案

react-hooks-testing-library可讓您為 React hooks 建立一個簡單的測試工具，處理在函數元件體內運行它們，並提供各種有用的實用函數來更新輸入和檢索令人驚嘆的輸出自訂掛鉤。該庫旨在提供盡可能接近在真實組件中本地使用鉤子的測試體驗。

使用這個庫，您不必關心如何建立、渲染或與反應組件互動來測試您的鉤子。您可以直接使用鉤子並斷言結果。

何時使用該庫

您正在編寫一個帶有一個或多個未直接綁定到元件的自訂掛鉤的庫
您有一個複雜的鉤子，很難透過組件互動進行測試

何時不使用該庫

您的鉤子是與組件一起定義的，並且僅在組件中使用
您的鉤子很容易測試，只需使用它測試組件即可

例子

`useCounter.js`

 import { useState , useCallback } from 'react'

function useCounter ( ) {
  const [ count , setCount ] = useState ( 0 )

  const increment = useCallback ( ( ) => setCount ( ( x ) => x + 1 ) , [ ] )

  return { count , increment }
}

export default useCounter

`useCounter.test.js`

 import { renderHook , act } from '@testing-library/react-hooks'
import useCounter from './useCounter'

test ( 'should increment counter' , ( ) => {
  const { result } = renderHook ( ( ) => useCounter ( ) )

  act ( ( ) => {
    result . current . increment ( )
  } )

  expect ( result . current . count ) . toBe ( 1 )
} )

更高級的用法可以在文件中找到。

安裝

npm install --save-dev @testing-library/react-hooks

對等依賴性

react-hooks-testing-library未與react版本捆綁在一起，以允許您安裝要測試的特定版本。它也沒有安裝特定的渲染器，我們目前支援react-test-renderer和react-dom 。您只需要安裝其中之一，但是，如果您同時安裝了兩者，我們將預設使用react-test-renderer 。有關更多信息，請參閱安裝文件。一般來說，已安裝的react版本和所選渲染器應該具有相符的版本：

npm install react@^16.9.0
npm install --save-dev react-test-renderer@^16.9.0

注意： react 、 react-test-renderer和react-dom支援的最低版本是^16.9.0 。

應用程式介面

請參閱 API 參考。

貢獻者

感謝這些優秀的人（表情符號鍵）：

_{麥可·佩珀} ？？？ ️	_{乙豆腐廣場}	_{派崔克·P·亨利} ？？	_{馬修斯馬克斯}	_{德魯夫·帕特爾} ？？	_{納撒尼爾·塔克} ？？	_{謝爾蓋·格里先科} ？
_{何塞·M·索布雷佩爾}	_{馬塞爾·廷納}	_{丹尼爾·K.} ？	_{文斯·馬龍}	_{賽巴斯蒂安·韋伯}	_{克里斯蒂安·吉爾}	_{JavaScript 喬} ✅ ️
_{薩拉·達揚} ？	_{羅曼·古謝夫}	_{亞當·塞克爾}	_{佐佐木惠也} ️	_胡晨	_喬許？？ ️	_{納曼·赫希菲爾德}
_布雷登廳	_{雅各布·M·埃文斯} ️	_{泰格·阿布羅迪} ️	_{阿姆·穆罕默德} ️	_{尤哈娜·賈希艾寧}	_{延斯·邁德茨瑪} ️	_{馬可·莫雷蒂} ？
_馬丁·V.	_埃羅扎克	_{尼克·麥柯迪} ？	_艾莉亞	_麻木86	_{亞歷克斯·楊} ？	_{本·蘭伯特}
_{大衛喬勒拉特}	_艾文哈蒙	_傑森布朗	_丁嘉偉	_{列昂尼德·沙加布季諾夫}	_{利維·布徹}	_{米歇爾·塞特帕尼}
_山姆	_{塔奈·普拉塔普}	_{湯姆·里斯-赫德曼}	_{伊克巴爾125}	_{懸崖趙卜特} ？	_{喬恩‧庫普斯}	_{喬納森·佩珀} ？
_貝恩斯	_{米哈伊爾·瓦辛}	_{亞歷山大·格比奇}	_{喬納森·霍姆斯}	_{邁克爾·德博伊} ？	_{安東·季諾維耶夫} ？	_{瑪麗安娜·埃塞拉特} ？
_{馬坦·博倫克勞特} ？	_安德羅格	_{布萊恩·韋恩} ？？	_{羅伯特·斯諾} ️	_{克里斯·陳} ️	_馬修斯	_賴樹新