refactor: rename rootInstance to baseElement

Author: bcarroll22

src/__tests__/events.js

@@ -6,8 +6,8 @@ import { NativeEvent } from '../events';
 
 test('onChange works', () => {
   const handleChange = jest.fn();
-  const { rootInstance } = render(<TextInput onChange={handleChange} />);
-  fireEvent.change(rootInstance, { target: { value: 'a' } });
+  const { baseElement } = render(<TextInput onChange={handleChange} />);
+  fireEvent.change(baseElement, { target: { value: 'a' } });
   expect(handleChange).toHaveBeenCalledTimes(1);
 });
 
@@ -28,9 +28,9 @@ test('onChangeText works', () => {
 
 test('calling `fireEvent` directly works too', () => {
   const handleEvent = jest.fn();
-  const { rootInstance } = render(<Button onPress={handleEvent} title="test" />);
+  const { baseElement } = render(<Button onPress={handleEvent} title="test" />);
 
-  fireEvent(rootInstance, new NativeEvent('press'));
+  fireEvent(baseElement, new NativeEvent('press'));
   expect(handleEvent).toBeCalledTimes(1);
 });
 
@@ -39,8 +39,8 @@ test('calling a custom event works as well', () => {
   const onMyEvent = jest.fn(({ nativeEvent }) => expect(nativeEvent).toEqual({ value: 'testing' }));
   const MyComponent = ({ onMyEvent }) => <TextInput value="test" onChange={onMyEvent} />;
 
-  const { rootInstance } = render(<MyComponent onMyEvent={onMyEvent} />);
-  fireEvent(rootInstance, new NativeEvent('myEvent', event));
+  const { baseElement } = render(<MyComponent onMyEvent={onMyEvent} />);
+  fireEvent(baseElement, new NativeEvent('myEvent', event));
 
   expect(onMyEvent).toHaveBeenCalledWith({
     nativeEvent: { value: 'testing' },

src/__tests__/render.js

@@ -3,14 +3,13 @@ import { View } from 'react-native';
 import { render } from '../';
 
 test('renders View', () => {
-  const ref = React.createRef();
-  const { rootInstance } = render(<View ref={ref} />);
-  expect(rootInstance.instance).toBe(ref.current);
+  const { baseElement } = render(<View />);
+  expect(baseElement).not.toBeNull();
 });
 
-test('returns rootInstance', () => {
-  const { rootInstance } = render(<View />);
-  expect(rootInstance).toBeTruthy();
+test('returns baseElement', () => {
+  const { baseElement } = render(<View />);
+  expect(baseElement).toBeTruthy();
 });
 
 test('renders options.wrapper around node', () => {

src/__tests__/wait-for-element-to-be-removed.fake-timers.js

@@ -25,9 +25,9 @@ test('requires an unempty array of elements to exist first', () => {
 });
 
 test('times out after 4500ms by default', () => {
-  const { rootInstance } = render(<View />);
+  const { baseElement } = render(<View />);
   const promise = expect(
-    waitForElementToBeRemoved(() => rootInstance),
+    waitForElementToBeRemoved(() => baseElement),
   ).rejects.toThrowErrorMatchingInlineSnapshot(`"Timed out in waitForElementToBeRemoved."`);
 
   jest.advanceTimersByTime(4501);

src/index.js

@@ -19,9 +19,11 @@ function render(ui, { options = {}, wrapper: WrapperComponent } = {}) {
     container = TR.create(wrapUiIfNeeded(ui), options);
   });
 
+  const baseElement = queryHelpers.removeBadProperties(container.root);
+
   return {
     container,
-    rootInstance: container.root,
+    baseElement,
     debug: (el = container) => console.log(prettyPrint(el)),
     unmount: () => container.unmount(),
     rerender: rerenderUi => {

src/queries.js

@@ -4,7 +4,13 @@ import { Text, TextInput } from 'react-native';
 import { getNodeText } from './get-node-text';
 import { waitForElement } from './wait-for-element';
 import { fuzzyMatches, makeNormalizer, matches } from './matches';
-import { getElementError, firstResultOrNull, queryAllByProp, queryByProp } from './query-helpers';
+import {
+  getElementError,
+  firstResultOrNull,
+  queryAllByProp,
+  queryByProp,
+  removeBadProperties,
+} from './query-helpers';
 
 const queryByA11yLabel = queryByProp.bind(null, 'accessibilityLabel');
 const queryAllByA11yLabel = queryAllByProp.bind(null, 'accessibilityLabel');
@@ -22,37 +28,21 @@ function queryAllByText(
   text,
   { types = ['Text', 'TextInput'], exact = true, collapseWhitespace, trim, normalizer } = {},
 ) {
-  const rootInstance = container.root;
+  const baseElement = container.root;
   const matcher = exact ? matches : fuzzyMatches;
   const matchNormalizer = makeNormalizer({ collapseWhitespace, trim, normalizer });
 
   const baseArray = types.reduce(
-    (accumulator, currentValue) => [...accumulator, ...rootInstance.findAllByType(currentValue)],
+    (accumulator, currentValue) => [
+      ...accumulator,
+      ...baseElement.findAll(n => n.type === currentValue),
+    ],
     [],
   );
 
   return [...baseArray]
     .filter(node => matcher(getNodeText(node), node, text, matchNormalizer))
-    .map(node => {
-      // We take the guiding principles seriously around these parts. These methods just let
-      // you do too much unfortunately, and they make it hard to follow the rules of the
-      // testing-library. It's not that we don't trust you, in fact we do trust you! We've
-      // left `findAll` on the instance for you as an emergency escape hatch for when
-      // you're really in a bind. We do want you to test successfully, after all ☺️
-      //
-      // The main intent is to:
-      //   1) Make it hard to assert on implementation details
-      //   2) Force you to consider how to test from a user's perspective
-      //
-      // Of course if you can't figure that out, we still want you to be able to use this library,
-      // so use `findAll`, just use it sparingly! We really believe you can do everything you
-      // need using the query methods provided on the `render` API.
-      ['find', 'findAllByProps', 'findAllByType', 'findByProps', 'findByType', 'instance'].forEach(
-        op => Object.defineProperty(node, op, { get: undefined }),
-      );
-
-      return node;
-    });
+    .map(removeBadProperties);
 }
 
 function queryByText(...args) {

src/query-helpers.js

@@ -38,20 +38,41 @@ function defaultFilter(node) {
   return mockedTypes.includes(node.type);
 }
 
+function removeBadProperties(node) {
+  // We take the guiding principles seriously around these parts. These methods just let
+  // you do too much unfortunately, and they make it hard to follow the rules of the
+  // testing-library. It's not that we don't trust you, in fact we do trust you! We've
+  // left `findAll` on the instance for you as an emergency escape hatch for when
+  // you're really in a bind. We do want you to test successfully, after all ☺️
+  //
+  // The main intent is to:
+  //   1) Make it hard to assert on implementation details
+  //   2) Force you to consider how to test from a user's perspective
+  //
+  // Of course if you can't figure that out, we still want you to be able to use this library,
+  // so use `findAll`, just use it sparingly! We really believe you can do everything you
+  // need using the query methods provided on the `render` API.
+  ['find', 'findAllByProps', 'findAllByType', 'findByProps', 'findByType', 'instance'].forEach(op =>
+    Object.defineProperty(node, op, { get: undefined }),
+  );
+
+  return node;
+}
+
 function queryAllByProp(
   attribute,
   container,
   text,
   { filter, exact = true, collapseWhitespace, trim, normalizer } = {},
 ) {
-  const rootInstance = container.root;
+  const baseElement = container.root;
   const matcher = exact ? matches : fuzzyMatches;
   const matchNormalizer = makeNormalizer({ collapseWhitespace, trim, normalizer });
-  const allNodes = Array.from(rootInstance.findAll(c => c.props[attribute]));
+  const allNodes = Array.from(baseElement.findAll(c => c.props[attribute]));
 
   return allNodes
     .filter((node, index) => (filter ? filter(node, index) : defaultFilter(node, index)))
-    .filter(node => matcher(node.props[attribute], rootInstance, text, matchNormalizer));
+    .filter(node => matcher(node.props[attribute], baseElement, text, matchNormalizer));
 }
 
 function queryByProp(...args) {
@@ -65,4 +86,5 @@ export {
   filterNodeByType,
   queryAllByProp,
   queryByProp,
+  removeBadProperties,
 };