Skip to content

Commit 056073d

Browse files
authored
[Fiber] Support moveBefore at the top level of a container (facebook#32036)
Parity with appendChild and insertBefore. This allows reordering at the root while preserving state.
1 parent d2a1b88 commit 056073d

File tree

1 file changed

+24
-4
lines changed

1 file changed

+24
-4
lines changed

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -793,10 +793,20 @@ export function appendChildToContainer(
793793
let parentNode;
794794
if (container.nodeType === COMMENT_NODE) {
795795
parentNode = (container.parentNode: any);
796-
parentNode.insertBefore(child, container);
796+
if (supportsMoveBefore) {
797+
// $FlowFixMe[prop-missing]: We've checked this with supportsMoveBefore.
798+
parentNode.moveBefore(child, container);
799+
} else {
800+
parentNode.insertBefore(child, container);
801+
}
797802
} else {
798803
parentNode = container;
799-
parentNode.appendChild(child);
804+
if (supportsMoveBefore) {
805+
// $FlowFixMe[prop-missing]: We've checked this with supportsMoveBefore.
806+
parentNode.moveBefore(child, null);
807+
} else {
808+
parentNode.appendChild(child);
809+
}
800810
}
801811
// This container might be used for a portal.
802812
// If something inside a portal is clicked, that click should bubble
@@ -835,9 +845,19 @@ export function insertInContainerBefore(
835845
beforeChild: Instance | TextInstance | SuspenseInstance,
836846
): void {
837847
if (container.nodeType === COMMENT_NODE) {
838-
(container.parentNode: any).insertBefore(child, beforeChild);
848+
if (supportsMoveBefore) {
849+
// $FlowFixMe[prop-missing]: We've checked this with supportsMoveBefore.
850+
(container.parentNode: any).moveBefore(child, beforeChild);
851+
} else {
852+
(container.parentNode: any).insertBefore(child, beforeChild);
853+
}
839854
} else {
840-
container.insertBefore(child, beforeChild);
855+
if (supportsMoveBefore) {
856+
// $FlowFixMe[prop-missing]: We've checked this with supportsMoveBefore.
857+
container.moveBefore(child, beforeChild);
858+
} else {
859+
container.insertBefore(child, beforeChild);
860+
}
841861
}
842862
}
843863

0 commit comments

Comments
 (0)