Keep skipping unchanged children when a leaf without a view is replaced

With skipUnchangedChildrenInDifferentiator on, the side-by-side slicing gives
up when a child's tag changes. React gives a Text a new raw text node whenever
its string changes, and on Android a Paragraph doesn't form a stacking context,
so the differ reaches that node while slicing the Paragraph's parent and slices
all of the parent's children in full. A replaced leaf that doesn't form a view
has no mount index, so both nodes can be listed as they are.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

Author: hryhoriiK97

packages/react-native/ReactCommon/react/renderer/mounting/internal/sliceChildShadowNodeViewPairs.cpp

@@ -267,7 +267,39 @@ bool sliceChangedChildShadowNodeViewPairsRecursively(
     if (oldChildShadowNode.getTag() != newChildShadowNode.getTag() ||
         oldChildShadowNode.getOrderIndex() !=
             newChildShadowNode.getOrderIndex()) {
-      return false;
+      // A replaced leaf that doesn't form a view (like the raw text of a
+      // `Text` whose string changed) has no mount index, so both nodes can be
+      // listed as they are without shifting the views around them.
+      if (!oldChildShadowNode.getChildren().empty() ||
+          !newChildShadowNode.getChildren().empty()) {
+        return false;
+      }
+      auto oldLeafSlice = sliceChild(
+          oldShadowNode,
+          oldChildShadowNode,
+          ShadowView(oldChildShadowNode),
+          oldLayoutOffset);
+      auto newLeafSlice = sliceChild(
+          newShadowNode,
+          newChildShadowNode,
+          ShadowView(newChildShadowNode),
+          newLayoutOffset);
+      if (oldLeafSlice.isConcreteView || newLeafSlice.isConcreteView) {
+        return false;
+      }
+      addChildSlice(
+          oldPairList,
+          oldStartOfStaticIndex,
+          scope,
+          oldLeafSlice,
+          oldChildShadowNode);
+      addChildSlice(
+          newPairList,
+          newStartOfStaticIndex,
+          scope,
+          newLeafSlice,
+          newChildShadowNode);
+      continue;
     }
 
     auto oldChildSlice = sliceChild(

packages/react-native/src/private/renderer/mounting/__tests__/Mounting-itest.js

@@ -17,7 +17,7 @@ import type {HostInstance} from 'react-native';
 import * as Fantom from '@react-native/fantom';
 import nullthrows from 'nullthrows';
 import * as React from 'react';
-import {ScrollView, View} from 'react-native';
+import {ScrollView, Text, View} from 'react-native';
 
 describe('ViewFlattening', () => {
   /**
@@ -593,6 +593,52 @@ describe('unchanged children', () => {
     ]);
   });
 
+  test('a text whose string changes next to unchanged children is updated', () => {
+    const root = Fantom.createRoot();
+    const render = (value: number) =>
+      Fantom.runTask(() => {
+        root.render(
+          <View nativeID="parent">
+            <Unchanged nativeID="A" />
+            <Text nativeID="label">Value {value}</Text>
+            <Unchanged nativeID="B" />
+          </View>,
+        );
+      });
+
+    render(1);
+    root.takeMountingManagerLogs();
+
+    // React gives the changed string a new raw text node, which doesn't form
+    // a view, so only the paragraph is updated.
+    render(2);
+    expect(root.takeMountingManagerLogs()).toEqual([
+      'Update {type: "Paragraph", nativeID: "label"}',
+    ]);
+  });
+
+  test('an empty view that is remounted next to unchanged children causes no mutations', () => {
+    const root = Fantom.createRoot();
+    const render = (version: number) =>
+      Fantom.runTask(() => {
+        root.render(
+          <View nativeID="parent">
+            <Unchanged nativeID="A" />
+            <View key={version} />
+            <Unchanged nativeID="B" />
+          </View>,
+        );
+      });
+
+    render(1);
+    root.takeMountingManagerLogs();
+
+    // The new key gives the empty view a new tag. It is flattened and has no
+    // children, so it doesn't form a view and nothing is mounted for it.
+    render(2);
+    expect(root.takeMountingManagerLogs()).toEqual([]);
+  });
+
   test('a child added next to unchanged children is inserted', () => {
     const root = Fantom.createRoot();
     const render = (showAdded: boolean) =>