feat: add getByType helper (#64)

* feat: add getByType helper

* add docs

Author: thymikee

README.md

@@ -113,6 +113,14 @@ A method returning a `ReactTestInstance` with matching a React component type. T
 
 A method returning an array of `ReactTestInstance`s with matching a React component type.
 
+### `getByType: (type: React.ComponentType<*>)`
+
+A method returning a `ReactTestInstance` with matching a React component type. Throws when no matches.
+
+### `getAllByType: (type: React.ComponentType<*>)`
+
+A method returning an array of `ReactTestInstance`s with matching a React component type.
+
 ### `getByText: (text: string | RegExp)`
 
 A method returning a `ReactTestInstance` with matching text – may be a string or regular expression. Throws when no matches.

src/__tests__/render.test.js

@@ -96,6 +96,20 @@ test('getAllByName, queryAllByName', () => {
   expect(queryAllByName('InExistent')).toHaveLength(0);
 });
 
+test('getAllByType, queryAllByType', () => {
+  const { getAllByType, queryAllByType } = render(<Banana />);
+  const [text, status, button] = getAllByType(Text);
+  const InExistent = () => null;
+
+  expect(text.props.children).toBe('Is the banana fresh?');
+  expect(status.props.children).toBe('not fresh');
+  expect(button.props.children).toBe('Change freshness!');
+  expect(() => getAllByType(InExistent)).toThrow('No instances found');
+
+  expect(queryAllByType(Text)[1]).toBe(status);
+  expect(queryAllByType(InExistent)).toHaveLength(0);
+});
+
 test('getByText, queryByText', () => {
   const { getByText, queryByText } = render(<Banana />);
   const button = getByText(/change/i);

src/helpers/getByAPI.js

@@ -40,6 +40,15 @@ export const getByName = (instance: ReactTestInstance) =>
     }
   };
 
+export const getByType = (instance: ReactTestInstance) =>
+  function getByTypeFn(type: React.ComponentType<*>) {
+    try {
+      return instance.findByType(type);
+    } catch (error) {
+      throw new ErrorWithStack(prepareErrorMessage(error), getByTypeFn);
+    }
+  };
+
 export const getByText = (instance: ReactTestInstance) =>
   function getByTextFn(text: string | RegExp) {
     try {
@@ -80,6 +89,15 @@ export const getAllByName = (instance: ReactTestInstance) =>
     return results;
   };
 
+export const getAllByType = (instance: ReactTestInstance) =>
+  function getAllByTypeFn(type: React.ComponentType<*>) {
+    const results = instance.findAllByType(type);
+    if (results.length === 0) {
+      throw new ErrorWithStack('No instances found', getAllByTypeFn);
+    }
+    return results;
+  };
+
 export const getAllByText = (instance: ReactTestInstance) =>
   function getAllByTextFn(text: string | RegExp) {
     const results = instance.findAll(node => getNodeByText(node, text));
@@ -107,9 +125,11 @@ export const getAllByProps = (instance: ReactTestInstance) =>
 export const getByAPI = (instance: ReactTestInstance) => ({
   getByTestId: getByTestId(instance),
   getByName: getByName(instance),
+  getByType: getByType(instance),
   getByText: getByText(instance),
   getByProps: getByProps(instance),
   getAllByName: getAllByName(instance),
+  getAllByType: getAllByType(instance),
   getAllByText: getAllByText(instance),
   getAllByProps: getAllByProps(instance),
 });

src/helpers/queryByAPI.js

@@ -3,9 +3,11 @@ import * as React from 'react';
 import {
   getByTestId,
   getByName,
+  getByType,
   getByText,
   getByProps,
   getAllByName,
+  getAllByType,
   getAllByText,
   getAllByProps,
 } from './getByAPI';
@@ -20,6 +22,16 @@ export const queryByName = (instance: ReactTestInstance) => (
   }
 };
 
+export const queryByType = (instance: ReactTestInstance) => (
+  type: React.ComponentType<*>
+) => {
+  try {
+    return getByType(instance)(type);
+  } catch (error) {
+    return null;
+  }
+};
+
 export const queryByText = (instance: ReactTestInstance) => (
   text: string | RegExp
 ) => {
@@ -60,6 +72,16 @@ export const queryAllByName = (instance: ReactTestInstance) => (
   }
 };
 
+export const queryAllByType = (instance: ReactTestInstance) => (
+  type: React.ComponentType<*>
+) => {
+  try {
+    return getAllByType(instance)(type);
+  } catch (error) {
+    return [];
+  }
+};
+
 export const queryAllByText = (instance: ReactTestInstance) => (
   text: string | RegExp
 ) => {
@@ -83,9 +105,11 @@ export const queryAllByProps = (instance: ReactTestInstance) => (props: {
 export const queryByAPI = (instance: ReactTestInstance) => ({
   queryByTestId: queryByTestId(instance),
   queryByName: queryByName(instance),
+  queryByType: queryByType(instance),
   queryByText: queryByText(instance),
   queryByProps: queryByProps(instance),
   queryAllByName: queryAllByName(instance),
+  queryAllByType: queryAllByType(instance),
   queryAllByText: queryAllByText(instance),
   queryAllByProps: queryAllByProps(instance),
 });

typings/__tests__/index.test.tsx

@@ -23,6 +23,7 @@ const tree = render(<TestComponent />);
 // getByAPI tests
 const getByNameString: ReactTestInstance = tree.getByName('View');
 const getByNameContructor: ReactTestInstance = tree.getByName(View);
+const getByType: ReactTestInstance = tree.getByType(View);
 const getByTextString: ReactTestInstance = tree.getByText('<View />');
 const getByTextRegExp: ReactTestInstance = tree.getByText(/View/g);
 const getByProps: ReactTestInstance = tree.getByProps({ value: 2 });
@@ -31,6 +32,7 @@ const getAllByNameString: Array<ReactTestInstance> = tree.getAllByName('View');
 const getAllByNameConstructor: Array<ReactTestInstance> = tree.getAllByName(
   View
 );
+const getAllByType: Array<ReactTestInstance> = tree.getAllByType(View);
 const getAllByTextString: Array<ReactTestInstance> = tree.getAllByText(
   '<View />'
 );
@@ -42,6 +44,7 @@ const getAllByProps: Array<ReactTestInstance> = tree.getAllByProps({
 // queuryByAPI tests
 const queryByNameString: ReactTestInstance | null = tree.queryByName('View');
 const queryByNameConstructor: ReactTestInstance | null = tree.queryByName(View);
+const queryByType: ReactTestInstance | null = tree.queryByType(View);
 const queryByTextString: ReactTestInstance | null = tree.queryByText(
   '<View />'
 );
@@ -54,6 +57,7 @@ const queryAllByNameString: Array<ReactTestInstance> = tree.getAllByName(
 const queryAllByNameConstructor: Array<ReactTestInstance> = tree.getAllByName(
   View
 );
+const queryAllByType: Array<ReactTestInstance> = tree.getAllByType(View);
 const queryAllByTextString: Array<ReactTestInstance> = tree.queryAllByText(
   'View'
 );

typings/index.d.ts

@@ -3,20 +3,24 @@ import { ReactTestInstance, ReactTestRendererJSON } from 'react-test-renderer';
 
 export interface GetByAPI {
   getByName: (name: React.ReactType) => ReactTestInstance;
+  getByType: (type: React.ComponentType) => ReactTestInstance;
   getByText: (text: string | RegExp) => ReactTestInstance;
   getByProps: (props: Record<string, any>) => ReactTestInstance;
   getByTestId: (testID: string) => ReactTestInstance;
   getAllByName: (name: React.ReactType) => Array<ReactTestInstance>;
+  getAllByType: (type: React.ComponentType) => Array<ReactTestInstance>;
   getAllByText: (text: string | RegExp) => Array<ReactTestInstance>;
   getAllByProps: (props: Record<string, any>) => Array<ReactTestInstance>;
 }
 
 export interface QueryByAPI {
   queryByName: (name: React.ReactType) => ReactTestInstance | null;
+  queryByType: (type: React.ComponentType) => ReactTestInstance | null;
   queryByText: (name: string | RegExp) => ReactTestInstance | null;
   queryByProps: (props: Record<string, any>) => ReactTestInstance | null;
   queryByTestId: (testID: string) => ReactTestInstance | null;
   queryAllByName: (name: React.ReactType) => Array<ReactTestInstance> | [];
+  queryAllByType: (type: React.ComponentType) => Array<ReactTestInstance> | [];
   queryAllByText: (text: string | RegExp) => Array<ReactTestInstance> | [];
   queryAllByProps: (
     props: Record<string, any>