Skip to content

Commit 27c1056

Browse files
authored
Add jest extensions on main module (#175)
BREAKING CHANGE
1 parent 8e14dc1 commit 27c1056

File tree

4 files changed

+64
-52
lines changed

4 files changed

+64
-52
lines changed

README.md

Lines changed: 23 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -86,21 +86,22 @@ should be installed as one of your project's `devDependencies`:
8686
npm install --save-dev @testing-library/jest-dom
8787
```
8888

89-
> Note: We also recommend installing the jest-dom eslint plugin which provides auto-fixable lint rules
90-
> that prevent false positive tests and improve test readability by ensuring you are using the right
91-
> matchers in your tests. More details can be found at
89+
> Note: We also recommend installing the jest-dom eslint plugin which provides
90+
> auto-fixable lint rules that prevent false positive tests and improve test
91+
> readability by ensuring you are using the right matchers in your tests. More
92+
> details can be found at
9293
> [eslint-plugin-jest-dom](https://github.com/testing-library/eslint-plugin-jest-dom).
9394
9495
## Usage
9596

96-
Import `@testing-library/jest-dom/extend-expect` once (for instance in your
97-
[tests setup file][]) and you're good to go:
97+
Import `@testing-library/jest-dom` once (for instance in your [tests setup
98+
file][]) and you're good to go:
9899

99100
[tests setup file]:
100101
https://jestjs.io/docs/en/configuration.html#setupfilesafterenv-array
101102

102103
```javascript
103-
import '@testing-library/jest-dom/extend-expect'
104+
import '@testing-library/jest-dom'
104105
```
105106

106107
> Note: If you're using TypeScript, make sure your setup file is a `.ts` and not
@@ -110,7 +111,10 @@ Alternatively, you can selectively import only the matchers you intend to use,
110111
and extend jest's `expect` yourself:
111112

112113
```javascript
113-
import {toBeInTheDocument, toHaveClass} from '@testing-library/jest-dom'
114+
import {
115+
toBeInTheDocument,
116+
toHaveClass,
117+
} from '@testing-library/jest-dom/matchers'
114118

115119
expect.extend({toBeInTheDocument, toHaveClass})
116120
```
@@ -298,10 +302,16 @@ is `false`.
298302
##### Using document.querySelector
299303
300304
```javascript
301-
expect(document.querySelector('[data-testid="no-aria-invalid"]')).not.toBeInvalid()
305+
expect(
306+
document.querySelector('[data-testid="no-aria-invalid"]'),
307+
).not.toBeInvalid()
302308
expect(document.querySelector('[data-testid="aria-invalid"]')).toBeInvalid()
303-
expect(document.querySelector('[data-testid="aria-invalid-value"]')).toBeInvalid()
304-
expect(document.querySelector('[data-testid="aria-invalid-false"]')).not.toBeInvalid()
309+
expect(
310+
document.querySelector('[data-testid="aria-invalid-value"]'),
311+
).toBeInvalid()
312+
expect(
313+
document.querySelector('[data-testid="aria-invalid-false"]'),
314+
).not.toBeInvalid()
305315

306316
expect(document.querySelector('[data-testid="valid-form"]')).not.toBeInvalid()
307317
expect(document.querySelector('[data-testid="invalid-form"]')).toBeInvalid()
@@ -427,7 +437,9 @@ must also be `true`.
427437
```javascript
428438
expect(document.querySelector('[data-testid="no-aria-invalid"]')).toBeValid()
429439
expect(document.querySelector('[data-testid="aria-invalid"]')).not.toBeValid()
430-
expect(document.querySelector('[data-testid="aria-invalid-value"]')).not.toBeValid()
440+
expect(
441+
document.querySelector('[data-testid="aria-invalid-value"]'),
442+
).not.toBeValid()
431443
expect(document.querySelector('[data-testid="aria-invalid-false"]')).toBeValid()
432444

433445
expect(document.querySelector('[data-testid="valid-form"]')).toBeValid()
@@ -1103,7 +1115,6 @@ expect(document.querySelector('.cancel-button')).toBeTruthy()
11031115
> replacing `toBeInTheDOM` to read through the documentation of the proposed
11041116
> alternatives to see which use case works better for your needs.
11051117
1106-
11071118
## Inspiration
11081119
11091120
This whole library was extracted out of Kent C. Dodds' [DOM Testing

src/extend-expect.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
import * as extensions from './index'
1+
import * as extensions from './matchers'
22

33
expect.extend(extensions)

src/index.js

Lines changed: 1 addition & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1 @@
1-
import {toBeInTheDOM} from './to-be-in-the-dom'
2-
import {toBeInTheDocument} from './to-be-in-the-document'
3-
import {toBeEmpty} from './to-be-empty'
4-
import {toContainElement} from './to-contain-element'
5-
import {toContainHTML} from './to-contain-html'
6-
import {toHaveTextContent} from './to-have-text-content'
7-
import {toHaveAttribute} from './to-have-attribute'
8-
import {toHaveClass} from './to-have-class'
9-
import {toHaveStyle} from './to-have-style'
10-
import {toHaveFocus} from './to-have-focus'
11-
import {toHaveFormValues} from './to-have-form-values'
12-
import {toBeVisible} from './to-be-visible'
13-
import {toBeDisabled, toBeEnabled} from './to-be-disabled'
14-
import {toBeRequired} from './to-be-required'
15-
import {toBeInvalid, toBeValid} from './to-be-invalid'
16-
import {toHaveValue} from './to-have-value'
17-
import {toBeChecked} from './to-be-checked'
18-
19-
export {
20-
toBeInTheDOM,
21-
toBeInTheDocument,
22-
toBeEmpty,
23-
toContainElement,
24-
toContainHTML,
25-
toHaveTextContent,
26-
toHaveAttribute,
27-
toHaveClass,
28-
toHaveStyle,
29-
toHaveFocus,
30-
toHaveFormValues,
31-
toBeVisible,
32-
toBeDisabled,
33-
toBeEnabled,
34-
toBeRequired,
35-
toBeInvalid,
36-
toBeValid,
37-
toHaveValue,
38-
toBeChecked,
39-
}
1+
import './extend-expect'

src/matchers.js

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import {toBeInTheDOM} from './to-be-in-the-dom'
2+
import {toBeInTheDocument} from './to-be-in-the-document'
3+
import {toBeEmpty} from './to-be-empty'
4+
import {toContainElement} from './to-contain-element'
5+
import {toContainHTML} from './to-contain-html'
6+
import {toHaveTextContent} from './to-have-text-content'
7+
import {toHaveAttribute} from './to-have-attribute'
8+
import {toHaveClass} from './to-have-class'
9+
import {toHaveStyle} from './to-have-style'
10+
import {toHaveFocus} from './to-have-focus'
11+
import {toHaveFormValues} from './to-have-form-values'
12+
import {toBeVisible} from './to-be-visible'
13+
import {toBeDisabled, toBeEnabled} from './to-be-disabled'
14+
import {toBeRequired} from './to-be-required'
15+
import {toBeInvalid, toBeValid} from './to-be-invalid'
16+
import {toHaveValue} from './to-have-value'
17+
import {toBeChecked} from './to-be-checked'
18+
19+
export {
20+
toBeInTheDOM,
21+
toBeInTheDocument,
22+
toBeEmpty,
23+
toContainElement,
24+
toContainHTML,
25+
toHaveTextContent,
26+
toHaveAttribute,
27+
toHaveClass,
28+
toHaveStyle,
29+
toHaveFocus,
30+
toHaveFormValues,
31+
toBeVisible,
32+
toBeDisabled,
33+
toBeEnabled,
34+
toBeRequired,
35+
toBeInvalid,
36+
toBeValid,
37+
toHaveValue,
38+
toBeChecked,
39+
}

0 commit comments

Comments
 (0)