tracker/frontend/src/__tests__/DomainList.test.js at queue-json-encoding · LearningAzure2020/tracker · GitHub

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
import React from 'react'
import { render, waitFor } from '@testing-library/react'
import { theme, ThemeProvider } from '@chakra-ui/core'
import { I18nProvider } from '@lingui/react'
import { setupI18n } from '@lingui/core'
import { DomainList } from '../DomainList'

const i18n = setupI18n({
  locale: 'en',
  messages: {
    en: {},
  },
  localeData: {
    en: {},
  },
})

describe('<DomainList />', () => {
  it('executes a child function once for each passed domain', async () => {
    const domains = [
      {
        node: {
          organization: { acronym: 'GC' },
          url: 'canada.ca',
        },
      },
    ]
    const { getByTestId } = render(
      <ThemeProvider theme={theme}>
        <I18nProvider i18n={i18n}>
          <DomainList domains={domains}>
            {({ node }) => (
              <p data-testid="domain" key={node.url}>
                {node.url}
              </p>
            )}
          </DomainList>
        </I18nProvider>
      </ThemeProvider>,
    )

    await waitFor(() => {
      const domain = getByTestId('domain')
      expect(domain.innerHTML).toEqual('canada.ca')
    })
  })

  it(`gracefully handles a "no results" empty list`, async () => {
    const { getByText } = render(
      <ThemeProvider theme={theme}>
        <I18nProvider i18n={i18n}>
          <DomainList domains={[]} data-testid="list">
            {({ node }) => <p key={node.url}>{node.url}</p>}
          </DomainList>
        </I18nProvider>
      </ThemeProvider>,
    )

    await waitFor(() => {
      const nope = getByText(/No Domains/i)
      expect(nope).toBeInTheDocument()
    })
  })

  it('gracefully handles null', async () => {
    const { getByText } = render(
      <ThemeProvider theme={theme}>
        <I18nProvider i18n={i18n}>
          <DomainList domains={null} data-testid="list">
            {({ node }) => <p key={node.url}>{node.url}</p>}
          </DomainList>
        </I18nProvider>
      </ThemeProvider>,
    )

    await waitFor(() => {
      const nope = getByText(/No Domains/i)
      expect(nope).toBeInTheDocument()
    })
  })
})