mirror of
https://github.com/callstack/react-native-testing-library.git
synced 2026-09-18 23:09:04 +08:00
chore: reorganize TS test file (#337)
This commit is contained in:
Maciej Jastrzebski
committed by
Michał Pierzchała
Michał Pierzchała
parent
01bc0ee2b4
commit
40ed26812d
+116
-167
@@ -4,7 +4,6 @@ import { ReactTestInstance } from 'react-test-renderer';
|
||||
import {
|
||||
render,
|
||||
fireEvent,
|
||||
shallow,
|
||||
flushMicrotasksQueue,
|
||||
waitFor,
|
||||
act,
|
||||
@@ -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 }),
|
||||
];
|
||||
|
||||
// findBy API tests
|
||||
// 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 }),
|
||||
];
|
||||
|
||||
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 }),
|
||||
@@ -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 }),
|
||||
@@ -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 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 waitForFlush: Promise<any> = flushMicrotasksQueue();
|
||||
|
||||
const waitBy: Promise<ReactTestInstance> = waitFor<ReactTestInstance>(() =>
|
||||
tree.getByA11yLabel('label')
|
||||
);
|
||||
const waitByAll: Promise<ReactTestInstance[]> = waitFor<ReactTestInstance[]>(
|
||||
() => tree.getAllByA11yLabel('label'),
|
||||
{ timeout: 1000, interval: 50 }
|
||||
);
|
||||
|
||||
// act API
|
||||
act(() => {
|
||||
render(<TestComponent />);
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user