From 355c0bef86245f39f43973ff695469ee0ae73149 Mon Sep 17 00:00:00 2001 From: Andrew Clark Date: Thu, 8 Nov 2018 17:20:52 -0800 Subject: [PATCH] Remove errant return assignment Oopsie! This could have been avoided if our types were modeled correctly with Flow (using a disjoint union). Fuzz tester didn't catch it because it does not generate cases where a Suspense component mounts with no children. I'll update it. --- .../src/ReactFiberBeginWork.js | 3 +- .../__tests__/ReactSuspense-test.internal.js | 37 +++++++++++++++++++ 2 files changed, 38 insertions(+), 2 deletions(-) diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 080f3a1fa8361..f5bf5de39a8b4 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -1244,7 +1244,7 @@ function updateSuspenseComponent( } else { // The current tree has not already timed out. That means the primary // children are not wrapped in a fragment fiber. - const currentPrimaryChild: Fiber = (current.child: any); + const currentPrimaryChild = current.child; if (nextDidTimeout) { // Timed out. Wrap the children in a fragment fiber to keep them // separate from the fallback children. @@ -1260,7 +1260,6 @@ function updateSuspenseComponent( primaryChildFragment.effectTag |= Placement; primaryChildFragment.child = currentPrimaryChild; - currentPrimaryChild.return = primaryChildFragment; if ((workInProgress.mode & ConcurrentMode) === NoContext) { // Outside of concurrent mode, we commit the effects from the diff --git a/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js b/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js index 8647b2a5d5c61..5b4e111c169d0 100644 --- a/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js @@ -883,7 +883,44 @@ describe('ReactSuspense', () => { root.update(null); expect(root).toFlushWithoutYielding(); + jest.advanceTimersByTime(1000); + }); + + it('#14162', () => { + const {lazy} = React; + + function Hello() { + return hello; + } + + async function fetchComponent() { + return new Promise(r => { + // simulating a delayed import() call + setTimeout(r, 1000, {default: Hello}); + }); + } + + const LazyHello = lazy(fetchComponent); + + class App extends React.Component { + state = {render: false}; + + componentDidMount() { + setTimeout(() => this.setState({render: true})); + } + + render() { + return ( + loading...}> + {this.state.render && } + + ); + } + } + + const root = ReactTestRenderer.create(null); + root.update(); jest.advanceTimersByTime(1000); }); });