feat: byA11yValue matcher (#262)

Author: Esemesek

src/__tests__/a11yAPI.test.js

@@ -33,6 +33,7 @@ class Button extends React.Component<any> {
           accessibilityRole={TEXT_ROLE}
           accessibilityStates={['selected']}
           accessibilityState={{ expanded: false, selected: true }}
+          accessibilityValue={{ min: 40, max: 60 }}
         >
           {this.props.children}
         </Typography>
@@ -50,6 +51,7 @@ function Section() {
         accessibilityRole={TEXT_ROLE}
         accessibilityStates={['selected', 'disabled']}
         accessibilityState={{ expanded: false }}
+        accessibilityValue={{ max: 60 }}
       >
         Title
       </Typography>
@@ -202,3 +204,35 @@ test('getAllByA11yState, queryAllByA11yState', () => {
   expect(getAllByA11yState({ expanded: false }).length).toEqual(2);
   expect(queryAllByA11yState({ expanded: false }).length).toEqual(2);
 });
+
+test('getByA11yValue, queryByA11yValue', () => {
+  const { getByA11yValue, queryByA11yValue } = render(<Section />);
+
+  expect(getByA11yValue({ min: 40 }).props.accessibilityValue).toEqual({
+    min: 40,
+    max: 60,
+  });
+  expect(queryByA11yValue({ min: 40 })?.props.accessibilityValue).toEqual({
+    min: 40,
+    max: 60,
+  });
+
+  expect(() => getByA11yValue({ min: 50 })).toThrow(NO_INSTANCES_FOUND);
+  expect(queryByA11yValue({ min: 50 })).toEqual(null);
+
+  expect(() => getByA11yValue({ max: 60 })).toThrow(FOUND_TWO_INSTANCES);
+  expect(() => queryByA11yValue({ max: 60 })).toThrow(FOUND_TWO_INSTANCES);
+});
+
+test('getAllByA11yValue, queryAllByA11yValue', () => {
+  const { getAllByA11yValue, queryAllByA11yValue } = render(<Section />);
+
+  expect(getAllByA11yValue({ min: 40 }).length).toEqual(1);
+  expect(queryAllByA11yValue({ min: 40 }).length).toEqual(1);
+
+  expect(() => getAllByA11yValue({ min: 50 })).toThrow(NO_INSTANCES_FOUND);
+  expect(queryAllByA11yValue({ min: 50 })).toEqual([]);
+
+  expect(getAllByA11yValue({ max: 60 }).length).toEqual(2);
+  expect(queryAllByA11yValue({ max: 60 }).length).toEqual(2);
+});

src/helpers/a11yAPI.js

@@ -1,6 +1,6 @@
 // @flow
 import makeQuery from './makeQuery';
-import type { A11yRole, A11yStates, A11yState } from '../types.flow';
+import type { A11yRole, A11yStates, A11yState, A11yValue } from '../types.flow';
 
 type GetReturn = ReactTestInstance;
 type GetAllReturn = Array<ReactTestInstance>;
@@ -37,6 +37,12 @@ type A11yAPI = {|
   getAllByA11yState: A11yState => GetAllReturn,
   queryByA11yState: A11yState => QueryReturn,
   queryAllByA11yState: A11yState => QueryAllReturn,
+
+  // Value
+  getByA11yValue: A11yValue => GetReturn,
+  getAllByA11yValue: A11yValue => GetAllReturn,
+  queryByA11yValue: A11yValue => QueryReturn,
+  queryAllByA11yValue: A11yValue => QueryAllReturn,
 |};
 
 export function matchStringValue(
@@ -129,6 +135,16 @@ const a11yAPI = (instance: ReactTestInstance): A11yAPI =>
       },
       matchObject
     )(instance),
+    ...makeQuery(
+      'accessibilityValue',
+      {
+        getBy: ['getByA11yValue', 'getByAccessibilityValue'],
+        getAllBy: ['getAllByA11yValue', 'getAllByAccessibilityValue'],
+        queryBy: ['queryByA11yValue', 'queryByAccessibilityValue'],
+        queryAllBy: ['queryAllByA11yValue', 'queryAllByAccessibilityValue'],
+      },
+      matchObject
+    )(instance),
   }: any);
 
 export default a11yAPI;

src/types.flow.js

@@ -46,3 +46,10 @@ export type A11yStates =
   | 'expanded'
   | 'collapsed'
   | 'hasPopup';
+
+export type A11yValue = {
+  min?: number,
+  max?: number,
+  now?: number,
+  text?: string,
+};

typings/__tests__/index.test.tsx

@@ -169,6 +169,11 @@ const getAllByA11yState: Array<ReactTestInstance> = tree.getAllByA11yState({ bus
 const queryByA11yState: ReactTestInstance = tree.queryByA11yState({ busy: true });
 const queryAllByA11yState: Array<ReactTestInstance> = tree.queryAllByA11yState({ busy: true });
 
+const getByA11yValue: ReactTestInstance = tree.getByA11yValue({ min: 10 });
+const getAllByA11yValue: Array<ReactTestInstance> = tree.getAllByA11yValue({ min: 10 });
+const queryByA11yValue: ReactTestInstance = tree.queryByA11yValue({ min: 10 });
+const queryAllByA11yValue: Array<ReactTestInstance> = tree.queryAllByA11yValue({ min: 10 });
+
 const debugFn = tree.debug();
 const debugFnWithMessage = tree.debug('my message');
 

typings/index.d.ts

@@ -68,6 +68,14 @@ type GetAllReturn = Array<ReactTestInstance>;
 type QueryReturn = ReactTestInstance | null;
 type QueryAllReturn = Array<ReactTestInstance> | [];
 
+// Not yet available in DefinitelyTyped
+export type A11yValue = {
+  min?: number,
+  max?: number,
+  now?: number,
+  text?: string,
+};
+
 type A11yAPI = {
   // Label
   getByA11yLabel: (matcher: string | RegExp) => GetReturn,
@@ -98,6 +106,12 @@ type A11yAPI = {
   getAllByA11yState: (matcher: AccessibilityState) => GetAllReturn,
   queryByA11yState: (matcher: AccessibilityState) => QueryReturn,
   queryAllByA11yState: (matcher: AccessibilityState) => QueryAllReturn,
+
+  // Value
+  getByA11yValue: (matcher: A11yValue) => GetReturn,
+  getAllByA11yValue: (matcher: A11yValue) => GetAllReturn,
+  queryByA11yValue: (matcher: A11yValue) => QueryReturn,
+  queryAllByA11yValue: (matcher: A11yValue) => QueryAllReturn,
 };
 
 export interface Thenable {