You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: website/docs/13.x/docs/api/jest-matchers.mdx
+27-27Lines changed: 27 additions & 27 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,11 +4,11 @@ This guide describes built-in Jest matchers. These matchers provide readable ass
4
4
5
5
## Setup
6
6
7
-
There is no need to set up the built-in matchers; they are automatically available in your tests when you import anything from `@testing-library/react-native`, e.g., `render`.
7
+
No setup needed. Matchers are available when you import from `@testing-library/react-native`.
8
8
9
-
## Migration from legacy Jest Native matchers.
9
+
## Migration from legacy Jest Native matchers
10
10
11
-
If you are already using legacy Jest Native matchers we have a [migration guide](/docs/migration/jest-matchers) for moving to the built-in matchers.
11
+
If you use legacy Jest Native matchers, see the [migration guide](/docs/migration/jest-matchers).
12
12
13
13
## Checking element existence
14
14
@@ -18,7 +18,7 @@ If you are already using legacy Jest Native matchers we have a [migration guide]
18
18
expect(element).toBeOnTheScreen();
19
19
```
20
20
21
-
Checks if an element is attached to the element tree. If you hold a reference to an element and it gets unmounted during the test, it will no longer pass this assertion.
21
+
Checks if an element is attached to the element tree. If a referenced element gets unmounted during the test, this assertion fails.
Checks if the element has the specified text content. Accepts `string` or `RegExp` matchers, as well as [text match options](/docs/api/queries#text-match-options) of`exact` and `normalizer`.
37
+
Checks if the element has the specified text content. Accepts `string` or `RegExp`, with optional [text match options](/docs/api/queries#text-match-options)`exact` and `normalizer`.
Checks if the`TextInput`element has the specified display value. Accepts `string` or `RegExp` matchers, as well as [text match options](/docs/api/queries#text-match-options) of`exact` and `normalizer`.
71
+
Checks if a`TextInput` has the specified display value. Accepts `string` or `RegExp`, with optional [text match options](/docs/api/queries#text-match-options)`exact` and `normalizer`.
Checks if the element has a specified accessible value.
87
87
88
-
This matcher will assert accessibility value based on `aria-valuemin`, `aria-valuemax`, `aria-valuenow`, `aria-valuetext` and `accessibilityValue` props. Only defined value entries will be used in the assertion, the element might have additional accessibility value entries and still be matched.
88
+
Reads from `aria-valuemin`, `aria-valuemax`, `aria-valuenow`, `aria-valuetext`, and `accessibilityValue` props. Only the values you specify are checked, so the element can have other accessibility value entries and still match.
89
89
90
-
When querying by `text` entry a string or `RegExp` might be used.
90
+
For the `text` entry, you can use `string` or `RegExp`.
Checks if the element is enabled or disabled from the user's perspective. These rely on the accessibility disabled state set by `aria-disabled` or `accessibilityState.disabled` props. An element is considered disabled when it or any of its ancestors is disabled.
99
+
Checks if the element is enabled or disabled based on `aria-disabled` or `accessibilityState.disabled` props. An element is disabled when it or any ancestor is disabled.
100
100
101
101
:::note
102
-
These matchers are the negation of each other, and both are provided to avoid double negations in your assertions.
102
+
These matchers are opposites. Both are provided to avoid double negations in assertions.
103
103
:::
104
104
105
105
### `toBeSelected()`
@@ -108,7 +108,7 @@ These matchers are the negation of each other, and both are provided to avoid do
108
108
expect(element).toBeSelected();
109
109
```
110
110
111
-
Checks if the element is selected from the user's perspective. Relies on the accessibility selected state set by`aria-selected` or `accessibilityState.selected` props.
111
+
Checks if the element is selected based on`aria-selected` or `accessibilityState.selected` props.
Checks if the element is checked or partially checked from the user's perspective. These rely on the accessibility checked state set by`aria-checked` or `accessibilityState.checked` props.
120
+
Checks if the element is checked or partially checked based on`aria-checked` or `accessibilityState.checked` props.
121
121
122
122
:::note
123
123
124
-
-`toBeChecked()`matcher works only on `Switch`host elements and accessibility elements with `checkbox`, `radio` or `switch` role.
125
-
-`toBePartiallyChecked()`matcher works only on elements with `checkbox` role.
124
+
-`toBeChecked()` works only on `Switch` elements and elements with `checkbox`, `radio`, or `switch` role.
125
+
-`toBePartiallyChecked()` works only on elements with `checkbox` role.
Checks if the element is expanded or collapsed from the user's perspective. These rely on the accessibility expanded state set by`aria-expanded` or `accessibilityState.expanded` props.
136
+
Checks if the element is expanded or collapsed based on`aria-expanded` or `accessibilityState.expanded` props.
137
137
138
138
:::note
139
-
These matchers are the negation of each other for expandable elements (elements with explicit `aria-expanded` or `accessibilityState.expanded` props). However, both won't pass for non-expandable elements (ones without explicit `aria-expanded` or `accessibilityState.expanded` props).
139
+
These matchers are opposites for expandable elements (those with explicit `aria-expanded` or `accessibilityState.expanded` props). For non-expandable elements, neither matcher passes.
140
140
:::
141
141
142
142
### `toBeBusy()`
@@ -145,7 +145,7 @@ These matchers are the negation of each other for expandable elements (elements
145
145
expect(element).toBeBusy();
146
146
```
147
147
148
-
Checks if the element is busy from the user's perspective. Relies on the accessibility busy state set by`aria-busy` or `accessibilityState.busy` props.
148
+
Checks if the element is busy based on`aria-busy` or `accessibilityState.busy` props.
149
149
150
150
## Checking element style
151
151
@@ -155,9 +155,9 @@ Checks if the element is busy from the user's perspective. Relies on the accessi
155
155
expect(element).toBeVisible();
156
156
```
157
157
158
-
Checks if the element is visible from the user's perspective.
158
+
Checks if the element is visible.
159
159
160
-
The element is considered invisible when itself or any of its ancestors has `display: none` or `opacity: 0` styles, as well as when it's hidden from accessibility.
160
+
An element is invisible when it or any ancestor has `display: none` or `opacity: 0` styles, or when it's hidden from accessibility.
Checks if the element has the specified accessible name. Accepts `string` or `RegExp` matchers, as well as [text match options](/docs/api/queries#text-match-options) of`exact` and `normalizer`.
186
+
Checks if the element has the specified accessible name. Accepts `string` or `RegExp`, with optional [text match options](/docs/api/queries#text-match-options)`exact` and `normalizer`.
187
187
188
-
The accessible name will be computed based on `aria-labelledby`, `accessibilityLabelledBy`, `aria-label`, and `accessibilityLabel` props, in the absence of these props, the element text content will be used.
188
+
The accessible name comes from `aria-labelledby`, `accessibilityLabelledBy`, `aria-label`, and `accessibilityLabel` props. If none are present, the element's text content is used.
189
189
190
-
When the`name` parameter is `undefined` it will only check if the element has any accessible name.
190
+
Without a`name` parameter (or with `undefined`), it only checks if the element has any accessible name.
191
191
192
192
### `toHaveProp()`
193
193
@@ -198,8 +198,8 @@ expect(element).toHaveProp(
198
198
)
199
199
```
200
200
201
-
Checks if the element has the specified prop. When `value`is `undefined`, it only checks for existence of the prop. When `value` is defined, it checks if the actual value matches.
201
+
Checks if the element has a prop. Without a `value`(or with `undefined`), it only checks if the prop exists. With a `value`, it checks if the prop's value matches.
202
202
203
203
:::note
204
-
This matcher should be treated as an escape hatch to be used when all other matchers are not suitable.
204
+
Use this matcher as a last resort when other matchers don't fit your needs.
Copy file name to clipboardExpand all lines: website/docs/14.x/docs/api/jest-matchers.mdx
+17-17Lines changed: 17 additions & 17 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,7 +4,7 @@ This guide covers the built-in Jest matchers. These matchers make your tests eas
4
4
5
5
## Setup
6
6
7
-
There is no need to set up the built-in matchers; they are automatically available in your tests when you import anything from `@testing-library/react-native`, e.g., `render`.
7
+
No setup needed. Matchers are available when you import from `@testing-library/react-native`.
Checks if an element has the specified text content. You can pass a `string` or `RegExp`, plus[text match options](/docs/api/queries#text-match-options) like `exact` and `normalizer`.
33
+
Checks if an element has the specified text content. Accepts `string` or `RegExp`, with optional[text match options](/docs/api/queries#text-match-options) like `exact` and `normalizer`.
Checks if the`TextInput`element has the specified display value. You can pass a `string` or `RegExp`, plus[text match options](/docs/api/queries#text-match-options) like `exact` and `normalizer`.
67
+
Checks if a`TextInput` has the specified display value. Accepts `string` or `RegExp`, with optional[text match options](/docs/api/queries#text-match-options) like `exact` and `normalizer`.
Checks if an element has the specified accessible value.
83
83
84
-
The matcher checks accessibility values from `aria-valuemin`, `aria-valuemax`, `aria-valuenow`, `aria-valuetext`, and `accessibilityValue` props. It only checks the values you specify—the element can have other accessibility value entries and still match.
84
+
The matcher reads accessibility values from `aria-valuemin`, `aria-valuemax`, `aria-valuenow`, `aria-valuetext`, and `accessibilityValue` props. It only checks the values you specify, so the element can have other accessibility value entries and still match.
85
85
86
86
For the `text` entry, you can use a string or `RegExp`.
87
87
@@ -92,7 +92,7 @@ expect(element).toBeEnabled();
92
92
expect(element).toBeDisabled();
93
93
```
94
94
95
-
Checks if an element is enabled or disabled. Uses the accessibility disabled state from `aria-disabled` or `accessibilityState.disabled` props. An element is considered disabled if it or any of its ancestors is disabled.
95
+
Checks if an element is enabled or disabledfrom `aria-disabled` or `accessibilityState.disabled` props. An element is disabled if it or any ancestor is disabled.
96
96
97
97
:::note
98
98
These matchers are opposites. Both are available so you can avoid double negations like `expect(element).not.toBeDisabled()`.
@@ -104,7 +104,7 @@ These matchers are opposites. Both are available so you can avoid double negatio
104
104
expect(element).toBeSelected();
105
105
```
106
106
107
-
Checks if an element is selected. Uses the accessibility selected state from `aria-selected` or `accessibilityState.selected` props.
107
+
Checks if an element is selected from `aria-selected` or `accessibilityState.selected` props.
Checks if an element is expanded or collapsed. Uses the accessibility expanded state from `aria-expanded` or `accessibilityState.expanded` props.
132
+
Checks if an element is expanded or collapsed from `aria-expanded` or `accessibilityState.expanded` props.
133
133
134
134
:::note
135
135
These matchers are opposites for expandable elements (those with explicit `aria-expanded` or `accessibilityState.expanded` props). For non-expandable elements, neither matcher will pass.
@@ -141,7 +141,7 @@ These matchers are opposites for expandable elements (those with explicit `aria-
141
141
expect(element).toBeBusy();
142
142
```
143
143
144
-
Checks if an element is busy. Uses the accessibility busy state from `aria-busy` or `accessibilityState.busy` props.
144
+
Checks if an element is busy from `aria-busy` or `accessibilityState.busy` props.
Checks if an element has the specified accessible name. You can pass a `string` or `RegExp`, plus[text match options](/docs/api/queries#text-match-options) like `exact` and `normalizer`.
182
+
Checks if an element has the specified accessible name. Accepts `string` or `RegExp`, with optional[text match options](/docs/api/queries#text-match-options) like `exact` and `normalizer`.
183
183
184
-
The accessible name comes from `aria-labelledby`, `accessibilityLabelledBy`, `aria-label`, and `accessibilityLabel` props. For `Image` elements, the `alt` prop is also used. If none of these are present, the element's text content is used.
184
+
The accessible name comes from `aria-labelledby`, `accessibilityLabelledBy`, `aria-label`, and `accessibilityLabel` props. For `Image` elements, the `alt` prop is also used. If none are present, the element's text content is used.
185
185
186
-
If you don't pass a `name` parameter (or pass`undefined`), it only checks whether the element has any accessible name.
186
+
Without a `name` parameter (or with`undefined`), it only checks whether the element has any accessible name.
187
187
188
188
### `toHaveProp()`
189
189
@@ -194,7 +194,7 @@ expect(element).toHaveProp(
194
194
)
195
195
```
196
196
197
-
Checks if an element has a prop. If you don't pass a `value` (or pass`undefined`), it only checks if the prop exists. If you pass a `value`, it checks if the prop's value matches.
197
+
Checks if an element has a prop. Without a `value` (or with`undefined`), it only checks if the prop exists. With a `value`, it checks if the prop's value matches.
198
198
199
199
:::note
200
200
Use this matcher as a last resort when other matchers don't fit your needs.
0 commit comments