React Code Snippets

test-state-setters.tsx

// Testing State Setters
// const [payload, setPayload] = useState({})
it('can update the number of times to loop', () => {
  const mockSetPayload = vi.fn()
  const mockPayload = {
    timeOfLoop: 0,
    amount: 0,
    units: 'hours',
    exitCondition: {
      groups: [],
    },
  }
  render(<LoopPanel setPayload={mockSetPayload} />)
  fireEvent.change(screen.getByTestId('timeOfLoop'), { target: { value: 10 } })
  expect(mockSetPayload).toBeCalledWith(expect.any(Function))
  // setPayload is called 2 times before we interact with it, so pull the 3rd iteration
  const updateFunction = mockSetPayload.mock.calls[2][0]
  // We need to simulate the previous state of the payload
  const updated = updateFunction(mockPayload)
  expect(updated).toEqual({
    ...mockPayload,
    timeOfLoop: 10,
  })
})