fixes and nits

packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js

@@ -93,8 +93,12 @@ describe('ReactHooksInspectionIntegration', () => {
       React.useMemo(() => state1 + state2, [state1]);
 
       function update() {
-        setState('A');
-        dispatch({value: 'B'});
+        act(() => {
+          setState('A');
+        });
+        act(() => {
+          dispatch({value: 'B'});
+        });
         ref.current = 'C';
       }
       let memoizedUpdate = React.useCallback(update, []);
@@ -122,7 +126,7 @@ describe('ReactHooksInspectionIntegration', () => {
       {name: 'Callback', value: updateStates, subHooks: []},
     ]);
 
-    act(updateStates);
+    updateStates();
 
     childFiber = renderer.root.findByType(Foo)._currentFiber();
     tree = ReactDebugTools.inspectHooksOfFiber(childFiber);
@@ -134,7 +138,7 @@ describe('ReactHooksInspectionIntegration', () => {
       {name: 'LayoutEffect', value: effect, subHooks: []},
       {name: 'Effect', value: effect, subHooks: []},
       {name: 'ImperativeHandle', value: outsideRef.current, subHooks: []},
-      {name: 'Memo', value: 'AB', subHooks: []},
+      {name: 'Memo', value: 'Ab', subHooks: []},
       {name: 'Callback', value: updateStates, subHooks: []},
     ]);
   });

packages/react-dom/src/__tests__/ReactTestUtils-test.js

