Text getting focus instead of touchables (Android only)

Description

I just upgraded to version 0.69.5-2 very meticulously and everything compiles and runs, but the focus engine seems to be focusing Text nodes now instead of Touchables. I discovered this by turning on a debug setting, then you can see the Text gets the focus instead of the button. With debug mode off it looks like the focus is not working until you click a few times (as we don’t have focus states for text).

This was not the case in the previous version we were running (0.66.3-3).

Version

0.69.5-2

Output of npx react-native info

System:
    OS: macOS 12.6
    CPU: (8) arm64 Apple M2
    Memory: 122.89 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.18.1 - ~/.nvm/versions/node/v16.18.1/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v16.18.1/bin/yarn
    npm: 8.19.2 - ~/.nvm/versions/node/v16.18.1/bin/npm
    Watchman: 2022.10.31.00 - /opt/homebrew/bin/watchman
  Managers:
    CocoaPods: 1.11.3 - /Users/wouterds/.rbenv/shims/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 22.1, iOS 16.1, macOS 13.0, tvOS 16.1, watchOS 9.1
    Android SDK:
      API Levels: 26, 28, 30, 31
      Build Tools: 28.0.3, 30.0.2, 30.0.3, 31.0.0
      System Images: android-31 | Google TV ARM 64 v8a
      Android NDK: Not Found
  IDEs:
    Android Studio: 2021.2 AI-212.5712.43.2112.8609683
    Xcode: 14.1/14B47b - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.17 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.0.0 => 18.0.0 
    react-native: Not Found
    react-native-macos: Not Found
    react-native-tvos:  0.69.5-2 
  npmGlobalPackages:
    *react-native*: Not Found

Steps to reproduce

Render a screen with some touchables on top, then some text in between and then some more buttons. When navigating down from the top you will first pass through the text nodes and only then land on the touchables on the bottom.

Snack, code example, screenshot, or link to a repository

I currently don’t have a demo project to show this behaviour but can look into one if desired and we don’t get this sorted out else.

[wouterds]

I ended up creating a custom Text component where we set the default value for accessible to false.

import React, { memo } from 'react';
import { Text as RNText, TextProps as RNTextProps } from 'react-native';

type Props = RNTextProps;

export type TextProps = Props;

const Text = (props: Props) => (
  <RNText
    {...props}
    accessible={props.accessible || false}
  />
);

export default memo(Text);

Re-opened the issue as it seems it is not specific to my setup/project.

[wouterds]

@douglowder Did as instructed, and was able to compile the archive with the patch (https://github.com/wouterds/react-native-tvos/commit/cdf7f9c55fb35440eaba5a861b4b2778007ba6fa) & placed it in node_modules/react-native/android but the issue remains.