[RTR] Add usage warning behind flag

Author: Jack Pope

packages/react-test-renderer/shallow.js

@@ -4,7 +4,24 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
  */
 
-export {default} from 'react-shallow-renderer';
+import ReactShallowRenderer from 'react-shallow-renderer';
+import {enableReactTestRendererWarning} from 'shared/ReactFeatureFlags';
+
+const emptyObject = {};
+
+export default class ReactShallowRendererWithWarning extends ReactShallowRenderer {
+  render(element, context = emptyObject) {
+    if (__DEV__) {
+      if (enableReactTestRendererWarning === true) {
+        console.warn(
+          "React's Shallow Renderer export will be removed in a future release. " +
+            'Please use @testing-library/react instead.',
+        );
+      }
+    }
+
+    return super.render(element, context);
+  }
+}

packages/react-test-renderer/src/ReactTestRenderer.js

@@ -52,7 +52,10 @@ import {checkPropStringCoercion} from 'shared/CheckStringCoercion';
 
 import {getPublicInstance} from './ReactFiberConfigTestHost';
 import {ConcurrentRoot, LegacyRoot} from 'react-reconciler/src/ReactRootTags';
-import {allowConcurrentByDefault} from 'shared/ReactFeatureFlags';
+import {
+  allowConcurrentByDefault,
+  enableReactTestRendererWarning,
+} from 'shared/ReactFeatureFlags';
 
 const act = React.unstable_act;
 
@@ -471,6 +474,15 @@ function create(
   getInstance(): React$Component<any, any> | PublicInstance | null,
   unstable_flushSync: typeof flushSync,
 } {
+  if (__DEV__) {
+    if (enableReactTestRendererWarning === true) {
+      console.warn(
+        'Support for ReactTestRenderer will be removed in a future release. ' +
+          'Please use @testing-library/react instead.',
+      );
+    }
+  }
+
   let createNodeMock = defaultTestOptions.createNodeMock;
   let isConcurrent = false;
   let isStrictMode = false;

packages/react-test-renderer/src/__tests__/ReactTestRenderer-test.internal.js

@@ -51,6 +51,21 @@ function cleanNodeOrArray(node) {
 }
 
 describe('ReactTestRenderer', () => {
+  beforeEach(() => {
+    jest.resetModules();
+    ReactFeatureFlags.enableReactTestRendererWarning = false;
+  });
+
+  it('should warn if enableReactTestRendererWarning is enabled', () => {
+    ReactFeatureFlags.enableReactTestRendererWarning = true;
+    expect(() => {
+      ReactTestRenderer.create(<div />);
+    }).toWarnDev(
+      'Warning: Support for ReactTestRenderer will be removed in a future release. Please use @testing-library/react instead.',
+      {withoutStack: true},
+    );
+  });
+
   it('renders a simple component', () => {
     function Link() {
       return <a role="link" />;

packages/react-test-renderer/src/__tests__/ShallowRenderer-test.internal.js

@@ -0,0 +1,44 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @emails react-core
+ */
+
+'use strict';
+
+let React;
+let ReactShallowRenderer;
+let ReactFeatureFlags;
+
+function HelloWorld() {
+  return <h1>Hello, world!</h1>;
+}
+
+describe('ShallowRenderer', () => {
+  beforeEach(() => {
+    jest.resetModules();
+    ReactFeatureFlags = require('shared/ReactFeatureFlags');
+    React = require('react');
+    ReactShallowRenderer = require('../../shallow.js').default;
+  });
+
+  it('should render without warnings without enableReactTestRendererWarning', () => {
+    ReactFeatureFlags.enableReactTestRendererWarning = false;
+    const renderer = new ReactShallowRenderer();
+    expect(renderer.render(<HelloWorld />)).toMatchSnapshot();
+  });
+
+  it('should render with warnings with enableReactTestRendererWarning', () => {
+    ReactFeatureFlags.enableReactTestRendererWarning = true;
+    const renderer = new ReactShallowRenderer();
+    expect(() => {
+      renderer.render(<HelloWorld />);
+    }).toWarnDev(
+      "Warning: React's Shallow Renderer export will be removed in a future release. Please use @testing-library/react instead.",
+      {withoutStack: true},
+    );
+  });
+});

packages/shared/ReactFeatureFlags.js

@@ -162,6 +162,9 @@ export const enableUnifiedSyncLane = true;
 // Adds an opt-in to time slicing for updates that aren't wrapped in startTransition.
 export const allowConcurrentByDefault = false;
 
+// Warn on any usage of ReactTestRenderer
+export const enableReactTestRendererWarning = false;
+
 // -----------------------------------------------------------------------------
 // React DOM Chopping Block
 //

packages/shared/forks/ReactFeatureFlags.native-fb.js

@@ -96,5 +96,7 @@ export const enableFizzExternalRuntime = false;
 export const enableAsyncActions = false;
 export const enableUseDeferredValueInitialArg = true;
 
+export const enableReactTestRendererWarning = false;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);

packages/shared/forks/ReactFeatureFlags.native-oss.js

@@ -87,5 +87,7 @@ export const useMicrotasksForSchedulingInFabric = false;
 export const passChildrenWhenCloningPersistedNodes = false;
 export const enableUseDeferredValueInitialArg = __EXPERIMENTAL__;
 
+export const enableReactTestRendererWarning = false;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);

packages/shared/forks/ReactFeatureFlags.test-renderer.js

@@ -87,5 +87,7 @@ export const useMicrotasksForSchedulingInFabric = false;
 export const passChildrenWhenCloningPersistedNodes = false;
 export const enableUseDeferredValueInitialArg = __EXPERIMENTAL__;
 
+export const enableReactTestRendererWarning = false;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);

packages/shared/forks/ReactFeatureFlags.test-renderer.native.js

@@ -84,5 +84,7 @@ export const useMicrotasksForSchedulingInFabric = false;
 export const passChildrenWhenCloningPersistedNodes = false;
 export const enableUseDeferredValueInitialArg = __EXPERIMENTAL__;
 
+export const enableReactTestRendererWarning = false;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);

packages/shared/forks/ReactFeatureFlags.test-renderer.www.js

@@ -87,5 +87,7 @@ export const useMicrotasksForSchedulingInFabric = false;
 export const passChildrenWhenCloningPersistedNodes = false;
 export const enableUseDeferredValueInitialArg = true;
 
+export const enableReactTestRendererWarning = false;
+
 // Flow magic to verify the exports of this file match the original version.
 ((((null: any): ExportsType): FeatureFlagsType): ExportsType);