Skip to content

Commit fc09a99

Browse files
pbombKent C. Dodds
authored and
Kent C. Dodds
committed
fix(TS): Add missing getAll and queryAll functions to TS definitions (#88)
1 parent de769ec commit fc09a99

File tree

4 files changed

+50
-32
lines changed

4 files changed

+50
-32
lines changed

README.md

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,7 @@ facilitate testing implementation details). Read more about this in
9191
* [`prettyDOM`](#prettydom)
9292
* [`TextMatch`](#textmatch)
9393
* [`query` APIs](#query-apis)
94+
* [`queryAll` and `getAll` APIs](#queryall-and-getall-apis)
9495
* [Examples](#examples)
9596
* [FAQ](#faq)
9697
* [Other Solutions](#other-solutions)
@@ -563,6 +564,16 @@ const submitButton = queryByText('submit')
563564
expect(submitButton).toBeNull() // it doesn't exist
564565
```
565566
567+
## `queryAll` and `getAll` APIs
568+
569+
Each of the `query` APIs have a corresponsing `queryAll` version that always returns an Array of matching nodes. `getAll` is the same but throws when the array has a length of 0.
570+
571+
```javascript
572+
const submitButtons = queryAllByText('submit')
573+
expect(submitButtons).toHaveLength(3) // expect 3 elements
574+
expect(submitButtons[0]).toBeInTheDOM()
575+
```
576+
566577
## Examples
567578
568579
You'll find examples of testing with different libraries in

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
"author": "Kent C. Dodds <[email protected]> (http://kentcdodds.com/)",
3737
"license": "MIT",
3838
"dependencies": {
39-
"dom-testing-library": "^2.0.0",
39+
"dom-testing-library": "^2.3.1",
4040
"wait-for-expect": "^0.5.0"
4141
},
4242
"devDependencies": {

src/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import ReactDOM from 'react-dom'
22
import {Simulate} from 'react-dom/test-utils'
3-
import {bindElementToQueries, prettyDOM} from 'dom-testing-library'
3+
import {getQueriesForElement, prettyDOM} from 'dom-testing-library'
44

55
function render(ui, {container = document.createElement('div')} = {}) {
66
ReactDOM.render(ui, container)
@@ -14,7 +14,7 @@ function render(ui, {container = document.createElement('div')} = {}) {
1414
// Intentionally do not return anything to avoid unnecessarily complicating the API.
1515
// folks can use all the same utilities we return in the first place that are bound to the container
1616
},
17-
...bindElementToQueries(container),
17+
...getQueriesForElement(container),
1818
}
1919
}
2020

typings/index.d.ts

Lines changed: 36 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,14 @@
11
import {Simulate as ReactSimulate} from 'react-dom/test-utils'
2+
import {
3+
AllByAttribute,
4+
AllByText,
5+
BoundFunction,
6+
GetByAttribute,
7+
GetByText,
8+
getQueriesForElement,
9+
QueryByAttribute,
10+
QueryByText,
11+
} from 'dom-testing-library'
212

313
type TextMatchFunction = (content: string, element: HTMLElement) => boolean
414
type TextMatch = string | RegExp | TextMatchFunction
@@ -8,38 +18,33 @@ type TextMatchOptions = {
818
collapseWhitespace?: boolean
919
}
1020

11-
interface RenderResult {
21+
interface GetsAndQueries {
22+
queryByTestId: BoundFunction<QueryByAttribute>
23+
queryAllByTestId: BoundFunction<AllByAttribute>
24+
getByTestId: BoundFunction<GetByAttribute>
25+
getAllByTestId: BoundFunction<AllByAttribute>
26+
queryByText: BoundFunction<QueryByText>
27+
queryAllByText: BoundFunction<AllByText>
28+
getByText: BoundFunction<GetByText>
29+
getAllByText: BoundFunction<AllByText>
30+
queryByPlaceholderText: BoundFunction<QueryByAttribute>
31+
queryAllByPlaceholderText: BoundFunction<AllByAttribute>
32+
getByPlaceholderText: BoundFunction<GetByAttribute>
33+
getAllByPlaceholderText: BoundFunction<AllByAttribute>
34+
queryByLabelText: BoundFunction<QueryByAttribute>
35+
queryAllByLabelText: BoundFunction<AllByAttribute>
36+
getByLabelText: BoundFunction<GetByAttribute>
37+
getAllByLabelText: BoundFunction<AllByAttribute>
38+
queryByAltText: BoundFunction<QueryByAttribute>
39+
queryAllByAltText: BoundFunction<AllByAttribute>
40+
getByAltText: BoundFunction<GetByAttribute>
41+
getAllByAltText: BoundFunction<AllByAttribute>
42+
}
43+
44+
interface RenderResult extends GetsAndQueries {
1245
container: HTMLDivElement
1346
rerender: (ui: React.ReactElement<any>) => void
1447
unmount: VoidFunction
15-
queryByTestId: (
16-
id: TextMatch,
17-
options?: TextMatchOptions,
18-
) => HTMLElement | null
19-
getByTestId: (id: TextMatch, options?: TextMatchOptions) => HTMLElement
20-
queryByText: (id: TextMatch, options?: TextMatchOptions) => HTMLElement | null
21-
getByText: (text: TextMatch, options?: TextMatchOptions) => HTMLElement
22-
queryByPlaceholderText: (
23-
id: TextMatch,
24-
options?: TextMatchOptions,
25-
) => HTMLElement | null
26-
getByPlaceholderText: (
27-
text: TextMatch,
28-
options?: TextMatchOptions,
29-
) => HTMLElement
30-
queryByLabelText: (
31-
text: TextMatch,
32-
options?: TextMatchOptions,
33-
) => HTMLElement | null
34-
getByLabelText: (
35-
id: TextMatch,
36-
options?: {selector?: string} & TextMatchOptions,
37-
) => HTMLElement
38-
queryByAltText: (
39-
text: TextMatch,
40-
options?: TextMatchOptions,
41-
) => HTMLElement | null
42-
getByAltText: (text: TextMatch, options?: TextMatchOptions) => HTMLElement
4348
}
4449

4550
export function render(
@@ -147,3 +152,5 @@ export const fireEvent: FireFunction & FireObject
147152
export function renderIntoDocument(ui: React.ReactElement<any>): RenderResult
148153

149154
export function cleanup(): void
155+
156+
export function getQueriesForElement(element: HTMLElement): GetsAndQueries

0 commit comments

Comments
 (0)