From 79afe1a27e616179225d4ad662d5708ba53d6677 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Pierzcha=C5=82a?= Date: Sun, 18 Nov 2018 15:38:59 +0100 Subject: [PATCH 1/2] feat: add getByType helper --- src/__tests__/render.test.js | 14 ++++++++++++++ src/helpers/getByAPI.js | 20 ++++++++++++++++++++ src/helpers/queryByAPI.js | 24 ++++++++++++++++++++++++ typings/__tests__/index.test.tsx | 4 ++++ typings/index.d.ts | 4 ++++ 5 files changed, 66 insertions(+) diff --git a/src/__tests__/render.test.js b/src/__tests__/render.test.js index 91365fffe..bb21a21be 100644 --- a/src/__tests__/render.test.js +++ b/src/__tests__/render.test.js @@ -96,6 +96,20 @@ test('getAllByName, queryAllByName', () => { expect(queryAllByName('InExistent')).toHaveLength(0); }); +test('getAllByType, queryAllByType', () => { + const { getAllByType, queryAllByType } = render(); + 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(); const button = getByText(/change/i); diff --git a/src/helpers/getByAPI.js b/src/helpers/getByAPI.js index 8af8fa860..5d8d38d92 100644 --- a/src/helpers/getByAPI.js +++ b/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), }); diff --git a/src/helpers/queryByAPI.js b/src/helpers/queryByAPI.js index 8a8f0a954..b9f58d840 100644 --- a/src/helpers/queryByAPI.js +++ b/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), }); diff --git a/typings/__tests__/index.test.tsx b/typings/__tests__/index.test.tsx index 7446554d1..cafc8f946 100644 --- a/typings/__tests__/index.test.tsx +++ b/typings/__tests__/index.test.tsx @@ -23,6 +23,7 @@ const tree = render(); // 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(''); const getByTextRegExp: ReactTestInstance = tree.getByText(/View/g); const getByProps: ReactTestInstance = tree.getByProps({ value: 2 }); @@ -31,6 +32,7 @@ const getAllByNameString: Array = tree.getAllByName('View'); const getAllByNameConstructor: Array = tree.getAllByName( View ); +const getAllByType: Array = tree.getAllByType(View); const getAllByTextString: Array = tree.getAllByText( '' ); @@ -42,6 +44,7 @@ const getAllByProps: Array = 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( '' ); @@ -54,6 +57,7 @@ const queryAllByNameString: Array = tree.getAllByName( const queryAllByNameConstructor: Array = tree.getAllByName( View ); +const queryAllByType: Array = tree.getAllByType(View); const queryAllByTextString: Array = tree.queryAllByText( 'View' ); diff --git a/typings/index.d.ts b/typings/index.d.ts index 15b2d02d4..9522137c6 100644 --- a/typings/index.d.ts +++ b/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) => ReactTestInstance; getByTestId: (testID: string) => ReactTestInstance; getAllByName: (name: React.ReactType) => Array; + getAllByType: (type: React.ComponentType) => Array; getAllByText: (text: string | RegExp) => Array; getAllByProps: (props: Record) => Array; } export interface QueryByAPI { queryByName: (name: React.ReactType) => ReactTestInstance | null; + queryByType: (type: React.ComponentType) => ReactTestInstance | null; queryByText: (name: string | RegExp) => ReactTestInstance | null; queryByProps: (props: Record) => ReactTestInstance | null; queryByTestId: (testID: string) => ReactTestInstance | null; queryAllByName: (name: React.ReactType) => Array | []; + queryAllByType: (type: React.ComponentType) => Array | []; queryAllByText: (text: string | RegExp) => Array | []; queryAllByProps: ( props: Record From bc4bca5077f51d0b766c1bf5199358359567e600 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Pierzcha=C5=82a?= Date: Mon, 19 Nov 2018 13:44:05 +0100 Subject: [PATCH 2/2] add docs --- README.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/README.md b/README.md index 586658ca5..da11f50bd 100644 --- a/README.md +++ b/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.