1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
import { StrictMode } from 'react'import { fireEvent, render } from '@testing-library/react'import { atom } from 'jotai'import { useReducerAtom } from 'jotai/utils'import { getTestProvider } from '../testUtils'
const Provider = getTestProvider()
it('useReducerAtom with no action argument', async () => {  const countAtom = atom(0)  const reducer = (state: number) => state + 2
  const Parent = () => {    const [count, dispatch] = useReducerAtom(countAtom, reducer)    return (      <>        <div>count: {count}</div>        <button onClick={() => dispatch()}>dispatch</button>      </>    )  }
  const { findByText, getByText } = render(    <StrictMode>      <Provider>        <Parent />      </Provider>    </StrictMode>  )
  await findByText('count: 0')
  fireEvent.click(getByText('dispatch'))  await findByText('count: 2')
  fireEvent.click(getByText('dispatch'))  await findByText('count: 4')})
it('useReducerAtom with optional action argument', async () => {  const countAtom = atom(0)  const reducer = (state: number, action?: 'INCREASE' | 'DECREASE') => {    switch (action) {      case 'INCREASE':        return state + 1      case 'DECREASE':        return state - 1      case undefined:        return state    }  }
  const Parent = () => {    const [count, dispatch] = useReducerAtom(countAtom, reducer)    return (      <>        <div>count: {count}</div>        <button onClick={() => dispatch('INCREASE')}>dispatch INCREASE</button>        <button onClick={() => dispatch('DECREASE')}>dispatch DECREASE</button>        <button onClick={() => dispatch()}>dispatch empty</button>      </>    )  }
  const { findByText, getByText } = render(    <StrictMode>      <Provider>        <Parent />      </Provider>    </StrictMode>  )
  await findByText('count: 0')
  fireEvent.click(getByText('dispatch INCREASE'))  await findByText('count: 1')
  fireEvent.click(getByText('dispatch empty'))  await findByText('count: 1')
  fireEvent.click(getByText('dispatch DECREASE'))  await findByText('count: 0')})
it('useReducerAtom with non-optional action argument', async () => {  const countAtom = atom(0)  const reducer = (state: number, action: 'INCREASE' | 'DECREASE') => {    switch (action) {      case 'INCREASE':        return state + 1      case 'DECREASE':        return state - 1    }  }
  const Parent = () => {    const [count, dispatch] = useReducerAtom(countAtom, reducer)    return (      <>        <div>count: {count}</div>        <button onClick={() => dispatch('INCREASE')}>dispatch INCREASE</button>        <button onClick={() => dispatch('DECREASE')}>dispatch DECREASE</button>      </>    )  }
  const { findByText, getByText } = render(    <StrictMode>      <Provider>        <Parent />      </Provider>    </StrictMode>  )
  await findByText('count: 0')
  fireEvent.click(getByText('dispatch INCREASE'))  await findByText('count: 1')
  fireEvent.click(getByText('dispatch DECREASE'))  await findByText('count: 0')})