[v12] refactor: enable all breaking changes (#1313)

* chore: enable all breaking changes

* fix: ci issues

* chore: fix lint

* chore: cleanup

* chore: add migration guide

* chore: update docs

* chore: docs tweaks

* chore: docs tweaks

* chore: remove useBreakingChanges config flag

* refactor: code review changes

* docs: tweaks

Author: mdjastrzebski

src/__tests__/__snapshots__/render.breaking.test.tsx.snap

@@ -6,7 +6,6 @@ import {
 } from '../config';
 
 test('getConfig() returns existing configuration', () => {
-  expect(getConfig().useBreakingChanges).toEqual(false);
   expect(getConfig().asyncUtilTimeout).toEqual(1000);
   expect(getConfig().defaultIncludeHiddenElements).toEqual(true);
 });
@@ -18,7 +17,6 @@ test('configure() overrides existing config values', () => {
     asyncUtilTimeout: 5000,
     defaultDebugOptions: { message: 'debug message' },
     defaultIncludeHiddenElements: true,
-    useBreakingChanges: false,
   });
 });
 
@@ -37,12 +35,12 @@ test('resetToDefaults() resets config to defaults', () => {
 
 test('resetToDefaults() resets internal config to defaults', () => {
   configureInternal({
-    useBreakingChanges: true,
+    hostComponentNames: { text: 'A', textInput: 'A' },
   });
-  expect(getConfig().useBreakingChanges).toEqual(true);
+  expect(getConfig().hostComponentNames).toEqual({ text: 'A', textInput: 'A' });
 
   resetToDefaults();
-  expect(getConfig().useBreakingChanges).toEqual(false);
+  expect(getConfig().hostComponentNames).toBe(undefined);
 });
 
 test('configure handles alias option defaultHidden', () => {

src/__tests__/config.test.ts

@@ -1,13 +1,7 @@
 /* eslint-disable no-console */
 import * as React from 'react';
-import { View, Text, TextInput, Pressable, SafeAreaView } from 'react-native';
-import { render, fireEvent, RenderAPI } from '..';
-
-type ConsoleLogMock = jest.Mock<typeof console.log>;
-
-beforeEach(() => {
-  jest.spyOn(console, 'warn').mockImplementation(() => {});
-});
+import { View, Text, TextInput, Pressable } from 'react-native';
+import { render, screen, fireEvent, RenderAPI } from '..';
 
 const PLACEHOLDER_FRESHNESS = 'Add custom freshness';
 const PLACEHOLDER_CHEF = 'Who inspected freshness?';
@@ -156,7 +150,6 @@ test('unmount should handle cleanup functions', () => {
 
 test('toJSON renders host output', () => {
   const { toJSON } = render(<MyButton>press me</MyButton>);
-
   expect(toJSON()).toMatchSnapshot();
 });
 
@@ -226,38 +219,19 @@ test('returns composite UNSAFE_root', () => {
   expect(UNSAFE_root.props.testID).toBe('inner');
 });
 
-test('returns container', () => {
-  const { container } = render(<View testID="inner" />);
+test('container displays deprecation', () => {
+  const view = render(<View testID="inner" />);
 
-  const mockCalls = (console.warn as any as ConsoleLogMock).mock.calls;
-  expect(mockCalls[0][0]).toMatchInlineSnapshot(`
-    "'container' property is deprecated and has been renamed to 'UNSAFE_root'.
+  expect(() => view.container).toThrowErrorMatchingInlineSnapshot(`
+    "'container' property has been renamed to 'UNSAFE_root'.
 
     Consider using 'root' property which returns root host element."
   `);
+  expect(() => screen.container).toThrowErrorMatchingInlineSnapshot(`
+    "'container' property has been renamed to 'UNSAFE_root'.
 
-  expect(container).toBeDefined();
-  // `View` composite component is returned. This behavior will break if we
-  // start returning only host components.
-  expect(container.type).toBe(View);
-  expect(container.props.testID).toBe('inner');
-});
-
-test('returns wrapper component as container', () => {
-  type WrapperComponentProps = { children: React.ReactNode };
-  const WrapperComponent = ({ children }: WrapperComponentProps) => (
-    <SafeAreaView testID="wrapper">{children}</SafeAreaView>
-  );
-
-  const { container } = render(<View testID="inner" />, {
-    wrapper: WrapperComponent,
-  });
-
-  expect(container).toBeDefined();
-  // `WrapperComponent` composite component is returned with no testID passed to
-  // it. This behavior will break if we start returning only host components.
-  expect(container.type).toBe(WrapperComponent);
-  expect(container.props.testID).not.toBeDefined();
+    Consider using 'root' property which returns root host element."
+  `);
 });
 
 test('RenderAPI type', () => {