feat: add a11y queries

src/__tests__/a11yAPI.test.js

@@ -0,0 +1,41 @@
+// @flow
+import React from 'react';
+import { TouchableOpacity, Text } from 'react-native';
+import { render } from '..';
+
+const BUTTON_LABEL = 'button-label';
+const TEXT_LABEL = 'text-label';
+
+class Button extends React.Component<*> {
+  render() {
+    return (
+      <TouchableOpacity
+        accessibilityLabel={BUTTON_LABEL}
+        accessibilityStates={['disabled', 'selected']}
+      >
+        <Text accessibilityLabel={TEXT_LABEL}>Text 1</Text>
+        <Text accessibilityLabel={TEXT_LABEL}>Text 2</Text>
+      </TouchableOpacity>
+    );
+  }
+}
+
+test('getByA11yLabel, queryByA11yLabel', () => {
+  const { getByA11yStates } = render(<Button />);
+
+  console.log(getByA11yStates(['disabled', 'selected']));
+});
+
+test('getAllByA11yLabel, queryAllByA11yLabel', () => {});
+
+test('getByA11yHint, queryByA11yHint', () => {});
+
+test('getAllByA11yHint, queryAllByA11yHint', () => {});
+
+test('getByA11yRole, queryByA11yRole', () => {});
+
+test('getAllByA11yRole, queryAllByA11yRole', () => {});
+
+test('getByA11yStates, queryByA11yStates', () => {});
+
+test('getAllByA11yStates, queryAllByA11yStates', () => {});

src/helpers/a11yAPI.js

@@ -0,0 +1,98 @@
+// @flow
+import makeQuery from './makeQuery';
+
+type TextQueryFn = (string | RegExp) => ReactTestInstance;
+type ArrayQueryFn = (string | Array<string>) => ReactTestInstance;
+
+type A11yAPI = {
+  getByA11yLabel: TextQueryFn,
+  getAllByA11yLabel: TextQueryFn,
+  queryByA11yLabel: TextQueryFn,
+  queryAllByA11yLabel: TextQueryFn,
+  getByA11yHint: TextQueryFn,
+  getAllByA11yHint: TextQueryFn,
+  queryByA11yHint: TextQueryFn,
+  queryAllByA11yHint: TextQueryFn,
+  getByA11yRole: TextQueryFn,
+  getAllByA11yRole: TextQueryFn,
+  queryByA11yRole: TextQueryFn,
+  queryAllByA11yRole: TextQueryFn,
+  getByA11yStates: ArrayQueryFn,
+  getAllByA11yStates: ArrayQueryFn,
+  queryByA11yStates: ArrayQueryFn,
+  queryAllByA11yStates: ArrayQueryFn,
+};
+
+export function matchStringValue(prop?: string, matcher: string | RegExp) {
+  if (!prop) {
+    return false;
+  }
+
+  if (typeof matcher === 'string') {
+    return prop === matcher;
+  }
+
+  return Boolean(prop.match(matcher));
+}
+
+export function matchArrayValue(
+  prop?: Array<string>,
+  matcher: string | Array<string>
+) {
+  if (!prop) {
+    return false;
+  }
+
+  if (typeof matcher === 'string') {
+    return prop.includes(matcher);
+  }
+
+  // $FlowFixMe
+  return !matcher.some(e => !prop.includes(e));
+}
+
+const a11yAPI = (instance: ReactTestInstance): A11yAPI =>
+  ({
+    ...makeQuery(
+      'accessibilityLabel',
+      {
+        getBy: 'getByA11yLabel',
+        getAllBy: 'getAllByA11yLabel',
+        queryBy: 'queryByA11yLabel',
+        queryAllBy: 'queryAllByA11yLabel',
+      },
+      matchStringValue
+    )(instance),
+    ...makeQuery(
+      'accessibilityHint',
+      {
+        getBy: 'getByA11yHint',
+        getAllBy: 'getAllByA11yHint',
+        queryBy: 'queryByA11yHint',
+        queryAllBy: 'queryAllByA11yHint',
+      },
+      matchStringValue
+    )(instance),
+    ...makeQuery(
+      'accessibilityRole',
+      {
+        getBy: 'getByA11yRole',
+        getAllBy: 'getAllByA11yRole',
+        queryBy: 'queryByA11yRole',
+        queryAllBy: 'queryAllByA11yRole',
+      },
+      matchStringValue
+    )(instance),
+    ...makeQuery(
+      'accessibilityStates',
+      {
+        getBy: 'getByA11yStates',
+        getAllBy: 'getAllByA11yStates',
+        queryBy: 'queryByA11yStates',
+        queryAllBy: 'queryAllByA11yStates',
+      },
+      matchArrayValue
+    )(instance),
+  }: any);
+
+export default a11yAPI;

