@navinc/base-react-components/src/sba-resources.spec.js

Nav's Pattern Library

import React from 'react'
import { Toggle } from './sba-resources.js'
import { render, fireEvent, screen } from '../tests/with-app-context.js'
import { Button } from './button.js'

describe('Toggle', () => {
  it('changes isOpen on click', () => {
    const { getByText } = render(
      <Toggle>
        {({ isOpen, toggle }) => (
          <>
            <Button onClick={toggle}>Content</Button>
            {isOpen ? 'OPEN' : 'CLOSED'}
          </>
        )}
      </Toggle>
    )

    expect(screen.queryByText('OPEN')).not.toBeInTheDocument()
    fireEvent.click(getByText(/content/i))
    expect(screen.queryByText('OPEN')).toBeInTheDocument()
  })
})