From 39f9b2634bc324fae0ba94e8f731d766ed44f66e Mon Sep 17 00:00:00 2001
From: Dan Abramov <dan.abramov@gmail.com>
Date: Fri, 3 Aug 2018 15:28:29 +0100
Subject: [PATCH] Tweak da message

---
 packages/react-reconciler/src/ReactFiberClassComponent.js  | 7 +++++--
 packages/react/src/__tests__/ReactES6Class-test.js         | 6 ++++--
 packages/react/src/__tests__/ReactTypeScriptClass-test.ts  | 6 ++++--
 .../src/__tests__/createReactClassIntegration-test.js      | 5 ++++-
 4 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/packages/react-reconciler/src/ReactFiberClassComponent.js b/packages/react-reconciler/src/ReactFiberClassComponent.js
index 50968de15b16f..60ee9c2ac748e 100644
--- a/packages/react-reconciler/src/ReactFiberClassComponent.js
+++ b/packages/react-reconciler/src/ReactFiberClassComponent.js
@@ -505,10 +505,13 @@ function constructClassInstance(
         didWarnAboutUninitializedState.add(componentName);
         warningWithoutStack(
           false,
-          '%s: Component state must be properly initialized when using getDerivedStateFromProps. ' +
-            'Expected state to be an object, but it was %s.',
+          '`%s` uses `getDerivedStateFromProps` but its initial state is ' +
+            '%s. This is not recommended. Instead, define the initial state by ' +
+            'assigning an object to `this.state` in the constructor of `%s`. ' +
+            'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.',
           componentName,
           instance.state === null ? 'null' : 'undefined',
+          componentName,
         );
       }
     }
diff --git a/packages/react/src/__tests__/ReactES6Class-test.js b/packages/react/src/__tests__/ReactES6Class-test.js
index cf198ce062ad7..0b2ade96afec9 100644
--- a/packages/react/src/__tests__/ReactES6Class-test.js
+++ b/packages/react/src/__tests__/ReactES6Class-test.js
@@ -190,8 +190,10 @@ describe('ReactES6Class', () => {
       }
     }
     expect(() => ReactDOM.render(<Foo foo="foo" />, container)).toWarnDev(
-      'Foo: Component state must be properly initialized when using getDerivedStateFromProps. ' +
-        'Expected state to be an object, but it was undefined.',
+      '`Foo` uses `getDerivedStateFromProps` but its initial state is ' +
+        'undefined. This is not recommended. Instead, define the initial state by ' +
+        'assigning an object to `this.state` in the constructor of `Foo`. ' +
+        'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.',
       {withoutStack: true},
     );
   });
diff --git a/packages/react/src/__tests__/ReactTypeScriptClass-test.ts b/packages/react/src/__tests__/ReactTypeScriptClass-test.ts
index 64231b8ec0ad6..ae72ca2068d4a 100644
--- a/packages/react/src/__tests__/ReactTypeScriptClass-test.ts
+++ b/packages/react/src/__tests__/ReactTypeScriptClass-test.ts
@@ -448,8 +448,10 @@ describe('ReactTypeScriptClass', function() {
     expect(function() {
       ReactDOM.render(React.createElement(Foo, {foo: 'foo'}), container);
     }).toWarnDev(
-      'Foo: Component state must be properly initialized when using getDerivedStateFromProps. ' +
-        'Expected state to be an object, but it was undefined.',
+      '`Foo` uses `getDerivedStateFromProps` but its initial state is ' +
+      'undefined. This is not recommended. Instead, define the initial state by ' +
+      'assigning an object to `this.state` in the constructor of `Foo`. ' +
+      'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.',
         {withoutStack: true}
     );
   });
diff --git a/packages/react/src/__tests__/createReactClassIntegration-test.js b/packages/react/src/__tests__/createReactClassIntegration-test.js
index 2d94d04916c8b..1bb19b4c962d8 100644
--- a/packages/react/src/__tests__/createReactClassIntegration-test.js
+++ b/packages/react/src/__tests__/createReactClassIntegration-test.js
@@ -511,7 +511,10 @@ describe('create-react-class-integration', () => {
     expect(() =>
       ReactDOM.render(<Component />, document.createElement('div')),
     ).toWarnDev(
-      'Component state must be properly initialized when using getDerivedStateFromProps.',
+      '`Component` uses `getDerivedStateFromProps` but its initial state is ' +
+        'undefined. This is not recommended. Instead, define the initial state by ' +
+        'assigning an object to `this.state` in the constructor of `Component`. ' +
+        'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.',
       {
         withoutStack: true,
       },