@testing-library/react-hooks
Advanced tools
@testing-library/react-hooks - npm Package Compare versions
Comparing version 1.0.2 to 1.0.3
| { | ||
| "name": "@testing-library/react-hooks", | ||
| "version": "1.0.2", | ||
| "version": "1.0.3", | ||
| "description": "Simple and complete React hooks testing utilities that encourage good testing practices.", | ||
@@ -30,10 +30,14 @@ "main": "lib/index.js", | ||
| "build": "babel --out-dir lib src", | ||
| "format": "prettier-eslint --write \"**/*.{js,json,md}\"", | ||
| "format": "prettier-eslint --write \"**/*.{js,json,md,mdx}\"", | ||
| "coverage": "codecov", | ||
| "test": "jest", | ||
| "test:ci": "npm run test && npm run coverage", | ||
| "docs:dev": "docz dev", | ||
| "docs:build": "docz build", | ||
| "contributors:add": "all-contributors add" | ||
| }, | ||
| "dependencies": { | ||
| "@babel/runtime": "^7.4.2" | ||
| "@babel/runtime": "^7.4.2", | ||
| "@types/react": "16.8.22", | ||
| "@types/react-test-renderer": "^16.8.2" | ||
| }, | ||
@@ -48,3 +52,2 @@ "devDependencies": { | ||
| "@babel/preset-react": "7.0.0", | ||
| "@types/react": "16.8.20", | ||
| "all-contributors-cli": "6.7.0", | ||
@@ -54,2 +57,4 @@ "babel-eslint": "10.0.2", | ||
| "codecov": "3.5.0", | ||
| "docz": "^1.0.4", | ||
| "docz-theme-default": "^1.0.4", | ||
| "eslint": "5.16.0", | ||
@@ -56,0 +61,0 @@ "eslint-config-prettier": "5.0.0", |
| <div align="center"> | ||
| <h1>react-hooks-testing-library</h1> | ||
| <h1>react-hooks-testing-library</h1> | ||
@@ -15,2 +15,5 @@ <a href="https://www.emojione.com/emoji/1f40f"> | ||
| <br /> | ||
| <a href="https://react-hooks-testing-library.com/"><strong>Read The Docs</strong> (Work-In-Progress)</a> | ||
| <br /> | ||
| </div> | ||
@@ -31,2 +34,3 @@ | ||
| [](https://github.com/testing-library/react-hooks-testing-library/blob/master/CODE_OF_CONDUCT.md) | ||
| [](https://app.netlify.com/sites/react-hooks-testing-library/deploys) | ||
@@ -53,7 +57,5 @@ [](https://github.com/testing-library/react-hooks-testing-library/watchers) | ||
| utility functions for updating the inputs and retrieving the outputs of your amazing custom hook. | ||
| This library aims to provide a testing experience as close as possible to natively using your hook | ||
| from within a real component. | ||
| Similarly to [`react-testing-library`](http://npm.im/@testing-library/react), which this library | ||
| draws much of it's inspiration from, it aims to provide a testing experience as close as possible to | ||
| natively using your hook from within a real component. | ||
| Using this library, you do not have to concern yourself with how to construct, render or interact | ||
@@ -63,3 +65,3 @@ with the react component in order to test your hook. You can just use the hook directly and assert | ||
| ### When to use this library | ||
| ## When to use this library | ||
@@ -69,3 +71,3 @@ 1. You're writing a library with one or more custom hooks that are not directly tied a component | ||
| ### When not to use this library | ||
| ## When not to use this library | ||
@@ -77,4 +79,5 @@ 1. Your hook is defined along side a component and is only used there | ||
| ### `useCounter.js` | ||
| ```js | ||
| // useCounter.js | ||
| import { useState, useCallback } from 'react' | ||
@@ -86,5 +89,4 @@ | ||
| const increment = useCallback(() => setCount((x) => x + 1), []) | ||
| const decrement = useCallback(() => setCount((x) => x - 1), []) | ||
| return { count, increment, decrement } | ||
| return { count, increment } | ||
| } | ||
@@ -95,4 +97,5 @@ | ||
| ### `useCounter.test.js` | ||
| ```js | ||
| // useCounter.test.js | ||
| import { renderHook, act } from '@testing-library/react-hooks' | ||
@@ -104,14 +107,8 @@ import useCounter from './useCounter' | ||
| act(() => result.current.increment()) | ||
| act(() => { | ||
| result.current.increment() | ||
| }) | ||
| expect(result.current.count).toBe(1) | ||
| }) | ||
| test('should decrement counter', () => { | ||
| const { result } = renderHook(() => useCounter()) | ||
| act(() => result.current.decrement()) | ||
| expect(result.current.count).toBe(-1) | ||
| }) | ||
| ``` | ||
@@ -135,4 +132,4 @@ | ||
| There are some [work-in-progress docs here](https://react-hooks-testing-library.netlify.com/). | ||
| Please leave any feedback on them in | ||
| There are some [work-in-progress docs here](https://react-hooks-testing-library.com/). Please leave | ||
| any feedback on them in | ||
| [this issue](https://github.com/testing-library/react-hooks-testing-library/issues/19). PRs to | ||
@@ -143,41 +140,7 @@ update them are very welcome. | ||
| ### `renderHook(callback[, options])` | ||
| See the [API documentation](https://react-hooks-testing-library.com/reference/api). | ||
| Renders a test component that will call the provided `callback`, including any hooks it calls, every | ||
| time it renders. | ||
| #### Arguments | ||
| - `callback` (`function()`) - function to call each render. This function should call one or more | ||
| hooks for testing. | ||
| - `options` (`object`) - accept the following settings: | ||
| - `initialProps` (`object`) - the initial values to pass to the `callback` function | ||
| - `wrapper` (`component`) - pass a React Component as the wrapper option to have it rendered | ||
| around the inner element. This is most useful for creating reusable custom render functions for | ||
| common data providers | ||
| #### Returns | ||
| - `result` (`object`) | ||
| - `current` (`any`) - the return value of the `callback` function | ||
| - `error` (`Error`) - the error that was thrown if the `callback` function threw an error during | ||
| rendering | ||
| - `waitForNextUpdate` (`function`) - returns a `Promise` that resolves the next time the hook | ||
| renders, commonly when state is updated as the result of a asynchronous action. | ||
| - `rerender` (`function([newProps])`) - function to rerender the test component including any hooks | ||
| called in the `callback` function. If `newProps` are passed, the will replace the `initialProps` | ||
| passed the the `callback` function for future renders. | ||
| - `unmount` (`function()`) - function to unmount the test component, commonly used to trigger | ||
| cleanup effects for `useEffect` hooks. | ||
| ### `act(callback)` | ||
| This is the same | ||
| [`act` function](https://reactjs.org/docs/hooks-faq.html#how-to-test-components-that-use-hooks) that | ||
| is exported by `react-test-renderer`. | ||
| ## Contributors | ||
| Thanks goes to these wonderful people | ||
| ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)): | ||
| Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): | ||
@@ -190,4 +153,4 @@ <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --> | ||
| This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) | ||
| specification. Contributions of any kind welcome! | ||
| This project follows the [all-contributors](https://allcontributors.org/) specification. | ||
| Contributions of any kind welcome! | ||
@@ -194,0 +157,0 @@ ## Issues |
@@ -1,17 +0,24 @@ | ||
| export function renderHook<P, R>( | ||
| callback: (props: P) => R, | ||
| options?: { | ||
| initialProps?: P, | ||
| wrapper?: React.ComponentType | ||
| } | ||
| ): { | ||
| readonly result: { | ||
| readonly current: R, | ||
| readonly error: Error | ||
| } | ||
| import { ComponentType } from 'react' | ||
| export { act } from 'react-test-renderer' | ||
| interface RenderHookOptions<P> { | ||
| initialProps?: P | ||
| wrapper?: React.ComponentType | ||
| } | ||
| interface HookResult<R> { | ||
| readonly current: R | ||
| readonly error: Error | ||
| } | ||
| interface RenderHookResult<P, R> { | ||
| readonly result: HookResult<R> | ||
| readonly waitForNextUpdate: () => Promise<void> | ||
| readonly unmount: () => boolean | ||
| readonly rerender: (hookProps?: P) => void | ||
| readonly rerender: (newProps?: P) => void | ||
| } | ||
| export function act(callback: () => void): void | ||
| export function renderHook<P, R>( | ||
| callback: (props: P) => R, | ||
| options?: RenderHookOptions<P> | ||
| ): RenderHookResult<P, R> |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Lines of code
- increased by1.83%
222
Worsened metrics
- Total package byte prevSize
- decreased by-5.78%
21172
- Dependency count
- increased by66.67%
5
- Dev dependency count
- increased by4%
26
- Number of lines in readme file
- decreased by-17.37%
176
Dependency changes
+ Added@types/react@16.8.22
+ Added@types/prop-types@15.7.13(transitive)
+ Added@types/react@16.8.22(transitive)
+ Added@types/react-test-renderer@16.9.12(transitive)
+ Addedcsstype@2.6.21(transitive)