diff --git a/components/affix/__tests__/Affix.test.tsx b/components/affix/__tests__/Affix.test.tsx index 1bf228375705..e67833cbbb8d 100644 --- a/components/affix/__tests__/Affix.test.tsx +++ b/components/affix/__tests__/Affix.test.tsx @@ -4,6 +4,7 @@ import Affix, { AffixProps, AffixState } from '..'; import { getObserverEntities } from '../utils'; import Button from '../../button'; import rtlTest from '../../../tests/shared/rtlTest'; +import accessibilityTest from '../../../tests/shared/accessibilityTest'; import { sleep } from '../../../tests/utils'; const events: Partial) => void>> = {}; @@ -53,6 +54,7 @@ class AffixMounter extends React.Component<{ describe('Affix Render', () => { rtlTest(Affix); + accessibilityTest(Affix); const domMock = jest.spyOn(HTMLElement.prototype, 'getBoundingClientRect'); let affixMounterWrapper: ReactWrapper; diff --git a/components/alert/__tests__/index.test.tsx b/components/alert/__tests__/index.test.tsx index 038985c21a3f..e27eeb2c5c35 100644 --- a/components/alert/__tests__/index.test.tsx +++ b/components/alert/__tests__/index.test.tsx @@ -5,12 +5,14 @@ import Button from '../../button'; import Tooltip from '../../tooltip'; import Popconfirm from '../../popconfirm'; import rtlTest from '../../../tests/shared/rtlTest'; +import accessibilityTest from '../../../tests/shared/accessibilityTest'; import { sleep } from '../../../tests/utils'; const { ErrorBoundary } = Alert; describe('Alert', () => { rtlTest(Alert); + accessibilityTest(Alert); beforeAll(() => { jest.useFakeTimers(); diff --git a/package.json b/package.json index 5e8d20e58c0f..9f056320de29 100644 --- a/package.json +++ b/package.json @@ -166,6 +166,7 @@ "@types/enzyme": "^3.10.5", "@types/gtag.js": "^0.0.8", "@types/jest": "^27.0.0", + "@types/jest-axe": "^3.5.3", "@types/jest-environment-puppeteer": "^4.4.0", "@types/jest-image-snapshot": "^4.1.0", "@types/lodash": "^4.14.139", @@ -225,6 +226,7 @@ "intersection-observer": "^0.12.0", "isomorphic-fetch": "^3.0.0", "jest": "^27.0.3", + "jest-axe": "^5.0.1", "jest-image-snapshot": "^4.5.1", "jest-puppeteer": "^6.0.0", "jquery": "^3.4.1", diff --git a/tests/setupAfterEnv.ts b/tests/setupAfterEnv.ts index f88f29fed296..797743d9c3b2 100644 --- a/tests/setupAfterEnv.ts +++ b/tests/setupAfterEnv.ts @@ -1,5 +1,7 @@ +import { toHaveNoViolations } from 'jest-axe'; import toMatchRenderedSnapshot from './matchers/rendered-snapshot'; +expect.extend(toHaveNoViolations); expect.extend({ toMatchRenderedSnapshot, }); diff --git a/tests/shared/accessibilityTest.tsx b/tests/shared/accessibilityTest.tsx new file mode 100644 index 000000000000..87b49ff15c44 --- /dev/null +++ b/tests/shared/accessibilityTest.tsx @@ -0,0 +1,15 @@ +import React from 'react'; +import { mount } from 'enzyme'; +import { axe } from 'jest-axe'; + +// eslint-disable-next-line jest/no-export +export default function accessibilityTest(Component: React.ComponentType) { + describe(`accessibility`, () => { + it(`component does not have any violations`, async () => { + jest.useRealTimers(); + const wrapper = mount(); + const results = await axe(wrapper.getDOMNode()); + expect(results).toHaveNoViolations(); + }); + }); +} diff --git a/typings/jest.d.ts b/typings/jest.d.ts index e2022de6bfea..3cf01d83df03 100644 --- a/typings/jest.d.ts +++ b/typings/jest.d.ts @@ -1,5 +1,6 @@ declare namespace jest { interface Matchers { toMatchRenderedSnapshot(): R; + toHaveNoViolations(): R; } }