diff --git a/packages/react-dom/src/__tests__/ReactServerRenderingHydration.js b/packages/react-dom/src/__tests__/ReactServerRenderingHydration.js
index 9f15eab857a61..63a0104f0cc60 100644
--- a/packages/react-dom/src/__tests__/ReactServerRenderingHydration.js
+++ b/packages/react-dom/src/__tests__/ReactServerRenderingHydration.js
@@ -292,7 +292,6 @@ describe('ReactDOMServerHydration', () => {
expect(() => ReactDOM.hydrate(markup, element)).toWarnDev(
'Please update the following components to use componentDidMount instead: ComponentWithWarning',
- {withoutStack: true},
);
expect(element.textContent).toBe('Hi');
});
diff --git a/packages/react-reconciler/src/ReactCurrentFiber.js b/packages/react-reconciler/src/ReactCurrentFiber.js
index 0a47c6ba905d8..cd72ffc520958 100644
--- a/packages/react-reconciler/src/ReactCurrentFiber.js
+++ b/packages/react-reconciler/src/ReactCurrentFiber.js
@@ -13,6 +13,7 @@ import {
FunctionalComponent,
ClassComponent,
HostComponent,
+ Mode,
} from 'shared/ReactTypeOfWork';
import describeComponentFrame from 'shared/describeComponentFrame';
import getComponentName from 'shared/getComponentName';
@@ -29,6 +30,7 @@ function describeFiber(fiber: Fiber): string {
case FunctionalComponent:
case ClassComponent:
case HostComponent:
+ case Mode:
const owner = fiber._debugOwner;
const source = fiber._debugSource;
const name = getComponentName(fiber.type);
diff --git a/packages/react/src/__tests__/ReactStrictMode-test.internal.js b/packages/react/src/__tests__/ReactStrictMode-test.internal.js
index 10c53cc9edf5c..fffb538571fb0 100644
--- a/packages/react/src/__tests__/ReactStrictMode-test.internal.js
+++ b/packages/react/src/__tests__/ReactStrictMode-test.internal.js
@@ -357,6 +357,7 @@ describe('ReactStrictMode', () => {
rendered = ReactTestRenderer.create();
}).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
+ '\n in AsyncMode (at **)' +
'\n in SyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: AsyncRoot' +
@@ -414,6 +415,7 @@ describe('ReactStrictMode', () => {
() => (rendered = ReactTestRenderer.create()),
).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
+ '\n in AsyncMode (at **)' +
'\n in SyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: AsyncRoot, Parent' +
@@ -491,12 +493,14 @@ describe('ReactStrictMode', () => {
() => (rendered = ReactTestRenderer.create()),
).toWarnDev([
'Unsafe lifecycle methods were found within a strict-mode tree:' +
+ '\n in AsyncMode (at **)' +
'\n in AsyncRootOne (at **)' +
'\n in div (at **)' +
'\n in SyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: Bar, Foo',
'Unsafe lifecycle methods were found within a strict-mode tree:' +
+ '\n in AsyncMode (at **)' +
'\n in AsyncRootTwo (at **)' +
'\n in div (at **)' +
'\n in SyncRoot (at **)' +
@@ -537,6 +541,7 @@ describe('ReactStrictMode', () => {
rendered = ReactTestRenderer.create();
}).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
+ '\n in AsyncMode (at **)' +
'\n in AsyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: Foo' +
@@ -546,6 +551,7 @@ describe('ReactStrictMode', () => {
expect(() => rendered.update()).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
+ '\n in AsyncMode (at **)' +
'\n in AsyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: Bar' +
@@ -596,6 +602,7 @@ describe('ReactStrictMode', () => {
expect(() => ReactTestRenderer.create()).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
+ '\n in StrictMode (at **)' +
'\n in SyncRoot (at **)' +
'\n\ncomponentWillReceiveProps: Please update the following components ' +
'to use static getDerivedStateFromProps instead: Bar, Foo' +
@@ -755,6 +762,7 @@ describe('ReactStrictMode', () => {
'Warning: A string ref, "somestring", has been found within a strict mode tree. ' +
'String refs are a source of potential bugs and should be avoided. ' +
'We recommend using createRef() instead.\n\n' +
+ ' in StrictMode (at **)\n' +
' in OuterComponent (at **)\n\n' +
'Learn more about using refs safely here:\n' +
'https://fb.me/react-strict-mode-string-ref',
@@ -797,6 +805,7 @@ describe('ReactStrictMode', () => {
'String refs are a source of potential bugs and should be avoided. ' +
'We recommend using createRef() instead.\n\n' +
' in InnerComponent (at **)\n' +
+ ' in StrictMode (at **)\n' +
' in OuterComponent (at **)\n\n' +
'Learn more about using refs safely here:\n' +
'https://fb.me/react-strict-mode-string-ref',
@@ -888,6 +897,7 @@ describe('ReactStrictMode', () => {
rendered = ReactTestRenderer.create();
}).toWarnDev(
'Warning: Legacy context API has been detected within a strict-mode tree: ' +
+ '\n in StrictMode (at **)' +
'\n in div (at **)' +
'\n in Root (at **)' +
'\n\nPlease update the following components: FactoryLegacyContextConsumer, ' +
diff --git a/packages/react/src/__tests__/ReactStrictMode-test.js b/packages/react/src/__tests__/ReactStrictMode-test.js
new file mode 100644
index 0000000000000..f4ba917432ec0
--- /dev/null
+++ b/packages/react/src/__tests__/ReactStrictMode-test.js
@@ -0,0 +1,65 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * 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 ReactDOM;
+let ReactDOMServer;
+
+describe('ReactStrictMode', () => {
+ beforeEach(() => {
+ jest.resetModules();
+ React = require('react');
+ ReactDOM = require('react-dom');
+ ReactDOMServer = require('react-dom/server');
+ });
+
+ it('should appear in the client component stack', () => {
+ function Foo() {
+ return
;
+ }
+
+ const container = document.createElement('div');
+ expect(() => {
+ ReactDOM.render(
+
+
+ ,
+ container,
+ );
+ }).toWarnDev(
+ 'Invalid ARIA attribute `ariaTypo`. ' +
+ 'ARIA attributes follow the pattern aria-* and must be lowercase.\n' +
+ ' in div (at **)\n' +
+ ' in Foo (at **)\n' +
+ ' in StrictMode (at **)',
+ );
+ });
+
+ it('should appear in the SSR component stack', () => {
+ function Foo() {
+ return ;
+ }
+
+ expect(() => {
+ ReactDOMServer.renderToString(
+
+
+ ,
+ );
+ }).toWarnDev(
+ 'Invalid ARIA attribute `ariaTypo`. ' +
+ 'ARIA attributes follow the pattern aria-* and must be lowercase.\n' +
+ ' in div (at **)\n' +
+ ' in Foo (at **)\n' +
+ ' in StrictMode (at **)',
+ );
+ });
+});