Skip to content

Commit

Permalink
test(ui-grid): migrate old Grid tests
Browse files Browse the repository at this point in the history
  • Loading branch information
ToMESSKa committed Sep 3, 2024
1 parent 2cf4255 commit f46a74e
Show file tree
Hide file tree
Showing 4 changed files with 85 additions and 24 deletions.
57 changes: 56 additions & 1 deletion package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 4 additions & 1 deletion packages/ui-grid/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,10 @@
"@instructure/ui-babel-preset": "10.2.1",
"@instructure/ui-color-utils": "10.2.1",
"@instructure/ui-test-utils": "10.2.1",
"@instructure/ui-themes": "10.2.1"
"@instructure/ui-themes": "10.2.1",
"@testing-library/jest-dom": "^6.4.6",
"@testing-library/react": "^15.0.7",
"vitest": "^2.0.2"
},
"peerDependencies": {
"react": ">=16.8 <=18"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,14 +23,14 @@
*/

import React from 'react'

import { expect, mount, within } from '@instructure/ui-test-utils'
import { render, screen } from '@testing-library/react'
import '@testing-library/jest-dom'

import { Grid } from '../index'

describe('<Grid />', async () => {
describe('<Grid />', () => {
it('should render content in each column', async () => {
const subject = await mount(
const { container } = render(
<Grid>
<Grid.Row>
<Grid.Col>Foo</Grid.Col>
Expand All @@ -40,24 +40,25 @@ describe('<Grid />', async () => {
</Grid>
)

expect(subject.getDOMNode().textContent).to.equal('FooBarBaz')
expect(container).toHaveTextContent('FooBarBaz')
})

it('should pass aria and role attributes to underlying DOM elements', async () => {
const subject = await mount(
<Grid role="grid" aria-hidden="true">
<Grid.Row aria-live="polite" role="presentation">
<Grid.Col aria-disabled="true">Foo</Grid.Col>
render(
<Grid data-testid="grid" role="grid" aria-hidden="true">
<Grid.Row data-testid="grid-row" aria-live="polite" role="presentation">
<Grid.Col data-testid="grid-col" aria-disabled="true">
Foo
</Grid.Col>
</Grid.Row>
</Grid>
)

const grid = within(subject.getDOMNode())

expect(await grid.find('[role="grid"][aria-hidden]')).to.exist()
expect(
await grid.find('[role="presentation"][aria-live="polite"]')
).to.exist()
expect(await grid.find('[aria-disabled]')).to.exist()
expect(screen.getByTestId('grid')).toHaveAttribute('aria-hidden')
expect(screen.getByTestId('grid-row')).toHaveAttribute(
'aria-live',
'polite'
)
expect(screen.getByTestId('grid-col')).toHaveAttribute('aria-disabled')
})
})
Original file line number Diff line number Diff line change
Expand Up @@ -23,16 +23,18 @@
*/

import React from 'react'

import { expect, mount, stub } from '@instructure/ui-test-utils'
import { render } from '@testing-library/react'
import { vi } from 'vitest'
import '@testing-library/jest-dom'

import { GridCol } from '../index'

describe('<GridCol />', async () => {
describe('<GridCol />', () => {
it('should render content in each column', async () => {
const elementRef = stub()
const subject = await mount(<GridCol elementRef={elementRef}>Foo</GridCol>)
const elementRef = vi.fn()
const { container } = render(<GridCol elementRef={elementRef}>Foo</GridCol>)

expect(elementRef).to.have.been.calledWith(subject.getDOMNode())
expect(container).toHaveTextContent('Foo')
expect(elementRef).toHaveBeenCalledWith(container.firstChild)
})
})

0 comments on commit f46a74e

Please sign in to comment.