+
+ ▾
+
+ `);
+
+ await act(() => {
+ render(
+
+
+
+ e2
+
+
+
+
+ e1
+
+
+ ,
+ );
+ });
+
+ expect(store).toMatchInlineSnapshot(`
+ [root]
+ ▾
+ ▾
+
+ ▾
+
+ `);
+ });
+
describe('StrictMode compliance', () => {
it('should mark strict root elements as strict', async () => {
const App = () => ;
diff --git a/packages/react-devtools-shared/src/backend/fiber/renderer.js b/packages/react-devtools-shared/src/backend/fiber/renderer.js
index b6bc24dd01b4c..2a41f6e08f096 100644
--- a/packages/react-devtools-shared/src/backend/fiber/renderer.js
+++ b/packages/react-devtools-shared/src/backend/fiber/renderer.js
@@ -3612,6 +3612,11 @@ export function attach(
shouldResetChildren = true;
}
} else if (prevChild !== null && shouldFilterFiber(nextChild)) {
+ // The filtered instance could've reordered.
+ if (prevChild !== prevChildAtSameIndex) {
+ shouldResetChildren = true;
+ }
+
// If this Fiber should be filtered, we need to still update its children.
// This relies on an alternate since we don't have an Instance with the previous
// child on it. Ideally, the reconciliation wouldn't need previous Fibers that