@@ -636,7 +636,7 @@ describe('ReactTestUtils', () => {
     expect(button.innerHTML).toBe('2');
     expect(() => setValueRef(1)).toWarnDev(
       [
-        'It looks like you are in a test environment, trying to set state outside of an act(...) call.',
+        'An update to App inside a test was not wrapped in ReactTestUtils.act(...).',
       ],
       {withoutStack: 1},
     );
@@ -668,14 +668,18 @@ describe('ReactTestUtils', () => {
 
   it('warns if you return a value inside act', () => {
     expect(() => act(() => 123)).toWarnDev(
-      ['An .act(...) function must not return anything'],
+      [
+        'The callback passed to ReactTestUtils.act(...) function must not return anything.',
+      ],
       {withoutStack: true},
     );
   });
 
   it('warns if you try to await an .act call', () => {
     expect(act(() => {}).then).toWarnDev(
-      ['Do not await an act(...) call, it is not a promise'],
+      [
+        'Do not await the result of calling ReactTestUtils.act(...), it is not a Promise.',
+      ],
       {withoutStack: true},
     );
   });

packages/react-dom/src/test-utils/ReactTestUtils.js

@@ -391,20 +391,23 @@ const ReactTestUtils = {
   SimulateNative: {},
 
   act(callback: () => void): Thenable {
+    // note: keep these warning messages in sync with
+    // createReactNoop.js and ReactTestRenderer.js
     const result = ReactDOM.unstable_batchedUpdates(callback);
     if (__DEV__) {
       if (result !== undefined) {
         let addendum;
         if (typeof result.then === 'function') {
           addendum =
-            '\n\nIt looks like you wrote act(async () => ...) or returned a Promise. ' +
-            'Do not write async logic inside act(...)\n';
+            '\n\nIt looks like you wrote ReactTestUtils.act(async () => ...), ' +
+            'or returned a Promise from the callback passed to it. ' +
+            'Putting asynchronous logic inside ReactTestUtils.act(...) is not supported.\n';
         } else {
           addendum = ' You returned: ' + result;
         }
         warningWithoutStack(
           false,
-          'An .act(...) function must not return anything.%s',
+          'The callback passed to ReactTestUtils.act(...) function must not return anything.%s',
           addendum,
         );
       }
@@ -417,7 +420,7 @@ const ReactTestUtils = {
         if (__DEV__) {
           warningWithoutStack(
             false,
-            'Do not await an act(...) call, it is not a promise',
+            'Do not await the result of calling ReactTestUtils.act(...), it is not a Promise.',
           );
         }
       },

packages/react-noop-renderer/src/createReactNoop.js

@@ -872,20 +872,22 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 
     // maybe this should exist only in the test file
     act(callback: () => void): Thenable {
+      // note: keep these warning messages in sync with
+      // ReactTestRenderer.js and ReactTestUtils.js
       let result = NoopRenderer.batchedUpdates(callback);
       if (__DEV__) {
         if (result !== undefined) {
           let addendum;
           if (typeof result.then === 'function') {
             addendum =
-              '\n\nIt looks like you wrote act(async () => ...) or returned a Promise. ' +
-              'Do not write async logic inside act(...)\n';
+              "\n\nIt looks like you wrote ReactNoop.act(async () => ...) or returned a Promise from it's callback. " +
+              'Putting asynchronous logic inside ReactNoop.act(...) is not supported.\n';
           } else {
             addendum = ' You returned: ' + result;
           }
           warningWithoutStack(
             false,
-            'An .act(...) function must not return anything.%s',
+            'The callback passed to ReactNoop.act(...) function must not return anything.%s',
             addendum,
           );
         }
@@ -898,7 +900,7 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
           if (__DEV__) {
             warningWithoutStack(
               false,
-              'Do not await an act(...) call, it is not a promise',
+              'Do not await the result of calling ReactNoop.act(...), it is not a Promise.',
             );
           }
         },

packages/react-reconciler/src/ReactFiberHooks.js

@@ -1137,7 +1137,7 @@ function dispatchAction<S, A>(
     }
     if (__DEV__) {
       if (shouldWarnForUnbatchedSetState === true) {
-        warnIfNotCurrentlyBatchingInDev();
+        warnIfNotCurrentlyBatchingInDev(fiber);
       }
     }
     scheduleWork(fiber, expirationTime);

packages/react-reconciler/src/ReactFiberScheduler.js

@@ -1790,15 +1790,20 @@ function scheduleWorkToRoot(fiber: Fiber, expirationTime): FiberRoot | null {
   return root;
 }
 
-export function warnIfNotCurrentlyBatchingInDev(): void {
+export function warnIfNotCurrentlyBatchingInDev(fiber: Fiber): void {
   if (__DEV__) {
-    if (isBatchingUpdates === false) {
+    if (isRendering === false && isBatchingUpdates === false) {
       warningWithoutStack(
         false,
-        'It looks like you are in a test environment, trying to ' +
-          'set state outside of an act(...) call. ' +
-          'This could lead to unexpected ui while testing. Use ' +
-          'act(...) to batch your updates and remove this warning.',
+        'An update to %s inside a test was not wrapped in ReactTestUtils.act(...).\n\n' +
+          'When testing, code that causes React state updates should be wrapped into ReactTestUtils.act(...):\n\n' +
+          'ReactTestUtils.act(() => {\n' +
+          '  /* fire events */\n' +
+          '});\n' +
+          '/* assert on the output */\n\n' +
+          "This ensures that you're testing the behavior the user would see in the browser." +
+          ' Learn more at https://fb.me/react-testutils-act',
+        getComponentName(fiber.type),
       );
     }
   }

packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.internal.js

@@ -764,18 +764,14 @@ describe('ReactHooksWithNoopRenderer', () => {
       ReactNoop.render(<Counter count={0} />);
       expect(ReactNoop.flush()).toEqual(['Count: (empty)']);
       expect(ReactNoop.getChildren()).toEqual([span('Count: (empty)')]);
-      act(() => {
-        ReactNoop.flushPassiveEffects();
-      });
+      ReactNoop.flushPassiveEffects();
       expect(ReactNoop.clearYields()).toEqual(['Schedule update [0]']);
       expect(ReactNoop.flush()).toEqual(['Count: 0']);
 
       ReactNoop.render(<Counter count={1} />);
       expect(ReactNoop.flush()).toEqual(['Count: 0']);
       expect(ReactNoop.getChildren()).toEqual([span('Count: 0')]);
-      act(() => {
-        ReactNoop.flushPassiveEffects();
-      });
+      ReactNoop.flushPassiveEffects();
       expect(ReactNoop.clearYields()).toEqual(['Schedule update [1]']);
       expect(ReactNoop.flush()).toEqual(['Count: 1']);
     });
@@ -797,10 +793,7 @@ describe('ReactHooksWithNoopRenderer', () => {
       expect(ReactNoop.getChildren()).toEqual([span('Count: (empty)')]);
 
       // Rendering again should flush the previous commit's effects
-      expect(() => ReactNoop.render(<Counter count={1} />)).toWarnDev(
-        ['It looks like you are in a test environment'],
-        {withoutStack: true},
-      );
+      ReactNoop.render(<Counter count={1} />);
       ReactNoop.flushThrough(['Schedule update [0]', 'Count: 0']);
       expect(ReactNoop.getChildren()).toEqual([span('Count: (empty)')]);
 
@@ -810,7 +803,7 @@ describe('ReactHooksWithNoopRenderer', () => {
 
       expect(ReactNoop.getChildren()).toEqual([span('Count: 0')]);
 
-      act(() => ReactNoop.flushPassiveEffects());
+      ReactNoop.flushPassiveEffects();
       expect(ReactNoop.flush()).toEqual(['Schedule update [1]', 'Count: 1']);
       expect(ReactNoop.getChildren()).toEqual([span('Count: 1')]);
     });
@@ -913,9 +906,7 @@ describe('ReactHooksWithNoopRenderer', () => {
         expect(ReactNoop.flush()).toEqual(['Count: (empty)']);
         expect(ReactNoop.getChildren()).toEqual([span('Count: (empty)')]);
         // Now fire the effects
-        act(() => {
-          ReactNoop.flushPassiveEffects();
-        });
+        ReactNoop.flushPassiveEffects();
         // There were multiple updates, but there should only be a
         // single render
         expect(ReactNoop.clearYields()).toEqual(['Count: 0']);

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

@@ -565,21 +565,21 @@ const ReactTestRendererFiber = {
   unstable_setNowImplementation: setNowImplementation,
 
   act(callback: () => void): Thenable {
+    // note: keep these warning messages in sync with
     let result = batchedUpdates(callback);
-    // warnings copied from ReactTestUtils
     if (__DEV__) {
       if (result !== undefined) {
         let addendum;
         if (typeof result.then === 'function') {
           addendum =
-            '\n\nIt looks like you wrote act(async () => ...) or returned a Promise. ' +
-            'Do not write async logic inside act(...)\n';
+            "\n\nIt looks like you wrote TestRenderer.act(async () => ...) or returned a Promise from it's callback. " +
+            'Putting asynchronous logic inside TestRenderer.act(...) is not supported.\n';
         } else {
           addendum = ' You returned: ' + result;
         }
         warningWithoutStack(
           false,
-          'An .act(...) function must not return anything.%s',
+          'The callback passed to TestRenderer.act(...) function must not return anything.%s',
           addendum,
         );
       }
@@ -592,7 +592,7 @@ const ReactTestRendererFiber = {
         if (__DEV__) {
           warningWithoutStack(
             false,
-            'Do not await an act(...) call, it is not a promise',
+            'Do not await the result of calling TestRenderer.act(...), it is not a Promise.',
           );
         }
       },