diff --git a/src/__tests__/test-hook.js b/src/__tests__/test-hook.js index 00b5cc80..4b54bfb8 100644 --- a/src/__tests__/test-hook.js +++ b/src/__tests__/test-hook.js @@ -1,6 +1,6 @@ import React, {useState, useEffect} from 'react' import 'jest-dom/extend-expect' -import {testHook, cleanup} from '../' +import {testHook, cleanup, act} from '../' afterEach(cleanup) @@ -60,3 +60,18 @@ test('accepts wrapper option to wrap rendered hook with', () => { ) expect(actual).toBe(12) }) +test('returns result ref with latest result from hook execution', () => { + function useCounter({initialCount = 0, step = 1} = {}) { + const [count, setCount] = React.useState(initialCount) + const increment = () => setCount(c => c + step) + const decrement = () => setCount(c => c - step) + return {count, increment, decrement} + } + + const {result} = testHook(useCounter) + expect(result.current.count).toBe(0) + act(() => { + result.current.increment() + }) + expect(result.current.count).toBe(1) +}) diff --git a/src/index.js b/src/index.js index 5410d0dd..31f99339 100644 --- a/src/index.js +++ b/src/index.js @@ -61,14 +61,23 @@ function render( } } -function TestHook({callback}) { - callback() +function TestHook({callback, children}) { + children(callback()) return null } function testHook(callback, options = {}) { + const result = { + current: null, + } const toRender = () => { - const hookRender = + const hookRender = ( + + {res => { + result.current = res + }} + + ) if (options.wrapper) { return React.createElement(options.wrapper, null, hookRender) } @@ -76,6 +85,7 @@ function testHook(callback, options = {}) { } const {unmount, rerender: rerenderComponent} = render(toRender()) return { + result, unmount, rerender: () => { rerenderComponent(toRender()) diff --git a/typings/index.d.ts b/typings/index.d.ts index 941e4bfc..16594936 100644 --- a/typings/index.d.ts +++ b/typings/index.d.ts @@ -19,7 +19,8 @@ export type RenderResult = { asFragment: () => DocumentFragment } & {[P in keyof Q]: BoundFunction} -export type HookResult = { +export type HookResult = { + result: React.MutableRefObject rerender: () => void unmount: () => boolean } @@ -52,7 +53,10 @@ export function render( /** * Renders a test component that calls back to the test. */ -export function testHook(callback: () => void, options?: Partial): HookResult +export function testHook( + callback: () => T, + options?: Partial, +): HookResult /** * Unmounts React trees that were mounted with render.