|
6 | 6 | */ |
7 | 7 | import {testHook, act, cleanup} from 'react-testing-library' |
8 | 8 |
|
9 | | -import useCounter from '../react-hooks' |
| 9 | +import {useCounter, useDocumentTitle, useCall} from '../react-hooks' |
10 | 10 |
|
11 | 11 | afterEach(cleanup) |
12 | 12 |
|
13 | | -test('accepts default initial values', () => { |
14 | | - let count |
15 | | - testHook(() => ({count} = useCounter())) |
| 13 | +describe('useCounter', () => { |
| 14 | + test('accepts default initial values', () => { |
| 15 | + let count |
| 16 | + testHook(() => ({count} = useCounter())) |
16 | 17 |
|
17 | | - expect(count).toBe(0) |
18 | | -}) |
| 18 | + expect(count).toBe(0) |
| 19 | + }) |
19 | 20 |
|
20 | | -test('accepts a default initial value for `count`', () => { |
21 | | - let count |
22 | | - testHook(() => ({count} = useCounter({}))) |
| 21 | + test('accepts a default initial value for `count`', () => { |
| 22 | + let count |
| 23 | + testHook(() => ({count} = useCounter({}))) |
23 | 24 |
|
24 | | - expect(count).toBe(0) |
25 | | -}) |
| 25 | + expect(count).toBe(0) |
| 26 | + }) |
| 27 | + |
| 28 | + test('provides an `increment` function', () => { |
| 29 | + let count, increment |
| 30 | + testHook(() => ({count, increment} = useCounter({step: 2}))) |
| 31 | + |
| 32 | + expect(count).toBe(0) |
| 33 | + act(() => { |
| 34 | + increment() |
| 35 | + }) |
| 36 | + expect(count).toBe(2) |
| 37 | + }) |
| 38 | + |
| 39 | + test('provides an `decrement` function', () => { |
| 40 | + let count, decrement |
| 41 | + testHook(() => ({count, decrement} = useCounter({step: 2}))) |
| 42 | + |
| 43 | + expect(count).toBe(0) |
| 44 | + act(() => { |
| 45 | + decrement() |
| 46 | + }) |
| 47 | + expect(count).toBe(-2) |
| 48 | + }) |
26 | 49 |
|
27 | | -test('provides an `increment` function', () => { |
28 | | - let count, increment |
29 | | - testHook(() => ({count, increment} = useCounter({step: 2}))) |
| 50 | + test('accepts a default initial value for `step`', () => { |
| 51 | + let count, increment |
| 52 | + testHook(() => ({count, increment} = useCounter({}))) |
30 | 53 |
|
31 | | - expect(count).toBe(0) |
32 | | - act(() => { |
33 | | - increment() |
| 54 | + expect(count).toBe(0) |
| 55 | + act(() => { |
| 56 | + increment() |
| 57 | + }) |
| 58 | + expect(count).toBe(1) |
34 | 59 | }) |
35 | | - expect(count).toBe(2) |
36 | 60 | }) |
37 | 61 |
|
38 | | -test('provides an `decrement` function', () => { |
39 | | - let count, decrement |
40 | | - testHook(() => ({count, decrement} = useCounter({step: 2}))) |
| 62 | +// using unmount function to check useEffect behavior when unmounting |
| 63 | +describe('useDocumentTitle', () => { |
| 64 | + test('sets a title', () => { |
| 65 | + document.title = 'original title' |
| 66 | + testHook(() => { |
| 67 | + useDocumentTitle('modified title') |
| 68 | + }) |
41 | 69 |
|
42 | | - expect(count).toBe(0) |
43 | | - act(() => { |
44 | | - decrement() |
| 70 | + expect(document.title).toBe('modified title') |
| 71 | + }) |
| 72 | + |
| 73 | + test('returns to original title when component is unmounted', () => { |
| 74 | + document.title = 'original title' |
| 75 | + const {unmount} = testHook(() => { |
| 76 | + useDocumentTitle('modified title') |
| 77 | + }) |
| 78 | + |
| 79 | + unmount() |
| 80 | + expect(document.title).toBe('original title') |
45 | 81 | }) |
46 | | - expect(count).toBe(-2) |
47 | 82 | }) |
48 | 83 |
|
49 | | -test('accepts a default initial value for `step`', () => { |
50 | | - let count, increment |
51 | | - testHook(() => ({count, increment} = useCounter({}))) |
| 84 | +// using rerender function to test calling useEffect multiple times |
| 85 | +describe('useCall', () => { |
| 86 | + test('calls once on render', () => { |
| 87 | + const spy = jest.fn() |
| 88 | + testHook(() => { |
| 89 | + useCall(spy, []) |
| 90 | + }) |
| 91 | + expect(spy).toHaveBeenCalledTimes(1) |
| 92 | + }) |
| 93 | + |
| 94 | + test('calls again if deps change', () => { |
| 95 | + let deps = [false] |
| 96 | + const spy = jest.fn() |
| 97 | + const {rerender} = testHook(() => { |
| 98 | + useCall(spy, deps) |
| 99 | + }) |
| 100 | + expect(spy).toHaveBeenCalledTimes(1) |
| 101 | + |
| 102 | + deps = [true] |
| 103 | + rerender() |
| 104 | + expect(spy).toHaveBeenCalledTimes(2) |
| 105 | + }) |
| 106 | + |
| 107 | + test('does not call again if deps are the same', () => { |
| 108 | + let deps = [false] |
| 109 | + const spy = jest.fn() |
| 110 | + const {rerender} = testHook(() => { |
| 111 | + useCall(spy, deps) |
| 112 | + }) |
| 113 | + expect(spy).toHaveBeenCalledTimes(1) |
52 | 114 |
|
53 | | - expect(count).toBe(0) |
54 | | - act(() => { |
55 | | - increment() |
| 115 | + deps = [false] |
| 116 | + rerender() |
| 117 | + expect(spy).toHaveBeenCalledTimes(1) |
56 | 118 | }) |
57 | | - expect(count).toBe(1) |
58 | 119 | }) |
0 commit comments