Add React.createFactory() deprecation warning (#17878)

facebook · Jan 21, 2020 · f2fd484 · f2fd484
1 parent 0c04aca
commit f2fd484
Show file tree

Hide file tree

Showing 5 changed files with 71 additions and 8 deletions.
diff --git a/packages/react-is/src/__tests__/ReactIs-test.js b/packages/react-is/src/__tests__/ReactIs-test.js
@@ -57,9 +57,16 @@ describe('ReactIs', () => {
     expect(ReactIs.isValidElementType(Context.Provider)).toEqual(true);
     expect(ReactIs.isValidElementType(Context.Consumer)).toEqual(true);
     if (!ReactFeatureFlags.disableCreateFactory) {
-      expect(ReactIs.isValidElementType(React.createFactory('div'))).toEqual(
-        true,
+      let factory;
+      expect(() => {
+        factory = React.createFactory('div');
+      }).toWarnDev(
+        'Warning: React.createFactory() is deprecated and will be removed in a ' +
+          'future major release. Consider using JSX or use React.createElement() ' +
+          'directly instead.',
+        {withoutStack: true},
       );
+      expect(ReactIs.isValidElementType(factory)).toEqual(true);
     }
     expect(ReactIs.isValidElementType(React.Fragment)).toEqual(true);
     expect(ReactIs.isValidElementType(React.StrictMode)).toEqual(true);

diff --git a/packages/react/src/ReactElementValidator.js b/packages/react/src/ReactElementValidator.js
@@ -473,11 +473,21 @@ export function createElementWithValidation(type, props, children) {
   return element;
 }
 
+let didWarnAboutDeprecatedCreateFactory = false;
+
 export function createFactoryWithValidation(type) {
   const validatedFactory = createElementWithValidation.bind(null, type);
   validatedFactory.type = type;
-  // Legacy hook: remove it
   if (__DEV__) {
+    if (!didWarnAboutDeprecatedCreateFactory) {
+      didWarnAboutDeprecatedCreateFactory = true;
+      console.warn(
+        'React.createFactory() is deprecated and will be removed in ' +
+          'a future major release. Consider using JSX ' +
+          'or use React.createElement() directly instead.',
+      );
+    }
+    // Legacy hook: remove it
     Object.defineProperty(validatedFactory, 'type', {
       enumerable: false,
       get: function() {

diff --git a/packages/react/src/__tests__/ReactElement-test.js b/packages/react/src/__tests__/ReactElement-test.js
@@ -313,7 +313,16 @@ describe('ReactElement', () => {
     expect(React.isValidElement({})).toEqual(false);
     expect(React.isValidElement('string')).toEqual(false);
     if (!ReactFeatureFlags.disableCreateFactory) {
-      expect(React.isValidElement(React.createFactory('div'))).toEqual(false);
+      let factory;
+      expect(() => {
+        factory = React.createFactory('div');
+      }).toWarnDev(
+        'Warning: React.createFactory() is deprecated and will be removed in a ' +
+          'future major release. Consider using JSX or use React.createElement() ' +
+          'directly instead.',
+        {withoutStack: true},
+      );
+      expect(React.isValidElement(factory)).toEqual(false);
     }
     expect(React.isValidElement(Component)).toEqual(false);
     expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);
@@ -473,7 +482,16 @@ describe('ReactElement', () => {
     expect(React.isValidElement({})).toEqual(false);
     expect(React.isValidElement('string')).toEqual(false);
     if (!ReactFeatureFlags.disableCreateFactory) {
-      expect(React.isValidElement(React.createFactory('div'))).toEqual(false);
+      let factory;
+      expect(() => {
+        factory = React.createFactory('div');
+      }).toWarnDev(
+        'Warning: React.createFactory() is deprecated and will be removed in a ' +
+          'future major release. Consider using JSX or use React.createElement() ' +
+          'directly instead.',
+        {withoutStack: true},
+      );
+      expect(React.isValidElement(factory)).toEqual(false);
     }
     expect(React.isValidElement(Component)).toEqual(false);
     expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);

diff --git a/packages/react/src/__tests__/ReactElementJSX-test.internal.js b/packages/react/src/__tests__/ReactElementJSX-test.internal.js
@@ -69,7 +69,16 @@ describe('ReactElement.jsx', () => {
     expect(React.isValidElement({})).toEqual(false);
     expect(React.isValidElement('string')).toEqual(false);
     if (!ReactFeatureFlags.disableCreateFactory) {
-      expect(React.isValidElement(React.createFactory('div'))).toEqual(false);
+      let factory;
+      expect(() => {
+        factory = React.createFactory('div');
+      }).toWarnDev(
+        'Warning: React.createFactory() is deprecated and will be removed in a ' +
+          'future major release. Consider using JSX or use React.createElement() ' +
+          'directly instead.',
+        {withoutStack: true},
+      );
+      expect(React.isValidElement(factory)).toEqual(false);
     }
     expect(React.isValidElement(Component)).toEqual(false);
     expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);
@@ -301,7 +310,16 @@ describe('ReactElement.jsx', () => {
     expect(React.isValidElement({})).toEqual(false);
     expect(React.isValidElement('string')).toEqual(false);
     if (!ReactFeatureFlags.disableCreateFactory) {
-      expect(React.isValidElement(React.createFactory('div'))).toEqual(false);
+      let factory;
+      expect(() => {
+        factory = React.createFactory('div');
+      }).toWarnDev(
+        'Warning: React.createFactory() is deprecated and will be removed in a ' +
+          'future major release. Consider using JSX or use React.createElement() ' +
+          'directly instead.',
+        {withoutStack: true},
+      );
+      expect(React.isValidElement(factory)).toEqual(false);
     }
     expect(React.isValidElement(Component)).toEqual(false);
     expect(React.isValidElement({type: 'div', props: {}})).toEqual(false);

diff --git a/packages/react/src/__tests__/ReactElementValidator-test.internal.js b/packages/react/src/__tests__/ReactElementValidator-test.internal.js
@@ -445,7 +445,17 @@ describe('ReactElementValidator', () => {
         return <div />;
       }
 
-      let TestFactory = React.createFactory(TestComponent);
+      let TestFactory;
+
+      expect(() => {
+        TestFactory = React.createFactory(TestComponent);
+      }).toWarnDev(
+        'Warning: React.createFactory() is deprecated and will be removed in a ' +
+          'future major release. Consider using JSX or use React.createElement() ' +
+          'directly instead.',
+        {withoutStack: true},
+      );
+
       expect(
         () => TestFactory.type,
       ).toWarnDev(