Repository: h2oai/wave
File: ui/src/dropdown.test.tsx (TypeScript)

Code before:

      fireEvent.click(getByTestId(name))
      expect(wave.args[name]).toMatchObject(['1'])
      fireEvent.click(getByText('Deselect All'))
      fireEvent.click(getByText('Select'))
      expect(wave.args[name]).toMatchObject([])
      await waitFor(() => expect(pushMock).toHaveBeenCalledTimes(1))
    })

    it('Sets wave args to empty array when values is an empty array - init', () => {
      render(<XDropdown model={{ ...dialogProps, values: [] }} />)
      expect(wave.args[name]).toEqual([])
    })

    it('Returns multiple items on select', () => {
      const { getByText, getByTestId, getAllByRole } = render(<XDropdown model={{ ...dialogProps, values: [] }} />)

      fireEvent.click(getByTestId(name))
      fireEvent.click(getAllByRole('checkbox')[1])
      fireEvent.click(getAllByRole('checkbox')[2])
      fireEvent.click(getByText('Select'))

      expect(wave.args[name]).toMatchObject(['1', '2'])
    })

    it('Selects all options on Select all - except disabled', () => {
      const { getByText, getByTestId } = render(<XDropdown model={{ ...dialogProps, choices: choicesDisabled, values: ['1'] }} />)

      expect(wave.args[name]).toMatchObject(['1'])
      fireEvent.click(getByTestId(name))
      fireEvent.click(getByText('Select All'))
      fireEvent.click(getByText('Select'))

      expect(wave.args[name]).toMatchObject(['1', '3'])
    })

    it('Does not modify disabled choice on Select/Deselect all', () => {
      const { getByText, getByTestId } = render(<XDropdown model={{ ...dialogProps, choices: choicesDisabled, values: ['2', '3'] }} />)

      expect(wave.args[name]).toMatchObject(['2', '3'])

      fireEvent.click(getByTestId(name))
      fireEvent.click(getByText('Select All'))
      fireEvent.click(getByText('Select'))
      expect(wave.args[name]).toMatchObject(['1', '2', '3'])

      fireEvent.click(getByTestId(name))
      fireEvent.click(getByText('Deselect All'))
      fireEvent.click(getByText('Select'))
      expect(wave.args[name]).toMatchObject(['2'])
    })

Review comment (suggestion):
There are 2 test cases named `Selects all options on Select all - except disabled`. Let's either have only 1 if they test the same thing or rename them accordingly.

Code after:
    const overOneHundredChoices = createChoices(101)
    const choices = createChoices(10)

    beforeEach(() => {
      dialogProps = {
        ...defaultProps,
        popup: 'always',
        choices
      }
    })

    it('Renders data-test attr', () => {
      const { queryByTestId } = render(<XDropdown model={dialogProps} />)
      expect(queryByTestId(name)).toBeInTheDocument()
    })

    it('Calls sync on Deselect all - trigger enabled', async () => {
      const { getByText, getByTestId } = render(<XDropdown model={{ ...dialogProps, values: ['1'], trigger: true }} />)

      fireEvent.click(getByTestId(name))
      expect(wave.args[name]).toMatchObject(['1'])
      fireEvent.click(getByText('Deselect All'))
      fireEvent.click(getByText('Select'))
      expect(wave.args[name]).toMatchObject([])
      await waitFor(() => expect(pushMock).toHaveBeenCalledTimes(1))
    })

    it('Sets wave args to empty array when values is an empty array - init', () => {
      render(<XDropdown model={{ ...dialogProps, values: [] }} />)
      expect(wave.args[name]).toEqual([])
    })

    it('Returns multiple items on select', () => {
      const { getByText, getByTestId, getAllByRole } = render(<XDropdown model={{ ...dialogProps, values: [] }} />)

      fireEvent.click(getByTestId(name))
      fireEvent.click(getAllByRole('checkbox')[1])
      fireEvent.click(getAllByRole('checkbox')[2])
      fireEvent.click(getByText('Select'))

      expect(wave.args[name]).toMatchObject(['1', '2'])
    })

    it('Selects all options on Select all in a dialog dropdown - except disabled', () => {
      const { getByText, getByTestId } = render(<XDropdown model={{ ...dialogProps, choices: choicesDisabled, values: ['1'] }} />)

      expect(wave.args[name]).toMatchObject(['1'])
      fireEvent.click(getByTestId(name))
      fireEvent.click(getByText('Select All'))
      fireEvent.click(getByText('Select'))