Skip to content

Commit

Permalink
chore: reorganize TS test file (#337)
Browse files Browse the repository at this point in the history
  • Loading branch information
mdjastrzebski committed May 20, 2020
1 parent 25f2701 commit 3ef0064
Showing 1 changed file with 116 additions and 167 deletions.
283 changes: 116 additions & 167 deletions typings/__tests__/index.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import { ReactTestInstance } from 'react-test-renderer';
import {
render,
fireEvent,
shallow,
flushMicrotasksQueue,
waitFor,
act,
Expand All @@ -31,86 +30,89 @@ const TestComponent = () => (

const tree = render(<TestComponent />);

// getByAPI tests
const getByType: ReactTestInstance = tree.UNSAFE_getByType(View);
const getByTypeWithRequiredProps: ReactTestInstance = tree.UNSAFE_getByType(
ElementWithRequiredProps
);
const getByTextString: ReactTestInstance = tree.getByText('<View />');
const getByTextRegExp: ReactTestInstance = tree.getByText(/View/g);
const getByPlaceholderString: ReactTestInstance = tree.getByPlaceholder(
'my placeholder'
);
const getByPlaceholderRegExp: ReactTestInstance = tree.getByPlaceholder(
/placeholder/g
);
const getByDisplayValueString: ReactTestInstance = tree.getByDisplayValue(
'my value'
);
const getByDisplayValueRegExp: ReactTestInstance = tree.getByDisplayValue(
/value/g
);
const getByProps: ReactTestInstance = tree.UNSAFE_getByProps({ value: 2 });
const getByTestId: ReactTestInstance = tree.getByTestId('test-id');
const getAllByTestId: ReactTestInstance[] = tree.getAllByTestId('test-id');
const getAllByType: Array<ReactTestInstance> = tree.UNSAFE_getAllByType(View);
const getAllByTypeWithRequiredProps: Array<ReactTestInstance> = tree.UNSAFE_getAllByType(
ElementWithRequiredProps
);
const getAllByTextString: Array<ReactTestInstance> = tree.getAllByText(
'<View />'
);
const getAllByTextRegExp: Array<ReactTestInstance> = tree.getAllByText(/Text/g);
const getAllByProps: Array<ReactTestInstance> = tree.UNSAFE_getAllByProps({
value: 2,
});
// getBy API
const getBy: ReactTestInstance[] = [
tree.getByText('<View />'),
tree.getByText(/View/g),
tree.getByPlaceholder('my placeholder'),
tree.getByPlaceholder(/placeholder/g),
tree.getByDisplayValue('my value'),
tree.getByDisplayValue(/value/g),
tree.getByTestId('test-id'),
tree.getByA11yLabel('label'),
tree.getByA11yHint('label'),
tree.getByA11yRole('button'),
tree.getByA11yStates('selected'),
tree.getByA11yStates(['selected']),
tree.getByA11yState({ busy: true }),
tree.getByA11yValue({ min: 10 }),
tree.UNSAFE_getByType(View),
tree.UNSAFE_getByType(ElementWithRequiredProps),
tree.UNSAFE_getByProps({ value: 2 }),
];

// queuryByAPI tests
const queryByType: ReactTestInstance | null = tree.UNSAFE_queryByType(View);
const queryByTypeWithRequiredProps: ReactTestInstance | null = tree.UNSAFE_queryByType(
ElementWithRequiredProps
);
const queryByTextString: ReactTestInstance | null = tree.queryByText('View');
const queryByTextRegExp: ReactTestInstance | null = tree.queryByText(/View/g);
const queryByPlaceholderString: ReactTestInstance | null = tree.queryByPlaceholder(
'my placeholder'
);
const queryByPlaceholderRegExp: ReactTestInstance | null = tree.queryByPlaceholder(
/placeholder/g
);
const queryByDisplayValueString: ReactTestInstance | null = tree.queryByDisplayValue(
'my value'
);
const queryByDisplayValueRegExp: ReactTestInstance | null = tree.queryByDisplayValue(
/value/g
);
const queryByProps: ReactTestInstance | null = tree.UNSAFE_queryByProps({
value: 2,
});
const queryByTestId: ReactTestInstance | null = tree.queryByTestId('test-id');
const queryAllByTestId: ReactTestInstance[] | null = tree.queryAllByTestId(
'test-id'
);
const queryAllByType: Array<ReactTestInstance> = tree.UNSAFE_queryAllByType(
View
);
const queryAllByTypeWithRequiredProps: Array<ReactTestInstance> = tree.UNSAFE_queryAllByType(
ElementWithRequiredProps
);
const queryAllByTextString: Array<ReactTestInstance> = tree.queryAllByText(
'View'
);
const queryAllByTextRegExp: Array<ReactTestInstance> = tree.queryAllByText(
/View/g
);
const queryAllByDisplayValueString: Array<ReactTestInstance> = tree.queryAllByDisplayValue(
'View'
);
const queryAllByDisplayValueRegExp: Array<ReactTestInstance> = tree.queryAllByDisplayValue(
/View/g
);
const getAllBy: ReactTestInstance[][] = [
tree.getAllByText('<View />'),
tree.getAllByText(/Text/g),
tree.getAllByPlaceholder('my placeholder'),
tree.getAllByPlaceholder(/placeholder/g),
tree.getAllByDisplayValue('my value'),
tree.getAllByDisplayValue(/value/g),
tree.getAllByTestId('test-id'),
tree.getAllByA11yLabel('label'),
tree.getAllByA11yHint('label'),
tree.getAllByA11yRole('button'),
tree.getAllByA11yStates('selected'),
tree.getAllByA11yStates(['selected']),
tree.getAllByA11yState({ busy: true }),
tree.getAllByA11yValue({ min: 10 }),
tree.UNSAFE_getAllByType(View),
tree.UNSAFE_getAllByType(ElementWithRequiredProps),
tree.UNSAFE_getAllByProps({ value: 2 }),
];

// queryBy API
const queryBy: Array<ReactTestInstance | null> = [
tree.queryByText('View'),
tree.queryByText(/View/g),
tree.queryByPlaceholder('my placeholder'),
tree.queryByPlaceholder(/placeholder/g),
tree.queryByDisplayValue('my value'),
tree.queryByDisplayValue(/value/g),
tree.queryByTestId('test-id'),
tree.queryByA11yHint('label'),
tree.queryByA11yLabel('label'),
tree.queryByA11yRole('button'),
tree.queryByA11yStates('selected'),
tree.queryByA11yStates(['selected']),
tree.queryByA11yState({ busy: true }),
tree.queryByA11yValue({ min: 10 }),
tree.UNSAFE_queryByType(View),
tree.UNSAFE_queryByType(ElementWithRequiredProps),
tree.UNSAFE_queryByProps({ value: 2 }),
];

// findBy API tests
const queryAllBy: ReactTestInstance[][] = [
tree.queryAllByText('View'),
tree.queryAllByText(/View/g),
tree.queryAllByPlaceholder('my placeholder'),
tree.queryAllByPlaceholder(/placeholder/g),
tree.queryAllByDisplayValue('my value'),
tree.queryAllByDisplayValue(/value/g),
tree.queryAllByTestId('test-id'),
tree.queryAllByA11yLabel('label'),
tree.queryAllByA11yHint('label'),
tree.queryAllByA11yRole('button'),
tree.queryAllByA11yStates('selected'),
tree.queryAllByA11yStates(['selected']),
tree.queryAllByA11yState({ busy: true }),
tree.queryAllByA11yValue({ min: 10 }),
tree.UNSAFE_queryAllByType(View),
tree.UNSAFE_queryAllByType(ElementWithRequiredProps),
tree.UNSAFE_queryAllByProps({ value: 2 }),
];

// findBy API
const findBy: Promise<ReactTestInstance>[] = [
tree.findByText('View'),
tree.findByText('View', { timeout: 10, interval: 10 }),
Expand Down Expand Up @@ -153,6 +155,8 @@ const findAllBy: Promise<ReactTestInstance[]>[] = [
tree.findAllByDisplayValue(/View/g, { timeout: 10, interval: 10 }),
tree.findAllByTestId('test-id'),
tree.findAllByTestId('test-id', { timeout: 10, interval: 10 }),
tree.findAllByA11yLabel('label'),
tree.findAllByA11yLabel('label', { timeout: 10, interval: 10 }),
tree.findAllByA11yHint('label'),
tree.findAllByA11yHint('label', { timeout: 10, interval: 10 }),
tree.findAllByA11yState({ busy: true }),
Expand All @@ -161,105 +165,50 @@ const findAllBy: Promise<ReactTestInstance[]>[] = [
tree.findAllByA11yValue({ min: 10 }, { timeout: 10, interval: 10 }),
];

// Accessibility queries
const getByA11yLabel: ReactTestInstance = tree.getByA11yLabel('label');
const getAllByA11yLabel: Array<ReactTestInstance> = tree.getAllByA11yLabel(
'label'
);
const queryByA11yLabel: ReactTestInstance = tree.queryByA11yLabel('label');
const queryAllByA11yLabel: Array<ReactTestInstance> = tree.queryAllByA11yLabel(
'label'
);

const getByA11yHint: ReactTestInstance = tree.getByA11yHint('label');
const getAllByA11yHint: Array<ReactTestInstance> = tree.getAllByA11yHint(
'label'
);
const queryByA11yHint: ReactTestInstance = tree.queryByA11yHint('label');
const queryAllByA11yHint: Array<ReactTestInstance> = tree.queryAllByA11yHint(
'label'
);

const getByA11yRole: ReactTestInstance = tree.getByA11yRole('button');
const getAllByA11yRole: Array<ReactTestInstance> = tree.getAllByA11yRole(
'button'
);
const queryByA11yRole: ReactTestInstance = tree.queryByA11yRole('button');
const queryAllByA11yRole: Array<ReactTestInstance> = tree.queryAllByA11yRole(
'button'
);

const getByA11yStates: ReactTestInstance = tree.getByA11yStates('selected');
const getByA11yStatesArray: ReactTestInstance = tree.getByA11yStates([
'selected',
]);
const getAllByA11yStates: Array<ReactTestInstance> = tree.getAllByA11yStates(
'selected'
);
const getAllByA11yStatesArray: Array<ReactTestInstance> = tree.getAllByA11yStates(
['selected']
);
const queryByA11yStates: ReactTestInstance = tree.queryByA11yStates('selected');
const queryByA11yStatesArray: ReactTestInstance = tree.queryByA11yStates([
'selected',
]);
const queryAllByA11yStates: Array<ReactTestInstance> = tree.queryAllByA11yStates(
'selected'
);
const queryAllByA11yStatesArray: Array<ReactTestInstance> = tree.queryAllByA11yStates(
['selected']
);

const getByA11yState: ReactTestInstance = tree.getByA11yState({ busy: true });
const getAllByA11yState: Array<ReactTestInstance> = tree.getAllByA11yState({
busy: true,
});
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,
});

// debug API
const debugFn = tree.debug();
const debugFnWithMessage = tree.debug('my message');

// update API
tree.update(<View />);
tree.rerender(<View />);
tree.unmount();

// fireEvent API tests
fireEvent(getByA11yLabel, 'press');
fireEvent(getByA11yLabel, 'press', 'data');
fireEvent(getByA11yLabel, 'press', 'param1', 'param2');
fireEvent.press(getByA11yLabel);
fireEvent.changeText(getByA11yLabel, 'string');
fireEvent.scroll(getByA11yLabel, 'eventData');
// fireEvent API
const element: ReactTestInstance = tree.getByText('text');
fireEvent(element, 'press');
fireEvent(element, 'press', 'data');
fireEvent(element, 'press', 'param1', 'param2');
fireEvent.press(element);
fireEvent.changeText(element, 'string');
fireEvent.scroll(element, 'eventData');

// shallow API
const shallowTree: { output: React.ReactElement<any> } = shallow(
<TestComponent />
);
// waitFor API
const waitGetBy: Promise<ReactTestInstance>[] = [
waitFor<ReactTestInstance>(() => tree.getByA11yLabel('label')),
waitFor<ReactTestInstance>(() => tree.getByA11yLabel('label'), {
timeout: 10,
}),
waitFor<ReactTestInstance>(() => tree.getByA11yLabel('label'), {
timeout: 100,
interval: 10,
}),
];

const waitForFlush: Promise<any> = flushMicrotasksQueue();
const waitGetAllBy: Promise<ReactTestInstance[]>[] = [
waitFor<ReactTestInstance[]>(() => tree.getAllByA11yLabel('label')),
waitFor<ReactTestInstance[]>(() => tree.getAllByA11yLabel('label'), {
timeout: 10,
}),
waitFor<ReactTestInstance[]>(() => tree.getAllByA11yLabel('label'), {
timeout: 100,
interval: 10,
}),
];

const waitBy: Promise<ReactTestInstance> = waitFor<ReactTestInstance>(() =>
tree.getByA11yLabel('label')
);
const waitByAll: Promise<ReactTestInstance[]> = waitFor<ReactTestInstance[]>(
() => tree.getAllByA11yLabel('label'),
{ timeout: 1000, interval: 50 }
);
const waitForFlush: Promise<any> = flushMicrotasksQueue();

// act API
act(() => {
render(<TestComponent />);
});
Expand Down

0 comments on commit 3ef0064

Please sign in to comment.