Skip to content

Commit

Permalink
update hideOrUnhideAllChildren to hide portals that aren't wrapped in…
Browse files Browse the repository at this point in the history
… a host component (#16992)

Currently, when a node suspends, if its subtree contains a portal, the portal is not hidden. This hides portals in the subtree when it's not wrapped in a host component .
  • Loading branch information
lunaruan authored Oct 2, 2019
1 parent bb680a0 commit de2edc2
Show file tree
Hide file tree
Showing 2 changed files with 30 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,29 @@ describe('ReactDOMSuspensePlaceholder', () => {
expect(window.getComputedStyle(divs[2].current).display).toEqual('inline');
});

it('hides and unhides child portals', async () => {
const portalContainer = document.createElement('div');
function Component() {
return ReactDOM.createPortal(<span />, portalContainer);
}

function App() {
return (
<Suspense fallback={<Text text="Loading..." />}>
<AsyncText ms={500} text="A" />
<Component />
</Suspense>
);
}

ReactDOM.render(<App />, container);
expect(window.getComputedStyle(portalContainer).display).toEqual('none');

await advanceTimers(500);
Scheduler.unstable_flushAll();
expect(window.getComputedStyle(portalContainer).display).toEqual('block');
});

it('hides and unhides timed out text nodes', async () => {
function App() {
return (
Expand Down
7 changes: 7 additions & 0 deletions packages/react-reconciler/src/ReactFiberCommitWork.js
Original file line number Diff line number Diff line change
Expand Up @@ -645,6 +645,13 @@ function hideOrUnhideAllChildren(finishedWork, isHidden) {
} else {
unhideInstance(node.stateNode, node.memoizedProps);
}
} else if (node.tag === HostPortal) {
const instance = node.stateNode.containerInfo;
if (isHidden) {
hideInstance(instance);
} else {
unhideInstance(instance, node.memoizedProps);
}
} else if (node.tag === HostText) {
const instance = node.stateNode;
if (isHidden) {
Expand Down

0 comments on commit de2edc2

Please sign in to comment.