diff --git a/packages/react-dom/src/__tests__/ReactServerRendering-test.js b/packages/react-dom/src/__tests__/ReactServerRendering-test.js index f3958af69a..27b30f9bb0 100644 --- a/packages/react-dom/src/__tests__/ReactServerRendering-test.js +++ b/packages/react-dom/src/__tests__/ReactServerRendering-test.js @@ -566,6 +566,29 @@ describe('ReactDOMServer', () => { expect(markup).toBe('
'); }); + it('throws for unsupported types on the server', () => { + expect(() => { + ReactDOMServer.renderToString(); + }).toThrow('ReactDOMServer does not yet support Suspense.'); + + expect(() => { + const LazyFoo = React.lazy( + () => + new Promise(resolve => + resolve(function Foo() { + return
; + }), + ), + ); + ReactDOMServer.renderToString(); + }).toThrow('ReactDOMServer does not yet support lazy-loaded components.'); + + expect(() => { + const FooPromise = {then() {}}; + ReactDOMServer.renderToString(); + }).toThrow('ReactDOMServer does not yet support lazy-loaded components.'); + }); + it('should throw (in dev) when children are mutated during render', () => { function Wrapper(props) { props.children[1] =

; // Mutation is illegal diff --git a/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js b/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js index 39e2026c09..5d1ad4eb52 100644 --- a/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js +++ b/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js @@ -442,4 +442,47 @@ describe('ReactDOMServerHydration', () => { '

Enable JavaScript to run this app.
', ); }); + + it('should be able to use lazy components after hydrating', async () => { + const Lazy = new Promise(resolve => { + setTimeout( + () => + resolve(function World() { + return 'world'; + }), + 1000, + ); + }); + class HelloWorld extends React.Component { + state = {isClient: false}; + componentDidMount() { + this.setState({ + isClient: true, + }); + } + render() { + return ( +
+ Hello{' '} + {this.state.isClient && ( + + + + )} +
+ ); + } + } + + const element = document.createElement('div'); + element.innerHTML = ReactDOMServer.renderToString(); + expect(element.textContent).toBe('Hello '); + + ReactDOM.hydrate(, element); + expect(element.textContent).toBe('Hello loading'); + + jest.runAllTimers(); + await Lazy; + expect(element.textContent).toBe('Hello world'); + }); }); diff --git a/packages/react-dom/src/server/ReactPartialRenderer.js b/packages/react-dom/src/server/ReactPartialRenderer.js index d92f68b500..dc79c3fb28 100644 --- a/packages/react-dom/src/server/ReactPartialRenderer.js +++ b/packages/react-dom/src/server/ReactPartialRenderer.js @@ -935,6 +935,8 @@ class ReactDOMServerRenderer { } this.stack.push(frame); return ''; + } else { + invariant(false, 'ReactDOMServer does not yet support Suspense.'); } } // eslint-disable-next-line-no-fallthrough @@ -1004,6 +1006,12 @@ class ReactDOMServerRenderer { return ''; } default: + if (typeof elementType.then === 'function') { + invariant( + false, + 'ReactDOMServer does not yet support lazy-loaded components.', + ); + } break; } }