diff --git a/src/flush-micro-tasks.ts b/src/flush-micro-tasks.ts index 08295740b..4e5fac764 100644 --- a/src/flush-micro-tasks.ts +++ b/src/flush-micro-tasks.ts @@ -3,28 +3,3 @@ import { setImmediate } from './helpers/timers'; export function flushMicroTasks() { return new Promise((resolve) => setImmediate(resolve)); } - -/** - * @deprecated To be removed in the next major release. - */ -type Thenable = { then: (callback: () => T) => unknown }; - -/** - * This legacy implementation of `flushMicroTasks` is used for compatibility with - * older versions of React Native (pre 0.71) which uses Promise polyfil. - * - * For users with older version of React Native there is a workaround of using our own - * Jest preset instead the `react-native` one, but requiring such change would be a - * breaking change for existing users. - * - * @deprecated To be removed in the next major release. - */ -export function flushMicroTasksLegacy(): Thenable { - return { - // using "thenable" instead of a Promise, because otherwise it breaks when - // using "modern" fake timers - then(resolve) { - setImmediate(resolve); - }, - }; -} diff --git a/src/helpers/wrap-async.ts b/src/helpers/wrap-async.ts index c22a1df5e..1f9797b48 100644 --- a/src/helpers/wrap-async.ts +++ b/src/helpers/wrap-async.ts @@ -1,7 +1,7 @@ /* istanbul ignore file */ import act, { getIsReactActEnvironment, setReactActEnvironment } from '../act'; -import { flushMicroTasksLegacy } from '../flush-micro-tasks'; +import { flushMicroTasks } from '../flush-micro-tasks'; import { checkReactVersionAtLeast } from '../react-versions'; /** @@ -18,7 +18,7 @@ export async function wrapAsync(callback: () => Promise): Promis try { const result = await callback(); // Flush the microtask queue before restoring the `act` environment - await flushMicroTasksLegacy(); + await flushMicroTasks(); return result; } finally { setReactActEnvironment(previousActEnvironment); diff --git a/src/index.ts b/src/index.ts index 5c867106f..b01198181 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,5 @@ import { cleanup } from './pure'; -import { flushMicroTasksLegacy } from './flush-micro-tasks'; +import { flushMicroTasks } from './flush-micro-tasks'; import { getIsReactActEnvironment, setReactActEnvironment } from './act'; if (!process?.env?.RNTL_SKIP_AUTO_CLEANUP) { @@ -11,7 +11,7 @@ if (!process?.env?.RNTL_SKIP_AUTO_CLEANUP) { if (typeof afterEach === 'function') { // eslint-disable-next-line no-undef afterEach(async () => { - await flushMicroTasksLegacy(); + await flushMicroTasks(); cleanup(); }); } diff --git a/src/queries/__tests__/accessibility-state.test.tsx b/src/queries/__tests__/accessibility-state.test.tsx deleted file mode 100644 index f72ac7a01..000000000 --- a/src/queries/__tests__/accessibility-state.test.tsx +++ /dev/null @@ -1,535 +0,0 @@ -/* eslint-disable no-console */ -import * as React from 'react'; -import { View, Text, Pressable, TouchableOpacity } from 'react-native'; -import { render, screen } from '../..'; - -type ConsoleLogMock = jest.Mock; - -beforeEach(() => { - jest.spyOn(console, 'warn').mockImplementation(() => {}); -}); - -const TEXT_LABEL = 'cool text'; - -const Typography = ({ children, ...rest }: any) => { - return {children}; -}; - -const Button = ({ children }: { children: React.ReactNode }) => ( - - {children} - -); - -const Section = () => ( - <> - Title - - -); - -test('getByA11yState, queryByA11yState, findByA11yState', async () => { - render(
); - - expect(screen.getByA11yState({ selected: true }).props.accessibilityState).toEqual({ - selected: true, - expanded: false, - }); - expect(screen.queryByA11yState({ selected: true })?.props.accessibilityState).toEqual({ - selected: true, - expanded: false, - }); - - expect(() => screen.getByA11yState({ disabled: true })).toThrow( - 'Unable to find an element with disabled state: true', - ); - expect(screen.queryByA11yState({ disabled: true })).toEqual(null); - - expect(() => screen.getByA11yState({ expanded: false })).toThrow( - 'Found multiple elements with expanded state: false', - ); - expect(() => screen.queryByA11yState({ expanded: false })).toThrow( - 'Found multiple elements with expanded state: false', - ); - - const asyncButton = await screen.findByA11yState({ selected: true }); - expect(asyncButton.props.accessibilityState).toEqual({ - selected: true, - expanded: false, - }); - await expect(screen.findByA11yState({ disabled: true })).rejects.toThrow( - 'Unable to find an element with disabled state: true', - ); - await expect(screen.findByA11yState({ expanded: false })).rejects.toThrow( - 'Found multiple elements with expanded state: false', - ); -}); - -test('getAllByA11yState, queryAllByA11yState, findAllByA11yState', async () => { - render(
); - - expect(screen.getAllByA11yState({ selected: true })).toHaveLength(1); - expect(screen.queryAllByA11yState({ selected: true })).toHaveLength(1); - - expect(() => screen.getAllByA11yState({ disabled: true })).toThrow( - 'Unable to find an element with disabled state: true', - ); - expect(screen.queryAllByA11yState({ disabled: true })).toEqual([]); - - expect(screen.getAllByA11yState({ expanded: false })).toHaveLength(2); - expect(screen.queryAllByA11yState({ expanded: false })).toHaveLength(2); - - await expect(screen.findAllByA11yState({ selected: true })).resolves.toHaveLength(1); - await expect(screen.findAllByA11yState({ disabled: true })).rejects.toThrow( - 'Unable to find an element with disabled state: true', - ); - await expect(screen.findAllByA11yState({ expanded: false })).resolves.toHaveLength(2); -}); - -describe('checked state matching', () => { - it('handles true', () => { - render(); - - expect(screen.getByA11yState({ checked: true })).toBeTruthy(); - expect(screen.queryByA11yState({ checked: 'mixed' })).toBeFalsy(); - expect(screen.queryByA11yState({ checked: false })).toBeFalsy(); - }); - - it('handles mixed', () => { - render(); - - expect(screen.getByA11yState({ checked: 'mixed' })).toBeTruthy(); - expect(screen.queryByA11yState({ checked: true })).toBeFalsy(); - expect(screen.queryByA11yState({ checked: false })).toBeFalsy(); - }); - - it('handles false', () => { - render(); - - expect(screen.getByA11yState({ checked: false })).toBeTruthy(); - expect(screen.queryByA11yState({ checked: true })).toBeFalsy(); - expect(screen.queryByA11yState({ checked: 'mixed' })).toBeFalsy(); - }); - - it('handles default', () => { - render(); - - expect(screen.queryByA11yState({ checked: false })).toBeFalsy(); - expect(screen.queryByA11yState({ checked: true })).toBeFalsy(); - expect(screen.queryByA11yState({ checked: 'mixed' })).toBeFalsy(); - }); -}); - -describe('expanded state matching', () => { - it('handles true', () => { - render(); - - expect(screen.getByA11yState({ expanded: true })).toBeTruthy(); - expect(screen.queryByA11yState({ expanded: false })).toBeFalsy(); - }); - - it('handles false', () => { - render(); - - expect(screen.getByA11yState({ expanded: false })).toBeTruthy(); - expect(screen.queryByA11yState({ expanded: true })).toBeFalsy(); - }); - - it('handles default', () => { - render(); - - expect(screen.queryByA11yState({ expanded: false })).toBeFalsy(); - expect(screen.queryByA11yState({ expanded: true })).toBeFalsy(); - }); -}); - -describe('disabled state matching', () => { - it('handles true', () => { - render(); - - expect(screen.getByA11yState({ disabled: true })).toBeTruthy(); - expect(screen.queryByA11yState({ disabled: false })).toBeFalsy(); - }); - - it('handles false', () => { - render(); - - expect(screen.getByA11yState({ disabled: false })).toBeTruthy(); - expect(screen.queryByA11yState({ disabled: true })).toBeFalsy(); - }); - - it('handles default', () => { - render(); - - expect(screen.getByA11yState({ disabled: false })).toBeTruthy(); - expect(screen.queryByA11yState({ disabled: true })).toBeFalsy(); - }); -}); - -describe('busy state matching', () => { - it('handles true', () => { - render(); - - expect(screen.getByA11yState({ busy: true })).toBeTruthy(); - expect(screen.queryByA11yState({ busy: false })).toBeFalsy(); - }); - - it('handles false', () => { - render(); - - expect(screen.getByA11yState({ busy: false })).toBeTruthy(); - expect(screen.queryByA11yState({ busy: true })).toBeFalsy(); - }); - - it('handles default', () => { - render(); - - expect(screen.getByA11yState({ busy: false })).toBeTruthy(); - expect(screen.queryByA11yState({ busy: true })).toBeFalsy(); - }); -}); - -describe('selected state matching', () => { - it('handles true', () => { - render(); - - expect(screen.getByA11yState({ selected: true })).toBeTruthy(); - expect(screen.queryByA11yState({ selected: false })).toBeFalsy(); - }); - - it('handles false', () => { - render(); - - expect(screen.getByA11yState({ selected: false })).toBeTruthy(); - expect(screen.queryByA11yState({ selected: true })).toBeFalsy(); - }); - - it('handles default', () => { - render(); - - expect(screen.getByA11yState({ selected: false })).toBeTruthy(); - expect(screen.queryByA11yState({ selected: true })).toBeFalsy(); - }); -}); - -test('*ByA11yState on Pressable with "disabled" prop', () => { - render(); - expect(screen.getByA11yState({ disabled: true })).toBeTruthy(); - expect(screen.queryByA11yState({ disabled: false })).toBeFalsy(); -}); - -test('*ByA11yState on TouchableOpacity with "disabled" prop', () => { - render(); - expect(screen.getByA11yState({ disabled: true })).toBeTruthy(); - expect(screen.queryByA11yState({ disabled: false })).toBeFalsy(); -}); - -test('byA11yState queries support hidden option', () => { - render( - - Hidden from accessibility - , - ); - - expect(screen.getByA11yState({ expanded: false }, { includeHiddenElements: true })).toBeTruthy(); - - expect(screen.queryByA11yState({ expanded: false })).toBeFalsy(); - expect( - screen.queryByA11yState({ expanded: false }, { includeHiddenElements: false }), - ).toBeFalsy(); - expect(() => screen.getByA11yState({ expanded: false }, { includeHiddenElements: false })) - .toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with expanded state: false - - - - Hidden from accessibility - - " - `); -}); - -test('*ByA11yState deprecation warnings', async () => { - const mockCalls = (console.warn as ConsoleLogMock).mock.calls; - render(); - - screen.getByA11yState({ disabled: true }); - expect(mockCalls[0][0]).toMatchInlineSnapshot(` - "getByA11yState(...) is deprecated and will be removed in the future. - - Use getByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - screen.getAllByA11yState({ disabled: true }); - expect(mockCalls[1][0]).toMatchInlineSnapshot(` - "getAllByA11yState(...) is deprecated and will be removed in the future. - - Use getAllByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - screen.queryByA11yState({ disabled: true }); - expect(mockCalls[2][0]).toMatchInlineSnapshot(` - "queryByA11yState(...) is deprecated and will be removed in the future. - - Use queryByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - screen.queryAllByA11yState({ disabled: true }); - expect(mockCalls[3][0]).toMatchInlineSnapshot(` - "queryAllByA11yState(...) is deprecated and will be removed in the future. - - Use queryAllByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - await screen.findByA11yState({ disabled: true }); - expect(mockCalls[4][0]).toMatchInlineSnapshot(` - "findByA11yState(...) is deprecated and will be removed in the future. - - Use findByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - await screen.findAllByA11yState({ disabled: true }); - expect(mockCalls[5][0]).toMatchInlineSnapshot(` - "findAllByA11yState(...) is deprecated and will be removed in the future. - - Use findAllByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); -}); - -test('*ByAccessibilityState deprecation warnings', async () => { - const mockCalls = (console.warn as ConsoleLogMock).mock.calls; - render(); - - screen.getByAccessibilityState({ disabled: true }); - expect(mockCalls[0][0]).toMatchInlineSnapshot(` - "getByAccessibilityState(...) is deprecated and will be removed in the future. - - Use getByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - screen.getAllByAccessibilityState({ disabled: true }); - expect(mockCalls[1][0]).toMatchInlineSnapshot(` - "getAllByAccessibilityState(...) is deprecated and will be removed in the future. - - Use getAllByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - screen.queryByAccessibilityState({ disabled: true }); - expect(mockCalls[2][0]).toMatchInlineSnapshot(` - "queryByAccessibilityState(...) is deprecated and will be removed in the future. - - Use queryByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - screen.queryAllByAccessibilityState({ disabled: true }); - expect(mockCalls[3][0]).toMatchInlineSnapshot(` - "queryAllByAccessibilityState(...) is deprecated and will be removed in the future. - - Use queryAllByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - await screen.findByAccessibilityState({ disabled: true }); - expect(mockCalls[4][0]).toMatchInlineSnapshot(` - "findByAccessibilityState(...) is deprecated and will be removed in the future. - - Use findByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); - - await screen.findAllByAccessibilityState({ disabled: true }); - expect(mockCalls[5][0]).toMatchInlineSnapshot(` - "findAllByAccessibilityState(...) is deprecated and will be removed in the future. - - Use findAllByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead." - `); -}); - -test('error message renders the element tree, preserving only helpful props', async () => { - render( - null}> - Some text - , - ); - - expect(() => screen.getByA11yState({ checked: true })).toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with checked state: true - - - Some text - " - `); - - expect(() => screen.getAllByA11yState({ checked: true })).toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with checked state: true - - - Some text - " - `); - - await expect(screen.findByA11yState({ checked: true })).rejects - .toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with checked state: true - - - Some text - " - `); - - await expect(screen.findAllByA11yState({ checked: true })).rejects - .toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with checked state: true - - - Some text - " - `); -}); - -describe('aria-disabled prop', () => { - test('supports aria-disabled={true} prop', () => { - render(); - expect(screen.getByAccessibilityState({ disabled: true })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ disabled: false })).toBeNull(); - }); - - test('supports aria-disabled={false} prop', () => { - render(); - expect(screen.getByAccessibilityState({ disabled: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ disabled: true })).toBeNull(); - }); - - test('supports default aria-disabled prop', () => { - render(); - expect(screen.getByAccessibilityState({ disabled: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ disabled: true })).toBeNull(); - }); -}); - -describe('aria-selected prop', () => { - test('supports aria-selected={true} prop', () => { - render(); - expect(screen.getByAccessibilityState({ selected: true })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ selected: false })).toBeNull(); - }); - - test('supports aria-selected={false} prop', () => { - render(); - expect(screen.getByAccessibilityState({ selected: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ selected: true })).toBeNull(); - }); - - test('supports default aria-selected prop', () => { - render(); - expect(screen.getByAccessibilityState({ selected: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ selected: true })).toBeNull(); - }); -}); - -describe('aria-checked prop', () => { - test('supports aria-checked={true} prop', () => { - render(); - expect(screen.getByAccessibilityState({ checked: true })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ checked: false })).toBeNull(); - expect(screen.queryByAccessibilityState({ checked: 'mixed' })).toBeNull(); - }); - - test('supports aria-checked={false} prop', () => { - render(); - expect(screen.getByAccessibilityState({ checked: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ checked: true })).toBeNull(); - expect(screen.queryByAccessibilityState({ checked: 'mixed' })).toBeNull(); - }); - - test('supports aria-checked="mixed prop', () => { - render(); - expect(screen.getByAccessibilityState({ checked: 'mixed' })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ checked: true })).toBeNull(); - expect(screen.queryByAccessibilityState({ checked: false })).toBeNull(); - }); - - test('supports default aria-selected prop', () => { - render(); - expect(screen.getByAccessibilityState({})).toBeTruthy(); - expect(screen.queryByAccessibilityState({ checked: true })).toBeNull(); - expect(screen.queryByAccessibilityState({ checked: false })).toBeNull(); - expect(screen.queryByAccessibilityState({ checked: 'mixed' })).toBeNull(); - }); -}); - -describe('aria-busy prop', () => { - test('supports aria-busy={true} prop', () => { - render(); - expect(screen.getByAccessibilityState({ busy: true })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ busy: false })).toBeNull(); - }); - - test('supports aria-busy={false} prop', () => { - render(); - expect(screen.getByAccessibilityState({ busy: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ busy: true })).toBeNull(); - }); - - test('supports default aria-busy prop', () => { - render(); - expect(screen.getByAccessibilityState({ busy: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ busy: true })).toBeNull(); - }); -}); - -describe('aria-expanded prop', () => { - test('supports aria-expanded={true} prop', () => { - render(); - expect(screen.getByAccessibilityState({ expanded: true })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ expanded: false })).toBeNull(); - }); - - test('supports aria-expanded={false} prop', () => { - render(); - expect(screen.getByAccessibilityState({ expanded: false })).toBeTruthy(); - expect(screen.queryByAccessibilityState({ expanded: true })).toBeNull(); - }); - - test('supports default aria-expanded prop', () => { - render(); - render(); - expect(screen.getByAccessibilityState({})).toBeTruthy(); - expect(screen.queryByAccessibilityState({ expanded: true })).toBeNull(); - expect(screen.queryByAccessibilityState({ expanded: false })).toBeNull(); - }); -}); diff --git a/src/queries/__tests__/accessibility-value.test.tsx b/src/queries/__tests__/accessibility-value.test.tsx deleted file mode 100644 index 9e07ab41c..000000000 --- a/src/queries/__tests__/accessibility-value.test.tsx +++ /dev/null @@ -1,319 +0,0 @@ -/* eslint-disable no-console */ -import * as React from 'react'; -import { Text, TouchableOpacity, View } from 'react-native'; -import { render, screen } from '../..'; - -type ConsoleLogMock = jest.Mock; - -beforeEach(() => { - jest.spyOn(console, 'warn').mockImplementation(() => {}); -}); - -const TEXT_LABEL = 'cool text'; - -const Typography = ({ children, ...rest }: any) => { - return {children}; -}; - -const Button = ({ children }: { children: React.ReactNode }) => ( - - {children} - -); - -const Section = () => ( - <> - Title - - -); - -test('getByA11yValue, queryByA11yValue, findByA11yValue', async () => { - render(
); - - expect(screen.getByA11yValue({ min: 40 }).props.accessibilityValue).toEqual({ - min: 40, - max: 60, - }); - expect(screen.queryByA11yValue({ min: 40 })?.props.accessibilityValue).toEqual({ - min: 40, - max: 60, - }); - - expect(() => screen.getByA11yValue({ min: 50 })).toThrow( - 'Unable to find an element with min value: 50', - ); - expect(screen.queryByA11yValue({ min: 50 })).toEqual(null); - - expect(() => screen.getByA11yValue({ max: 60 })).toThrow( - 'Found multiple elements with max value: 60', - ); - expect(() => screen.queryByA11yValue({ max: 60 })).toThrow( - 'Found multiple elements with max value: 60', - ); - - const asyncElement = await screen.findByA11yValue({ min: 40 }); - expect(asyncElement.props.accessibilityValue).toEqual({ - min: 40, - max: 60, - }); - await expect(screen.findByA11yValue({ min: 50 })).rejects.toThrow( - 'Unable to find an element with min value: 50', - ); - await expect(screen.findByA11yValue({ max: 60 })).rejects.toThrow( - 'Found multiple elements with max value: 60', - ); -}); - -test('getAllByA11yValue, queryAllByA11yValue, findAllByA11yValue', async () => { - render(
); - - expect(screen.getAllByA11yValue({ min: 40 })).toHaveLength(1); - expect(screen.queryAllByA11yValue({ min: 40 })).toHaveLength(1); - - expect(() => screen.getAllByA11yValue({ min: 50 })).toThrow( - 'Unable to find an element with min value: 50', - ); - expect(screen.queryAllByA11yValue({ min: 50 })).toEqual([]); - - expect(screen.queryAllByA11yValue({ max: 60 })).toHaveLength(2); - expect(screen.getAllByA11yValue({ max: 60 })).toHaveLength(2); - - await expect(screen.findAllByA11yValue({ min: 40 })).resolves.toHaveLength(1); - await expect(screen.findAllByA11yValue({ min: 50 })).rejects.toThrow( - 'Unable to find an element with min value: 50', - ); - await expect(screen.findAllByA11yValue({ max: 60 })).resolves.toHaveLength(2); -}); - -test('byA11yValue queries support hidden option', () => { - render( - - Hidden from accessibility - , - ); - - expect(screen.getByA11yValue({ max: 10 }, { includeHiddenElements: true })).toBeTruthy(); - - expect(screen.queryByA11yValue({ max: 10 })).toBeFalsy(); - expect(screen.queryByA11yValue({ max: 10 }, { includeHiddenElements: false })).toBeFalsy(); - expect(() => screen.getByA11yValue({ max: 10 }, { includeHiddenElements: false })) - .toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with max value: 10 - - - Hidden from accessibility - " - `); -}); - -test('byA11yValue error messages', () => { - render(); - expect(() => screen.getByA11yValue({ min: 10, max: 10 })).toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with min value: 10, max value: 10 - - " - `); - expect(() => screen.getByA11yValue({ max: 20, now: 5 })).toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with max value: 20, now value: 5 - - " - `); - expect(() => screen.getByA11yValue({ min: 1, max: 2, now: 3 })) - .toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with min value: 1, max value: 2, now value: 3 - - " - `); - expect(() => screen.getByA11yValue({ min: 1, max: 2, now: 3, text: /foo/i })) - .toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with min value: 1, max value: 2, now value: 3, text value: /foo/i - - " - `); -}); - -test('*ByA11yValue deprecation warnings', async () => { - const mockCalls = (console.warn as ConsoleLogMock).mock.calls; - render(); - - screen.getByA11yValue({ min: 10 }); - expect(mockCalls[0][0]).toMatchInlineSnapshot(` - "getByA11yValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or getByRole(role, { value: ... }) query instead." - `); - - screen.getAllByA11yValue({ min: 10 }); - expect(mockCalls[1][0]).toMatchInlineSnapshot(` - "getAllByA11yValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or getAllByRole(role, { value: ... }) query instead." - `); - - screen.queryByA11yValue({ min: 10 }); - expect(mockCalls[2][0]).toMatchInlineSnapshot(` - "queryByA11yValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or queryByRole(role, { value: ... }) query instead." - `); - - screen.queryAllByA11yValue({ min: 10 }); - expect(mockCalls[3][0]).toMatchInlineSnapshot(` - "queryAllByA11yValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or queryAllByRole(role, { value: ... }) query instead." - `); - - await screen.findByA11yValue({ min: 10 }); - expect(mockCalls[4][0]).toMatchInlineSnapshot(` - "findByA11yValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or findByRole(role, { value: ... }) query instead." - `); - - await screen.findAllByA11yValue({ min: 10 }); - expect(mockCalls[5][0]).toMatchInlineSnapshot(` - "findAllByA11yValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or findAllByRole(role, { value: ... }) query instead." - `); -}); - -test('*ByAccessibilityValue deprecation warnings', async () => { - const mockCalls = (console.warn as ConsoleLogMock).mock.calls; - render(); - - screen.getByAccessibilityValue({ min: 10 }); - expect(mockCalls[0][0]).toMatchInlineSnapshot(` - "getByAccessibilityValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or getByRole(role, { value: ... }) query instead." - `); - - screen.getAllByAccessibilityValue({ min: 10 }); - expect(mockCalls[1][0]).toMatchInlineSnapshot(` - "getAllByAccessibilityValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or getAllByRole(role, { value: ... }) query instead." - `); - - screen.queryByAccessibilityValue({ min: 10 }); - expect(mockCalls[2][0]).toMatchInlineSnapshot(` - "queryByAccessibilityValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or queryByRole(role, { value: ... }) query instead." - `); - - screen.queryAllByAccessibilityValue({ min: 10 }); - expect(mockCalls[3][0]).toMatchInlineSnapshot(` - "queryAllByAccessibilityValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or queryAllByRole(role, { value: ... }) query instead." - `); - - await screen.findByAccessibilityValue({ min: 10 }); - expect(mockCalls[4][0]).toMatchInlineSnapshot(` - "findByAccessibilityValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or findByRole(role, { value: ... }) query instead." - `); - - await screen.findAllByAccessibilityValue({ min: 10 }); - expect(mockCalls[5][0]).toMatchInlineSnapshot(` - "findAllByAccessibilityValue(...) is deprecated and will be removed in the future. - - Use toHaveAccessibilityValue(...) built-in Jest matcher or findAllByRole(role, { value: ... }) query instead." - `); -}); - -test('error message renders the element tree, preserving only helpful props', async () => { - render(); - - expect(() => screen.getByA11yValue({ min: 1 })).toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with min value: 1 - - " - `); - - expect(() => screen.getAllByA11yValue({ min: 1 })).toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with min value: 1 - - " - `); - - await expect(screen.findByA11yValue({ min: 1 })).rejects.toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with min value: 1 - - " - `); - - await expect(screen.findAllByA11yValue({ min: 1 })).rejects.toThrowErrorMatchingInlineSnapshot(` - "Unable to find an element with min value: 1 - - " - `); -}); - -describe('getByAccessibilityValue supports "aria-*" props', () => { - test('supports "aria-valuemax"', () => { - render(); - expect(screen.getByAccessibilityValue({ max: 10 })).toBeTruthy(); - }); - - test('supports "aria-valuemin"', () => { - render(); - expect(screen.getByAccessibilityValue({ min: 20 })).toBeTruthy(); - }); - - test('supports "aria-valuenow"', () => { - render(); - expect(screen.getByAccessibilityValue({ now: 30 })).toBeTruthy(); - }); - - test('supports "aria-valuetext"', () => { - render(); - expect(screen.getByAccessibilityValue({ text: 'Hello World' })).toBeTruthy(); - expect(screen.getByAccessibilityValue({ text: /hello/i })).toBeTruthy(); - }); - - test('supports multiple "aria-value*" props', () => { - render(); - expect(screen.getByAccessibilityValue({ now: 50, min: 0, max: 100 })).toBeTruthy(); - }); -}); diff --git a/src/queries/accessibility-state.ts b/src/queries/accessibility-state.ts deleted file mode 100644 index b38df4a7a..000000000 --- a/src/queries/accessibility-state.ts +++ /dev/null @@ -1,94 +0,0 @@ -import type { ReactTestInstance } from 'react-test-renderer'; -import { accessibilityStateKeys } from '../helpers/accessibility'; -import { deprecateQueries } from '../helpers/deprecation'; -import { findAll } from '../helpers/find-all'; -import { - AccessibilityStateMatcher, - matchAccessibilityState, -} from '../helpers/matchers/match-accessibility-state'; -import { makeQueries } from './make-queries'; -import type { - FindAllByQuery, - FindByQuery, - GetAllByQuery, - GetByQuery, - QueryAllByQuery, - QueryByQuery, -} from './make-queries'; -import { CommonQueryOptions } from './options'; - -const queryAllByA11yState = ( - instance: ReactTestInstance, -): QueryAllByQuery => - function queryAllByA11yStateFn(matcher, queryOptions) { - return findAll(instance, (node) => matchAccessibilityState(node, matcher), queryOptions); - }; - -const buildErrorMessage = (state: AccessibilityStateMatcher = {}) => { - const errors: string[] = []; - - accessibilityStateKeys.forEach((stateKey) => { - if (state[stateKey] !== undefined) { - errors.push(`${stateKey} state: ${state[stateKey]}`); - } - }); - - return errors.join(', '); -}; - -const getMultipleError = (state: AccessibilityStateMatcher) => - `Found multiple elements with ${buildErrorMessage(state)}`; - -const getMissingError = (state: AccessibilityStateMatcher) => - `Unable to find an element with ${buildErrorMessage(state)}`; - -const { getBy, getAllBy, queryBy, queryAllBy, findBy, findAllBy } = makeQueries( - queryAllByA11yState, - getMissingError, - getMultipleError, -); - -export type ByA11yStateQueries = { - getByA11yState: GetByQuery; - getAllByA11yState: GetAllByQuery; - queryByA11yState: QueryByQuery; - queryAllByA11yState: QueryAllByQuery; - findByA11yState: FindByQuery; - findAllByA11yState: FindAllByQuery; - - getByAccessibilityState: GetByQuery; - getAllByAccessibilityState: GetAllByQuery; - queryByAccessibilityState: QueryByQuery; - queryAllByAccessibilityState: QueryAllByQuery; - findByAccessibilityState: FindByQuery; - findAllByAccessibilityState: FindAllByQuery; -}; - -export const bindByA11yStateQueries = (instance: ReactTestInstance): ByA11yStateQueries => { - const getByA11yState = getBy(instance); - const getAllByA11yState = getAllBy(instance); - const queryByA11yState = queryBy(instance); - const queryAllByA11yState = queryAllBy(instance); - const findByA11yState = findBy(instance); - const findAllByA11yState = findAllBy(instance); - - return { - ...deprecateQueries( - { - getByA11yState, - getAllByA11yState, - queryByA11yState, - queryAllByA11yState, - findByA11yState, - findAllByA11yState, - getByAccessibilityState: getByA11yState, - getAllByAccessibilityState: getAllByA11yState, - queryByAccessibilityState: queryByA11yState, - queryAllByAccessibilityState: queryAllByA11yState, - findByAccessibilityState: findByA11yState, - findAllByAccessibilityState: findAllByA11yState, - }, - 'Use {queryPrefix}ByRole(role, { disabled, selected, checked, busy, expanded }) query or built-in Jest matchers: toBeDisabled(), toBeSelected(), toBeChecked(), toBeBusy(), and toBeExpanded() instead.', - ), - }; -}; diff --git a/src/queries/accessibility-value.ts b/src/queries/accessibility-value.ts deleted file mode 100644 index 25d4d5361..000000000 --- a/src/queries/accessibility-value.ts +++ /dev/null @@ -1,94 +0,0 @@ -import type { ReactTestInstance } from 'react-test-renderer'; -import { accessibilityValueKeys } from '../helpers/accessibility'; -import { deprecateQueries } from '../helpers/deprecation'; -import { findAll } from '../helpers/find-all'; -import { - AccessibilityValueMatcher, - matchAccessibilityValue, -} from '../helpers/matchers/match-accessibility-value'; -import { makeQueries } from './make-queries'; -import type { - FindAllByQuery, - FindByQuery, - GetAllByQuery, - GetByQuery, - QueryAllByQuery, - QueryByQuery, -} from './make-queries'; -import { CommonQueryOptions } from './options'; - -const queryAllByA11yValue = ( - instance: ReactTestInstance, -): QueryAllByQuery => - function queryAllByA11yValueFn(value, queryOptions) { - return findAll(instance, (node) => matchAccessibilityValue(node, value), queryOptions); - }; - -const formatQueryParams = (matcher: AccessibilityValueMatcher) => { - const params: string[] = []; - - accessibilityValueKeys.forEach((valueKey) => { - if (matcher[valueKey] !== undefined) { - params.push(`${valueKey} value: ${matcher[valueKey]}`); - } - }); - - return params.join(', '); -}; - -const getMultipleError = (matcher: AccessibilityValueMatcher) => - `Found multiple elements with ${formatQueryParams(matcher)}`; - -const getMissingError = (matcher: AccessibilityValueMatcher) => - `Unable to find an element with ${formatQueryParams(matcher)}`; - -const { getBy, getAllBy, queryBy, queryAllBy, findBy, findAllBy } = makeQueries( - queryAllByA11yValue, - getMissingError, - getMultipleError, -); - -export type ByA11yValueQueries = { - getByA11yValue: GetByQuery; - getAllByA11yValue: GetAllByQuery; - queryByA11yValue: QueryByQuery; - queryAllByA11yValue: QueryAllByQuery; - findByA11yValue: FindByQuery; - findAllByA11yValue: FindAllByQuery; - - getByAccessibilityValue: GetByQuery; - getAllByAccessibilityValue: GetAllByQuery; - queryByAccessibilityValue: QueryByQuery; - queryAllByAccessibilityValue: QueryAllByQuery; - findByAccessibilityValue: FindByQuery; - findAllByAccessibilityValue: FindAllByQuery; -}; - -export const bindByA11yValueQueries = (instance: ReactTestInstance): ByA11yValueQueries => { - const getByA11yValue = getBy(instance); - const getAllByA11yValue = getAllBy(instance); - const queryByA11yValue = queryBy(instance); - const queryAllByA11yValue = queryAllBy(instance); - const findByA11yValue = findBy(instance); - const findAllByA11yValue = findAllBy(instance); - - return { - ...deprecateQueries( - { - getByA11yValue, - getAllByA11yValue, - queryByA11yValue, - queryAllByA11yValue, - findByA11yValue, - findAllByA11yValue, - getByAccessibilityValue: getByA11yValue, - getAllByAccessibilityValue: getAllByA11yValue, - queryByAccessibilityValue: queryByA11yValue, - queryAllByAccessibilityValue: queryAllByA11yValue, - findByAccessibilityValue: findByA11yValue, - findAllByAccessibilityValue: findAllByA11yValue, - }, - 'Use toHaveAccessibilityValue(...) built-in Jest matcher or {queryPrefix}ByRole(role, { value: ... }) query instead.', - ), - }; -}; diff --git a/src/screen.ts b/src/screen.ts index 1fcbd3e2a..90600ef82 100644 --- a/src/screen.ts +++ b/src/screen.ts @@ -59,30 +59,6 @@ const defaultScreen: Screen = { queryAllByRole: notImplemented, findByRole: notImplemented, findAllByRole: notImplemented, - getByA11yState: notImplemented, - getAllByA11yState: notImplemented, - queryByA11yState: notImplemented, - queryAllByA11yState: notImplemented, - findByA11yState: notImplemented, - findAllByA11yState: notImplemented, - getByAccessibilityState: notImplemented, - getAllByAccessibilityState: notImplemented, - queryByAccessibilityState: notImplemented, - queryAllByAccessibilityState: notImplemented, - findByAccessibilityState: notImplemented, - findAllByAccessibilityState: notImplemented, - getByA11yValue: notImplemented, - getAllByA11yValue: notImplemented, - queryByA11yValue: notImplemented, - queryAllByA11yValue: notImplemented, - findByA11yValue: notImplemented, - findAllByA11yValue: notImplemented, - getByAccessibilityValue: notImplemented, - getAllByAccessibilityValue: notImplemented, - queryByAccessibilityValue: notImplemented, - queryAllByAccessibilityValue: notImplemented, - findByAccessibilityValue: notImplemented, - findAllByAccessibilityValue: notImplemented, UNSAFE_getByProps: notImplemented, UNSAFE_getAllByProps: notImplemented, UNSAFE_queryByProps: notImplemented, diff --git a/src/within.ts b/src/within.ts index 59db8bf1a..0e5873007 100644 --- a/src/within.ts +++ b/src/within.ts @@ -6,8 +6,6 @@ import { bindByPlaceholderTextQueries } from './queries/placeholder-text'; import { bindByLabelTextQueries } from './queries/label-text'; import { bindByHintTextQueries } from './queries/hint-text'; import { bindByRoleQueries } from './queries/role'; -import { bindByA11yStateQueries } from './queries/accessibility-state'; -import { bindByA11yValueQueries } from './queries/accessibility-value'; import { bindUnsafeByTypeQueries } from './queries/unsafe-type'; import { bindUnsafeByPropsQueries } from './queries/unsafe-props'; @@ -20,8 +18,6 @@ export function within(instance: ReactTestInstance) { ...bindByLabelTextQueries(instance), ...bindByHintTextQueries(instance), ...bindByRoleQueries(instance), - ...bindByA11yStateQueries(instance), - ...bindByA11yValueQueries(instance), ...bindUnsafeByTypeQueries(instance), ...bindUnsafeByPropsQueries(instance), }; diff --git a/typings/index.flow.js b/typings/index.flow.js index eb05d9f24..2bea0c77b 100644 --- a/typings/index.flow.js +++ b/typings/index.flow.js @@ -55,10 +55,10 @@ declare type A11yRole = declare type A11yState = {| disabled?: boolean, - selected?: boolean, - checked?: boolean | 'mixed', - busy?: boolean, - expanded?: boolean, + selected ?: boolean, + checked ?: boolean | 'mixed', + busy ?: boolean, + expanded ?: boolean, |}; declare type A11yValue = { @@ -258,38 +258,6 @@ interface A11yAPI { queryOptions?: ByRoleOptions, waitForOptions?: WaitForOptions ) => FindAllReturn; - - // State - getByA11yState: (matcher: A11yState, options?: CommonQueryOptions) => GetReturn; - getAllByA11yState: (matcher: A11yState, options?: CommonQueryOptions) => GetAllReturn; - queryByA11yState: (matcher: A11yState, options?: CommonQueryOptions) => QueryReturn; - queryAllByA11yState: (matcher: A11yState, options?: CommonQueryOptions) => QueryAllReturn; - findByA11yState: ( - matcher: A11yState, - queryOptions?: CommonQueryOptions, - waitForOptions?: WaitForOptions - ) => FindReturn; - findAllByA11yState: ( - matcher: A11yState, - queryOptions?: CommonQueryOptions, - waitForOptions?: WaitForOptions - ) => FindAllReturn; - - // Value - getByA11yValue: (matcher: A11yValue, options?: CommonQueryOptions) => GetReturn; - getAllByA11yValue: (matcher: A11yValue, options?: CommonQueryOptions) => GetAllReturn; - queryByA11yValue: (matcher: A11yValue, options?: CommonQueryOptions) => QueryReturn; - queryAllByA11yValue: (matcher: A11yValue, options?: CommonQueryOptions) => QueryAllReturn; - findByA11yValue: ( - matcher: A11yValue, - queryOptions?: CommonQueryOptions, - waitForOptions?: WaitForOptions - ) => FindReturn; - findAllByA11yValue: ( - matcher: A11yValue, - queryOptions?: CommonQueryOptions, - waitForOptions?: WaitForOptions - ) => FindAllReturn; } interface Thenable { diff --git a/website/docs/MigrationV13.md b/website/docs/MigrationV13.md new file mode 100644 index 000000000..b58c4f93f --- /dev/null +++ b/website/docs/MigrationV13.md @@ -0,0 +1,67 @@ +## @@ -0,0 +1,20 @@ + +id: migration-v13 +title: Migration to 13.0 + +--- + +import TOCInline from '@theme/TOCInline'; + +Migration to React Native Testing Library version 13 from version 12.x. + + + +# Breaking changes + +## Removed deprecated \*ByAccessibilityState queries + +This deprecated query has been removed as is typically too general to give meaningful results. Use one of the following options: + +- [`*ByRole`](#by-role) query with relevant state options: `disabled`, `selected`, `checked`, `expanded` and `busy` +- use built-in Jest matchers to check the state of element found using some other query: + - enabled state: [`toBeEnabled()` / `toBeDisabled()`](jest-matchers#tobeenabled) + - checked state: [`toBeChecked()` / `toBePartiallyChecked()`](jest-matchers#tobechecked) + - selected state: [`toBeSelected()`](jest-matchers#tobeselected) + - expanded state: [`toBeExpanded()` / `toBeCollapsed()`](jest-matchers#tobeexpanded) + - busy state: [`toBeBusy()`](jest-matchers#tobebusy) + +```ts +// Replace this +const view = screen.getByAccessibilityState({ disabled: true }); + +// with this (getByRole query) +const view = screen.getByRole('', { disabled: true }); + +// or this (Jest matcher) +const view = screen.getBy*(...); // Find the element using any query: *ByRole, *ByText, *ByTestId +expect(view).toBeDisabled(); // Assert its accessibility state +``` + +## Removed deprecated \*ByAccessibilityValue queries + +This deprecated query has been removed as is typically too general to give meaningful results. Use one of the following options: + +- [`toHaveAccessibilityValue()`](jest-matchers#tohaveaccessibilityvalue) Jest matcher to check the state of element found using some other query +- [`*ByRole`](#by-role) query with `value` option + +```ts +// Replace this +const view = screen.getByAccessibilityValue({ now: 50, min: 0, max: 50 }); + +// with this (getByRole query) +const view = screen.getByRole('', { value: { now: 50, min: 0, max: 50 } }); + +// or this (Jest matcher) +const view = screen.getBy*(...); // Find the element using any query: *ByRole, *ByText, *ByTestId +expect(view).toHaveAccessibilityValue({ now: 50, min: 0, max: 50 }); // Assert its accessibility value +``` + +# Other changes + +## Updated `flushMicroTasks` internal method + +This should not break any tests. + +## Full Changelog + +https://github.com/callstack/react-native-testing-library/compare/v12.5.0...v13.0.0 diff --git a/website/docs/Queries.md b/website/docs/Queries.md index f892cd8aa..fe9601962 100644 --- a/website/docs/Queries.md +++ b/website/docs/Queries.md @@ -386,115 +386,6 @@ const element = screen.getByTestId('unique-id'); In the spirit of [the guiding principles](https://testing-library.com/docs/guiding-principles), it is recommended to use this only after the other queries don't work for your use case. Using `testID` attributes do not resemble how your software is used and should be avoided if possible. However, they are particularly useful for end-to-end testing on real devices, e.g. using Detox and it's an encouraged technique to use there. Learn more from the blog post ["Making your UI tests resilient to change"](https://kentcdodds.com/blog/making-your-ui-tests-resilient-to-change). ::: -### `*ByA11yState`, `ByAccessibilityState` (deprecated) {#by-accessibility-state} - -:::caution -This query has been marked deprecated, as is typically too general to give meaningful results. Therefore, it's better to use one of following options: - -- [`*ByRole`](#by-role) query with relevant state options: `disabled`, `selected`, `checked`, `expanded` and `busy` -- use built-in Jest matchers to check the state of element found using some other query: - - enabled state: [`toBeEnabled()` / `toBeDisabled()`](jest-matchers#tobeenabled) - - checked state: [`toBeChecked()` / `toBePartiallyChecked()`](jest-matchers#tobechecked) - - selected state: [`toBeSelected()`](jest-matchers#tobeselected) - - expanded state: [`toBeExpanded()` / `toBeCollapsed()`](jest-matchers#tobeexpanded) - - busy state: [`toBeBusy()`](jest-matchers#tobebusy) - -::: - -> getByA11yState, getAllByA11yState, queryByA11yState, queryAllByA11yState, findByA11yState, findAllByA11yState -> getByAccessibilityState, getAllByAccessibilityState, queryByAccessibilityState, queryAllByAccessibilityState, findByAccessibilityState, findAllByAccessibilityState - -```ts -getByA11yState( - state: { - disabled?: boolean, - selected?: boolean, - checked?: boolean | 'mixed', - busy?: boolean, - expanded?: boolean, - }, - options?: { - includeHiddenElements?: boolean; - }, -): ReactTestInstance; -``` - -Returns a `ReactTestInstance` with matching `accessibilityState` prop or ARIA state props: `aria-disabled`, `aria-selected`, `aria-checked`, `aria-busy`, and `aria-expanded`. - -```jsx -import { render, screen } from '@testing-library/react-native'; - -render(); -const element = screen.getByA11yState({ disabled: true }); -``` - -:::note - -#### Default state for: `disabled`, `selected`, and `busy` keys - -Passing `false` matcher value will match both elements with explicit `false` state value and without explicit state value. - -For instance, `getByA11yState({ disabled: false })` will match elements with following props: - -- `accessibilityState={{ disabled: false, ... }}` -- no `disabled` key under `accessibilityState` prop, e.g. `accessibilityState={{}}` -- no `accessibilityState` prop at all - -#### Default state for: `checked` and `expanded` keys - -Passing `false` matcher value will only match elements with explicit `false` state value. - -For instance, `getByA11yState({ checked: false })` will only match elements with: - -- `accessibilityState={{ checked: false, ... }}` - -but will not match elements with following props: - -- no `checked` key under `accessibilityState` prop, e.g. `accessibilityState={{}}` -- no `accessibilityState` prop at all - -The difference in handling default values is made to reflect observed accessibility behaviour on iOS and Android platforms. -::: - -### `*ByA11yValue`, `*ByAccessibilityValue` (deprecated) {#by-accessibility-value} - -:::caution -This query has been marked deprecated, as is typically too general to give meaningful results. Therefore, it's better to use one of following options: - -- [`toHaveAccessibilityValue()`](jest-matchers#tohaveaccessibilityvalue) Jest matcher to check the state of element found using some other query -- [`*ByRole`](#by-role) query with `value` option - -::: - -> getByA11yValue, getAllByA11yValue, queryByA11yValue, queryAllByA11yValue, findByA11yValue, findAllByA11yValue -> getByAccessibilityValue, getAllByAccessibilityValue, queryByAccessibilityValue, queryAllByAccessibilityValue, findByAccessibilityValue, findAllByAccessibilityValue - -```ts -getByA11yValue( - value: { - min?: number; - max?: number; - now?: number; - text?: TextMatch; - }, - options?: { - includeHiddenElements?: boolean; - }, -): ReactTestInstance; -``` - -Returns a host element with matching accessibility value based on `aria-valuemin`, `aria-valuemax`, `aria-valuenow`, `aria-valuetext` & `accessibilityValue` props. Only value entires provided to the query will be used to match elements. Element might have additional accessibility value entries and still be matched. - -When querying by `text` entry a string or regex might be used. - -```jsx -import { render, screen } from '@testing-library/react-native'; - -render(); -const element = screen.getByA11yValue({ now: 25 }); -const element2 = screen.getByA11yValue({ text: /25/ }); -``` - ### Common options Usually query first argument can be a **string** or a **regex**. All queries take at least the [`hidden`](#hidden-option) option as an optionnal second argument and some queries accept more options which change string matching behaviour. See [TextMatch](#textmatch) for more info.