[faciledictu]

Summary:

Fixes #59329. Related: #59330 (aria-live on Text).

A View with aria-live or accessibilityLiveRegion and no style is
flattened by Fabric: ViewShadowNode::initialize keeps a host view for
accessibilityViewIsModal, accessibilityElementsHidden and
importantForAccessibility, but not for accessibilityLiveRegion. The live
region never reaches the native tree, so TalkBack never announces changes to
its children. The only workaround is collapsable={false}, which is not
documented for live regions.

This adds accessibilityLiveRegion != None to the conditions that form a
stacking context, next to accessibilityViewIsModal. The prop only has an
effect on Android; I put it in the shared check so it is covered by Fantom and
because it is set only on views meant to be announced, but it could move to
the Android HostPlatformViewTraitsInitializer instead if you prefer.

This inverts the existing does not unflatten view test for
accessibilityLiveRegion: unlike a hint or a label, a live region is announced
without the view being accessible, so it needs a view of its own.

Changelog:

[ANDROID] [FIXED] - A View with aria-live or accessibilityLiveRegion is no longer flattened, so the live region is announced

Test Plan:

Added a Fantom test: <View aria-live="polite" /> without collapsable or
accessible is rendered as a host view with accessibilityLiveRegion="polite"
(before the change it was flattened and the output was null). The existing
accessibilityLiveRegion test does not unflatten view asserted the old
behavior, so it is now unflattens view and expects the host view.

On a device (Samsung SM-A276B, Android 16, TalkBack on) with the reproducer
from #59329 and React Native 0.88.0 built from source with this change:
A, B and C are announced. Without the change, only B and C are announced.

[meta-codesync]

@javache has imported this pull request. If you are a Meta employee, you can view this in D126905304.

[react-native-bot]

This pull request was successfully merged by @faciledictu in 5e13324

^{When will my fix make it into a release? | How to file a pick request?}

[meta-codesync]

@javache merged this pull request in 5e13324.

[faciledictu]

A correction to the summary above. I wrote that a live region needs a view of its own "unlike a hint or a label", because those are only announced on an accessible view. For the label that is wrong.

On the same Samsung SM-A276B (Android 16, TalkBack 16.2) and React Native 0.88.0, a View with accessibilityLabel and no accessible is announced as long as the view exists:

<View accessibilityLabel="Cart L1">
  <Text>3 items L1</Text>
</View>
<View accessibilityLabel="Cart L2" collapsable={false}>
  <Text>3 items L2 (control)</Text>
</View>

TalkBack reads L2 as "Cart L2"; L1 is flattened and only "3 items L1" is read. uiautomator dump shows the same: no node carries "Cart L1", the L2 node has content-desc="Cart L2". A non-empty content description makes the view important for accessibility, and TalkBack focuses a node that has text and no focusable ancestor, so the accessible flag is not needed.

So the does not unflatten view Fantom test for accessibilityLabel (Libraries/Components/View/__tests__/View-itest.js, line 599 on main) describes the same kind of bug as #59329, for labels. The hint is not read from such a view on either platform, so the summary holds for it. Reproducer: https://github.com/faciledictu/rn-a11y-flattening-repro, section 1 (L1, L2). The accessibility props that are lost when a view is flattened (the label on Android, and several on iOS) are now in #59816, with a fix in #59817.