@testing-library/react-native 12.2.1 → 12.3.0

package/src/queries/__tests__/labelText.test.tsx

@@ -1,242 +0,0 @@
-import * as React from 'react';
-import { View, Text, TextInput, TouchableOpacity } from 'react-native';
-import { render } from '../..';
-
-const BUTTON_LABEL = 'cool button';
-const BUTTON_HINT = 'click this button';
-const TEXT_LABEL = 'cool text';
-const TEXT_HINT = 'static text';
-// Little hack to make all the methods happy with type
-const NO_MATCHES_TEXT: any = 'not-existent-element';
-
-const getMultipleInstancesFoundMessage = (value: string) => {
-  return `Found multiple elements with accessibilityLabel: ${value}`;
-};
-
-const getNoInstancesFoundMessage = (value: string) => {
-  return `Unable to find an element with accessibilityLabel: ${value}`;
-};
-
-const Typography = ({ children, ...rest }: any) => {
-  return <Text {...rest}>{children}</Text>;
-};
-
-const Button = ({ children }: { children: React.ReactNode }) => (
-  <TouchableOpacity
-    accessibilityHint={BUTTON_HINT}
-    accessibilityLabel={BUTTON_LABEL}
-  >
-    <Typography accessibilityHint={TEXT_HINT} accessibilityLabel={TEXT_LABEL}>
-      {children}
-    </Typography>
-  </TouchableOpacity>
-);
-
-const Section = () => (
-  <>
-    <Typography accessibilityHint={TEXT_HINT} accessibilityLabel={TEXT_LABEL}>
-      Title
-    </Typography>
-    <Button>{TEXT_LABEL}</Button>
-  </>
-);
-
-test('getByLabelText, queryByLabelText, findByLabelText', async () => {
-  const { getByLabelText, queryByLabelText, findByLabelText } = render(
-    <Section />
-  );
-
-  expect(getByLabelText(BUTTON_LABEL).props.accessibilityLabel).toEqual(
-    BUTTON_LABEL
-  );
-  const button = queryByLabelText(/button/g);
-  expect(button?.props.accessibilityLabel).toEqual(BUTTON_LABEL);
-
-  expect(() => getByLabelText(NO_MATCHES_TEXT)).toThrow(
-    getNoInstancesFoundMessage(NO_MATCHES_TEXT)
-  );
-  expect(queryByLabelText(NO_MATCHES_TEXT)).toBeNull();
-
-  expect(() => getByLabelText(TEXT_LABEL)).toThrow(
-    getMultipleInstancesFoundMessage(TEXT_LABEL)
-  );
-  expect(() => queryByLabelText(TEXT_LABEL)).toThrow(
-    getMultipleInstancesFoundMessage(TEXT_LABEL)
-  );
-
-  const asyncButton = await findByLabelText(BUTTON_LABEL);
-  expect(asyncButton.props.accessibilityLabel).toEqual(BUTTON_LABEL);
-  await expect(findByLabelText(NO_MATCHES_TEXT)).rejects.toThrow(
-    getNoInstancesFoundMessage(NO_MATCHES_TEXT)
-  );
-
-  await expect(findByLabelText(TEXT_LABEL)).rejects.toThrow(
-    getMultipleInstancesFoundMessage(TEXT_LABEL)
-  );
-});
-
-test('getAllByLabelText, queryAllByLabelText, findAllByLabelText', async () => {
-  const { getAllByLabelText, queryAllByLabelText, findAllByLabelText } = render(
-    <Section />
-  );
-
-  expect(getAllByLabelText(TEXT_LABEL)).toHaveLength(2);
-  expect(queryAllByLabelText(/cool/g)).toHaveLength(3);
-
-  expect(() => getAllByLabelText(NO_MATCHES_TEXT)).toThrow(
-    getNoInstancesFoundMessage(NO_MATCHES_TEXT)
-  );
-  expect(queryAllByLabelText(NO_MATCHES_TEXT)).toEqual([]);
-
-  await expect(findAllByLabelText(TEXT_LABEL)).resolves.toHaveLength(2);
-  await expect(findAllByLabelText(NO_MATCHES_TEXT)).rejects.toThrow(
-    getNoInstancesFoundMessage(NO_MATCHES_TEXT)
-  );
-});
-
-test('getAllByLabelText, queryAllByLabelText, findAllByLabelText with exact as false', async () => {
-  const { getAllByLabelText, queryAllByLabelText, findAllByLabelText } = render(
-    <Section />
-  );
-
-  expect(getAllByLabelText(TEXT_LABEL, { exact: false })).toHaveLength(2);
-  expect(queryAllByLabelText(/cool/g, { exact: false })).toHaveLength(3);
-
-  expect(() => getAllByLabelText(NO_MATCHES_TEXT, { exact: false })).toThrow(
-    getNoInstancesFoundMessage(NO_MATCHES_TEXT)
-  );
-  expect(queryAllByLabelText(NO_MATCHES_TEXT, { exact: false })).toEqual([]);
-
-  await expect(
-    findAllByLabelText(TEXT_LABEL, { exact: false })
-  ).resolves.toHaveLength(2);
-  await expect(
-    findAllByLabelText(NO_MATCHES_TEXT, { exact: false })
-  ).rejects.toThrow(getNoInstancesFoundMessage(NO_MATCHES_TEXT));
-});
-
-describe('findBy options deprecations', () => {
-  let warnSpy: jest.SpyInstance;
-  beforeEach(() => {
-    warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
-  });
-  afterEach(() => {
-    warnSpy.mockRestore();
-  });
-
-  test('findByText queries warn on deprecated use of WaitForOptions', async () => {
-    const options = { timeout: 10 };
-    // mock implementation to avoid warning in the test suite
-    const view = render(<View />);
-    await expect(
-      view.findByLabelText('Some Text', options)
-    ).rejects.toBeTruthy();
-
-    setTimeout(
-      () => view.rerender(<View accessibilityLabel="Some Text" />),
-      20
-    );
-    await expect(view.findByLabelText('Some Text')).resolves.toBeTruthy();
-
-    expect(warnSpy).toHaveBeenCalledWith(
-      expect.stringContaining('Use of option "timeout"')
-    );
-  }, 20000);
-});
-
-test('byLabelText queries support hidden option', () => {
-  const { getByLabelText, queryByLabelText } = render(
-    <Text accessibilityLabel="hidden" style={{ display: 'none' }}>
-      Hidden from accessibility
-    </Text>
-  );
-
-  expect(
-    getByLabelText('hidden', { includeHiddenElements: true })
-  ).toBeTruthy();
-
-  expect(queryByLabelText('hidden')).toBeFalsy();
-  expect(
-    queryByLabelText('hidden', { includeHiddenElements: false })
-  ).toBeFalsy();
-  expect(() => getByLabelText('hidden', { includeHiddenElements: false }))
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with accessibilityLabel: hidden
-
-    <Text
-      accessibilityLabel="hidden"
-      style={
-        {
-          "display": "none",
-        }
-      }
-    >
-      Hidden from accessibility
-    </Text>"
-  `);
-});
-
-test('getByLabelText supports accessibilityLabelledBy', async () => {
-  const { getByLabelText, getByTestId } = render(
-    <>
-      <Text nativeID="label">Label for input</Text>
-      <TextInput testID="textInput" accessibilityLabelledBy="label" />
-    </>
-  );
-
-  expect(getByLabelText('Label for input')).toBe(getByTestId('textInput'));
-  expect(getByLabelText(/input/)).toBe(getByTestId('textInput'));
-});
-
-test('getByLabelText supports nested accessibilityLabelledBy', async () => {
-  const { getByLabelText, getByTestId } = render(
-    <>
-      <View nativeID="label">
-        <Text>Label for input</Text>
-      </View>
-      <TextInput testID="textInput" accessibilityLabelledBy="label" />
-    </>
-  );
-
-  expect(getByLabelText('Label for input')).toBe(getByTestId('textInput'));
-  expect(getByLabelText(/input/)).toBe(getByTestId('textInput'));
-});
-
-test('error message renders the element tree, preserving only helpful props', async () => {
-  const view = render(<TouchableOpacity accessibilityLabel="LABEL" key="3" />);
-
-  expect(() => view.getByLabelText('FOO')).toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with accessibilityLabel: FOO
-
-    <View
-      accessibilityLabel="LABEL"
-    />"
-  `);
-
-  expect(() => view.getAllByLabelText('FOO'))
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with accessibilityLabel: FOO
-
-    <View
-      accessibilityLabel="LABEL"
-    />"
-  `);
-
-  await expect(view.findByLabelText('FOO')).rejects
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with accessibilityLabel: FOO
-
-    <View
-      accessibilityLabel="LABEL"
-    />"
-  `);
-
-  await expect(view.findAllByLabelText('FOO')).rejects
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with accessibilityLabel: FOO
-
-    <View
-      accessibilityLabel="LABEL"
-    />"
-  `);
-});

package/src/queries/__tests__/makeQueries.test.tsx

@@ -1,235 +0,0 @@
-import * as React from 'react';
-import { Text, TextInput, View } from 'react-native';
-import { render, screen } from '../..';
-
-describe('printing element tree', () => {
-  test('includes element tree on error with less-helpful props stripped', async () => {
-    const { getByText } = render(<Text onPress={() => null}>Some text</Text>);
-
-    expect(() => getByText(/foo/)).toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <Text>
-        Some text
-      </Text>"
-    `);
-  });
-
-  test('prints helpful props but not others', async () => {
-    const { getByText } = render(
-      <View
-        accessibilityElementsHidden
-        accessibilityViewIsModal
-        importantForAccessibility="yes"
-        testID="TEST_ID"
-        nativeID="NATIVE_ID"
-        accessibilityLabel="LABEL"
-        accessibilityLabelledBy="LABELLED_BY"
-        accessibilityRole="summary"
-        accessibilityHint="HINT"
-        key="this is filtered"
-      >
-        <TextInput
-          placeholder="PLACEHOLDER"
-          value="VALUE"
-          defaultValue="DEFAULT_VALUE"
-        />
-        <Text>Some Text</Text>
-      </View>
-    );
-
-    expect(() => getByText(/foo/)).toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View
-        accessibilityElementsHidden={true}
-        accessibilityHint="HINT"
-        accessibilityLabel="LABEL"
-        accessibilityLabelledBy="LABELLED_BY"
-        accessibilityRole="summary"
-        accessibilityViewIsModal={true}
-        importantForAccessibility="yes"
-        nativeID="NATIVE_ID"
-        testID="TEST_ID"
-      >
-        <TextInput
-          defaultValue="DEFAULT_VALUE"
-          placeholder="PLACEHOLDER"
-          value="VALUE"
-        />
-        <Text>
-          Some Text
-        </Text>
-      </View>"
-    `);
-  });
-
-  test('prints tree and filters props with getBy, getAllBy, findBy, findAllBy', async () => {
-    const view = render(
-      <View accessibilityViewIsModal key="this is filtered" />
-    );
-
-    expect(() => view.getByText(/foo/)).toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View
-        accessibilityViewIsModal={true}
-      />"
-    `);
-
-    expect(() => view.getAllByText(/foo/)).toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View
-        accessibilityViewIsModal={true}
-      />"
-    `);
-
-    await expect(view.findByText(/foo/)).rejects
-      .toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View
-        accessibilityViewIsModal={true}
-      />"
-    `);
-
-    await expect(view.findAllByText(/foo/)).rejects
-      .toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View
-        accessibilityViewIsModal={true}
-      />"
-    `);
-  });
-
-  test('only appends element tree on last failure with findBy', async () => {
-    const { findByText } = render(
-      <View accessibilityViewIsModal key="this is filtered" />
-    );
-
-    jest.spyOn(screen, 'toJSON');
-
-    await expect(findByText(/foo/)).rejects.toThrow();
-
-    expect(screen.toJSON).toHaveBeenCalledTimes(1);
-  });
-
-  test('onTimeout with findBy receives error without element tree', async () => {
-    const { findByText } = render(<View />);
-
-    const onTimeout = jest.fn((_: Error) => new Error('Replacement error'));
-
-    await expect(() =>
-      findByText(/foo/, undefined, { onTimeout })
-    ).rejects.toThrowErrorMatchingInlineSnapshot(`"Replacement error"`);
-
-    expect(onTimeout).toHaveBeenCalledTimes(1);
-    expect(onTimeout.mock.calls[0][0].message).not.toMatch(/View/);
-    expect(onTimeout.mock.calls[0][0].message).toMatchInlineSnapshot(
-      `"Unable to find an element with text: /foo/"`
-    );
-  });
-
-  test('onTimeout with findAllBy receives error without element tree', async () => {
-    const { findAllByText } = render(<View />);
-
-    const onTimeout = jest.fn((_: Error) => new Error('Replacement error'));
-
-    await expect(() =>
-      findAllByText(/foo/, undefined, { onTimeout })
-    ).rejects.toThrowErrorMatchingInlineSnapshot(`"Replacement error"`);
-
-    expect(onTimeout).toHaveBeenCalledTimes(1);
-    expect(onTimeout.mock.calls[0][0].message).not.toMatch(/View/);
-    expect(onTimeout.mock.calls[0][0].message).toMatchInlineSnapshot(
-      `"Unable to find an element with text: /foo/"`
-    );
-  });
-
-  test('does not strip display: none from "style" prop, but does strip other styles', () => {
-    const { getByText } = render(
-      <View style={{ display: 'flex', position: 'absolute' }}>
-        <Text
-          style={[
-            { display: 'flex', position: 'relative' },
-            { display: 'none', flex: 1 },
-          ]}
-        >
-          Some text
-        </Text>
-      </View>
-    );
-
-    expect(() => getByText(/foo/)).toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View>
-        <Text
-          style={
-            {
-              "display": "none",
-            }
-          }
-        >
-          Some text
-        </Text>
-      </View>"
-    `);
-  });
-
-  test('strips undefined values from accessibilityState', () => {
-    const { getByText } = render(
-      <View accessibilityState={{ checked: true, busy: false }}>
-        <View accessibilityState={{ checked: undefined }} />
-      </View>
-    );
-
-    expect(() => getByText(/foo/)).toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View
-        accessibilityState={
-          {
-            "busy": false,
-            "checked": true,
-          }
-        }
-      >
-        <View />
-      </View>"
-    `);
-  });
-
-  test('strips undefined values from accessibilityValue', () => {
-    const { getByText } = render(
-      <View accessibilityValue={{ min: 1 }}>
-        <View accessibilityState={{}} />
-      </View>
-    );
-
-    expect(() => getByText(/foo/)).toThrowErrorMatchingInlineSnapshot(`
-      "Unable to find an element with text: /foo/
-
-      <View
-        accessibilityValue={
-          {
-            "min": 1,
-          }
-        }
-      >
-        <View />
-      </View>"
-    `);
-  });
-
-  test('does not render element tree when toJSON() returns null', () => {
-    const view = render(<View />);
-
-    jest.spyOn(screen, 'toJSON').mockImplementation(() => null);
-    expect(() => view.getByText(/foo/)).toThrowErrorMatchingInlineSnapshot(
-      `"Unable to find an element with text: /foo/"`
-    );
-  });
-});

package/src/queries/__tests__/placeholderText.test.tsx

@@ -1,136 +0,0 @@
-import * as React from 'react';
-import { View, TextInput } from 'react-native';
-import { render } from '../..';
-
-const PLACEHOLDER_FRESHNESS = 'Add custom freshness';
-const PLACEHOLDER_CHEF = 'Who inspected freshness?';
-const INPUT_FRESHNESS = 'Custom Freshie';
-const INPUT_CHEF = 'I inspected freshie';
-const DEFAULT_INPUT_CHEF = 'What did you inspect?';
-
-const Banana = () => (
-  <View>
-    <TextInput
-      testID="bananaCustomFreshness"
-      placeholder={PLACEHOLDER_FRESHNESS}
-      value={INPUT_FRESHNESS}
-    />
-    <TextInput
-      testID="bananaChef"
-      placeholder={PLACEHOLDER_CHEF}
-      value={INPUT_CHEF}
-      defaultValue={DEFAULT_INPUT_CHEF}
-    />
-  </View>
-);
-
-test('getByPlaceholderText, queryByPlaceholderText', () => {
-  const { getByPlaceholderText, queryByPlaceholderText } = render(<Banana />);
-  const input = getByPlaceholderText(/custom/i);
-
-  expect(input.props.placeholder).toBe(PLACEHOLDER_FRESHNESS);
-
-  const sameInput = getByPlaceholderText(PLACEHOLDER_FRESHNESS);
-
-  expect(sameInput.props.placeholder).toBe(PLACEHOLDER_FRESHNESS);
-  expect(() => getByPlaceholderText('no placeholder')).toThrow(
-    'Unable to find an element with placeholder: no placeholder'
-  );
-
-  expect(queryByPlaceholderText(/add/i)).toBe(input);
-  expect(queryByPlaceholderText('no placeholder')).toBeNull();
-  expect(() => queryByPlaceholderText(/fresh/)).toThrow(
-    'Found multiple elements with placeholder: /fresh/ '
-  );
-});
-
-test('getAllByPlaceholderText, queryAllByPlaceholderText', () => {
-  const { getAllByPlaceholderText, queryAllByPlaceholderText } = render(
-    <Banana />
-  );
-  const inputs = getAllByPlaceholderText(/fresh/i);
-
-  expect(inputs).toHaveLength(2);
-  expect(() => getAllByPlaceholderText('no placeholder')).toThrow(
-    'Unable to find an element with placeholder: no placeholder'
-  );
-
-  expect(queryAllByPlaceholderText(/fresh/i)).toEqual(inputs);
-  expect(queryAllByPlaceholderText('no placeholder')).toHaveLength(0);
-});
-
-test('byPlaceholderText queries support hidden option', () => {
-  const { getByPlaceholderText, queryByPlaceholderText } = render(
-    <TextInput placeholder="hidden" style={{ display: 'none' }} />
-  );
-
-  expect(
-    getByPlaceholderText('hidden', { includeHiddenElements: true })
-  ).toBeTruthy();
-
-  expect(queryByPlaceholderText('hidden')).toBeFalsy();
-  expect(
-    queryByPlaceholderText('hidden', { includeHiddenElements: false })
-  ).toBeFalsy();
-  expect(() => getByPlaceholderText('hidden', { includeHiddenElements: false }))
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with placeholder: hidden
-
-    <TextInput
-      placeholder="hidden"
-      style={
-        {
-          "display": "none",
-        }
-      }
-    />"
-  `);
-});
-
-test('byPlaceHolderText should return host component', () => {
-  const { getByPlaceholderText } = render(
-    <TextInput placeholder="placeholder" />
-  );
-
-  expect(getByPlaceholderText('placeholder').type).toBe('TextInput');
-});
-
-test('error message renders the element tree, preserving only helpful props', async () => {
-  const view = render(<TextInput placeholder="PLACEHOLDER" key="3" />);
-
-  expect(() => view.getByPlaceholderText('FOO'))
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with placeholder: FOO
-
-    <TextInput
-      placeholder="PLACEHOLDER"
-    />"
-  `);
-
-  expect(() => view.getAllByPlaceholderText('FOO'))
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with placeholder: FOO
-
-    <TextInput
-      placeholder="PLACEHOLDER"
-    />"
-  `);
-
-  await expect(view.findByPlaceholderText('FOO')).rejects
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with placeholder: FOO
-
-    <TextInput
-      placeholder="PLACEHOLDER"
-    />"
-  `);
-
-  await expect(view.findAllByPlaceholderText('FOO')).rejects
-    .toThrowErrorMatchingInlineSnapshot(`
-    "Unable to find an element with placeholder: FOO
-
-    <TextInput
-      placeholder="PLACEHOLDER"
-    />"
-  `);
-});