`:focus` / `:focus-within` never fire on tvOS (focus engine not observed)
Description
On tvOS, the CSS pseudo-selectors :focus and :focus-within never fire for a focusable view navigated with the D-pad. The same happens on iOS, although focus states are less common.
Expected: when a focusable view gains focus, its :focus styles apply (as on web).
Actual: nothing happens. REAPseudoSelectorObserver.mm seems to observe only UITextField/UITextView, so the UIKit focus engine (UIFocusDidUpdateNotification) is never observed and no view can match :focus. On tvOS, where the focus engine is the primary navigation, native :focus/:focus-within are effectively unusable for that purpose.
Proposed fix: also observe UIFocusDidUpdateNotification (iOS and tvOS) so any focusable view participates. (:focus = ctx.nextFocusedView == view, :focus-within = focus entering/leaving the subtree). This matches how React Native itself detects focus (RCTViewComponentView -didUpdateFocusInContext:, nextFocusedView == self).
Steps to reproduce
- On tvOS, render an
AnimatedPressable with a CSS style whose:focusvariant changes a visible property (e.g.borderColor). - Move focus to it with the tvOS remote.
- The
:focusstyle is never applied.
Snack or a link to a repository
https://github.com/slvvn/reanimated-tvos-focus-repro
Reanimated version
4.6.0-nightly-20260627-2baa894a7
Worklets version
0.10.0
React Native version
0.86 (react-native-tvos 0.86.0-2)
Platforms
iOS, tvOS
JavaScript runtime
Hermes
Workflow
Expo Dev Client
Architecture
No response
Reanimated feature flags
Yes
React Native release level
No response
Build type
No response
Device
No response
Host machine
No response
Device model
No response
Acknowledgements
Yes
Source: software-mansion/react-native-reanimated