diff --git a/packages/react-dom/src/__tests__/ReactDOMSuspensePlaceholder-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMSuspensePlaceholder-test.internal.js
index fbed0d4b82a75..98069e2d9f400 100644
--- a/packages/react-dom/src/__tests__/ReactDOMSuspensePlaceholder-test.internal.js
+++ b/packages/react-dom/src/__tests__/ReactDOMSuspensePlaceholder-test.internal.js
@@ -28,6 +28,7 @@ describe('ReactDOMSuspensePlaceholder', () => {
ReactCache = require('react-cache');
Suspense = React.Suspense;
container = document.createElement('div');
+ document.body.appendChild(container);
TextResource = ReactCache.unstable_createResource(([text, ms = 0]) => {
return new Promise((resolve, reject) =>
@@ -38,6 +39,10 @@ describe('ReactDOMSuspensePlaceholder', () => {
}, ([text, ms]) => text);
});
+ afterEach(() => {
+ document.body.removeChild(container);
+ });
+
function advanceTimers(ms) {
// Note: This advances Jest's virtual time but not React's. Use
// ReactNoop.expire for that.
@@ -157,4 +162,64 @@ describe('ReactDOMSuspensePlaceholder', () => {
);
},
);
+
+ // Regression test for https://github.com/facebook/react/issues/14188
+ it('can call findDOMNode() in a suspended component commit phase', async () => {
+ const log = [];
+ const Lazy = React.lazy(
+ () =>
+ new Promise(resolve =>
+ resolve({
+ default() {
+ return 'lazy';
+ },
+ }),
+ ),
+ );
+
+ class Child extends React.Component {
+ componentDidMount() {
+ log.push('cDM ' + this.props.id);
+ ReactDOM.findDOMNode(this);
+ }
+ componentDidUpdate() {
+ log.push('cDU ' + this.props.id);
+ ReactDOM.findDOMNode(this);
+ }
+ render() {
+ return 'child';
+ }
+ }
+
+ const buttonRef = React.createRef();
+ class App extends React.Component {
+ state = {
+ suspend: false,
+ };
+ handleClick = () => {
+ this.setState({suspend: true});
+ };
+ render() {
+ return (
+
+
+
+
+ {this.state.suspend && }
+
+ );
+ }
+ }
+
+ ReactDOM.render(, container);
+
+ expect(log).toEqual(['cDM first', 'cDM second']);
+ log.length = 0;
+
+ buttonRef.current.dispatchEvent(new MouseEvent('click', {bubbles: true}));
+ await Lazy;
+ expect(log).toEqual(['cDU first', 'cDU second']);
+ });
});