Skip to content

feat: testHook returns result ref object #297

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Feb 12, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 16 additions & 1 deletion src/__tests__/test-hook.js
Original file line number Diff line number Diff line change
@@ -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)

Expand Down Expand Up @@ -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)
})
16 changes: 13 additions & 3 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -61,21 +61,31 @@ 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 = <TestHook callback={callback} />
const hookRender = (
<TestHook callback={callback}>
{res => {
result.current = res
}}
</TestHook>
)
if (options.wrapper) {
return React.createElement(options.wrapper, null, hookRender)
}
return hookRender
}
const {unmount, rerender: rerenderComponent} = render(toRender())
return {
result,
unmount,
rerender: () => {
rerenderComponent(toRender())
Expand Down
8 changes: 6 additions & 2 deletions typings/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@ export type RenderResult<Q extends Queries = typeof queries> = {
asFragment: () => DocumentFragment
} & {[P in keyof Q]: BoundFunction<Q[P]>}

export type HookResult = {
export type HookResult<TResult> = {
result: React.MutableRefObject<TResult>
rerender: () => void
unmount: () => boolean
}
Expand Down Expand Up @@ -52,7 +53,10 @@ export function render<Q extends Queries>(
/**
* Renders a test component that calls back to the test.
*/
export function testHook(callback: () => void, options?: Partial<HookOptions>): HookResult
export function testHook<T>(
callback: () => T,
options?: Partial<HookOptions>,
): HookResult<T>

/**
* Unmounts React trees that were mounted with render.
Expand Down