Deduplicate warning on invalid callback (facebook#11833)

yenshih · Jan 6, 2018 · 86e1a19 · 86e1a19
1 parent 48833f6
commit 86e1a19
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 19 deletions.
diff --git a/packages/react-dom/src/__tests__/ReactUpdates-test.js b/packages/react-dom/src/__tests__/ReactUpdates-test.js
@@ -876,13 +876,9 @@ describe('ReactUpdates', () => {
       'Invalid argument passed as callback. Expected a function. Instead ' +
         'received: [object Object]',
     );
+    // Make sure the warning is deduplicated and doesn't fire again
     component = ReactTestUtils.renderIntoDocument(<A />);
-    expect(() => {
-      expect(() => component.setState({}, new Foo())).toWarnDev(
-        'setState(...): Expected the last optional `callback` argument to be ' +
-          'a function. Instead received: [object Object].',
-      );
-    }).toThrowError(
+    expect(() => component.setState({}, new Foo())).toThrowError(
       'Invalid argument passed as callback. Expected a function. Instead ' +
         'received: [object Object]',
     );
@@ -923,13 +919,9 @@ describe('ReactUpdates', () => {
       'Invalid argument passed as callback. Expected a function. Instead ' +
         'received: [object Object]',
     );
+    // Make sure the warning is deduplicated and doesn't fire again
     component = ReactTestUtils.renderIntoDocument(<A />);
-    expect(() => {
-      expect(() => component.forceUpdate(new Foo())).toWarnDev(
-        'forceUpdate(...): Expected the last optional `callback` argument to be ' +
-          'a function. Instead received: [object Object].',
-      );
-    }).toThrowError(
+    expect(() => component.forceUpdate(new Foo())).toThrowError(
       'Invalid argument passed as callback. Expected a function. Instead ' +
         'received: [object Object]',
     );

diff --git a/packages/react-reconciler/src/ReactFiberClassComponent.js b/packages/react-reconciler/src/ReactFiberClassComponent.js
@@ -44,16 +44,24 @@ let didWarnAboutStateAssignmentForComponent;
 let warnOnInvalidCallback;
 
 if (__DEV__) {
+  const didWarnOnInvalidCallback = {};
   didWarnAboutStateAssignmentForComponent = {};
 
   warnOnInvalidCallback = function(callback: mixed, callerName: string) {
-    warning(
-      callback === null || typeof callback === 'function',
-      '%s(...): Expected the last optional `callback` argument to be a ' +
-        'function. Instead received: %s.',
-      callerName,
-      callback,
-    );
+    if (callback === null || typeof callback === 'function') {
+      return;
+    }
+    const key = `${callerName}_${callback}`;
+    if (!didWarnOnInvalidCallback[key]) {
+      warning(
+        false,
+        '%s(...): Expected the last optional `callback` argument to be a ' +
+          'function. Instead received: %s.',
+        callerName,
+        callback,
+      );
+      didWarnOnInvalidCallback[key] = true;
+    }
   };
 
   // This is so gross but it's at least non-critical and can be removed if