src/helpers/errors.js

@@ -38,3 +38,7 @@ export const logDeprecationWarning = (
 
   warned[deprecatedFnName] = true;
 };
+
+export const prepareErrorMessage = (error: Error) =>
+  // Strip info about custom predicate
+  error.message.replace(/ matching custom predicate[^]*/gm, '');

src/helpers/getByAPI.js

@@ -5,6 +5,7 @@ import {
   ErrorWithStack,
   createLibraryNotSupportedError,
   logDeprecationWarning,
+  prepareErrorMessage,
 } from './errors';
 
 const filterNodeByType = (node, type) => node.type === type;
@@ -53,10 +54,6 @@ const getTextInputNodeByPlaceholder = (node, placeholder) => {
   }
 };
 
-const prepareErrorMessage = error =>
-  // Strip info about custom predicate
-  error.message.replace(/ matching custom predicate[^]*/gm, '');
-
 export const getByName = (instance: ReactTestInstance) =>
   function getByNameFn(name: string | React.ComponentType<*>) {
     logDeprecationWarning('getByName', 'getByType');

src/helpers/makeQuery.js

@@ -0,0 +1,81 @@
+// @flow
+import { ErrorWithStack, prepareErrorMessage } from './errors';
+
+function getNodeName(node: ReactTestInstance) {
+  return typeof node.type !== 'string'
+    ? node.type.displayName || node.type.name
+    : '';
+}
+
+function isNodeValid(node: ReactTestInstance) {
+  return ['View', 'Text', 'TextInput', 'Image', 'ScrollViewMock'].includes(
+    getNodeName(node)
+  );
+}
+
+const createQueryByError = (error: Error, callsite: Function) => {
+  if (error.message.includes('No instances found')) {
+    return null;
+  }
+  throw new ErrorWithStack(error.message, callsite);
+};
+
+type QueryNames = {
+  getBy: string,
+  getAllBy: string,
+  queryBy: string,
+  queryAllBy: string,
+};
+
+const makeQuery = <P: mixed, M: mixed>(
+  name: string,
+  queryNames: QueryNames,
+  matcherFn: (prop: P, value: M) => boolean
+) => (instance: ReactTestInstance) => {
+  const getBy = (matcher: M) => {
+    try {
+      return instance.find(node =>
+        Boolean(isNodeValid(node) && matcherFn(node.props[name], matcher))
+      );
+    } catch (error) {
+      throw new ErrorWithStack(prepareErrorMessage(error), getBy);
+    }
+  };
+
+  const getAllBy = (matcher: M) => {
+    const results = instance.findAll(node =>
+      Boolean(isNodeValid(node) && matcherFn(node.props[name], matcher))
+    );
+
+    if (results.length === 0) {
+      throw new ErrorWithStack('No instances found', getAllBy);
+    }
+
+    return results;
+  };
+
+  const queryBy = (matcher: M) => {
+    try {
+      return getBy(matcher);
+    } catch (error) {
+      return createQueryByError(error, queryBy);
+    }
+  };
+
+  const queryAllBy = (matcher: M) => {
+    try {
+      return getAllBy(matcher);
+    } catch (error) {
+      return [];
+    }
+  };
+
+  return {
+    [queryNames.getBy]: getBy,
+    [queryNames.getAllBy]: getAllBy,
+    [queryNames.queryBy]: queryBy,
+    [queryNames.queryAllBy]: queryAllBy,
+  };
+};
+
+export default makeQuery;

src/render.js

@@ -4,6 +4,7 @@ import TestRenderer, { type ReactTestRenderer } from 'react-test-renderer'; // e
 import act from './act';
 import { getByAPI } from './helpers/getByAPI';
 import { queryByAPI } from './helpers/queryByAPI';
+import a11yAPI from './helpers/a11yAPI';
 import debugShallow from './helpers/debugShallow';
 import debugDeep from './helpers/debugDeep';
 
@@ -26,6 +27,7 @@ export default function render(
   return {
     ...getByAPI(instance),
     ...queryByAPI(instance),
+    ...a11yAPI(instance),
     update: updateWithAct(renderer),
     rerender: updateWithAct(renderer), // alias for `update`
     unmount: renderer.unmount,