(Android TV) hasTVPreferredFocus not working consistently when navigating between screens

Description

Hi there!

First of all, I wanted to thank you for the fantastic job that you are doing with this repository ❤️

I have created a repository here which contains three screens: A, B, C. On every screen, you can navigate to any of the other two. So for example, if you are on A, you can navigate to B or C.

Apparently when you are navigating, if you visit any screen that has been rendered before, the focus will not get applied correctly.

Version

0.69.5-1

Output of npx react-native info

System: OS: macOS 12.5.1 CPU: (12) x64 Intel® Core™ i7-9750H CPU @ 2.60GHz Memory: 194.92 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 18.4.0 - ~/.nvm/versions/node/v18.4.0/bin/node Yarn: 1.22.17 - /usr/local/bin/yarn npm: 8.19.2 - ~/.nvm/versions/node/v18.4.0/bin/npm Watchman: 2022.08.22.00 - /usr/local/bin/watchman Managers: CocoaPods: 1.11.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.4, iOS 16.0, macOS 12.3, tvOS 16.0, watchOS 9.0 Android SDK: API Levels: 29, 30, 31, 32 Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.2, 30.0.3, 31.0.0, 32.0.0, 32.1.0 System Images: android-29 | Android TV Intel x86 Atom, android-29 | Intel x86 Atom_64, android-31 | Google TV Intel x86 Atom, android-31 | Google Play Intel x86 Atom_64 Android NDK: Not Found IDEs: Android Studio: 2021.1 AI-211.7628.21.2111.8139111 Xcode: 14.0.1/14A400 - /usr/bin/xcodebuild Languages: Java: 11.0.11 - /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-1 npmGlobalPackages: react-native: Not Found

Steps to reproduce

1. Run Android TV by executing yarn android and yarn start
2. Click on Go to B
3. Click on Go to A

Expected

Go to B is focused

Actual

Nothing is focused

It also occurs when:

1. Navigate to screen B
2. Click on Go to C
3. Click on Go to B

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

https://user-images.githubusercontent.com/45874461/197559380-2fcf7b88-cb50-4942-9d37-d8ccc3dedcf1.mov

link to the repo to reproduce the bug

[wouterds]

I also have a demo project using @react-navigation/native-stack with quite some issues with focus, can be used to verify possible fixes https://github.com/wouterds/react-native-tv-example

Update: I switched to @react-navigation/stack but the problem remains. On tvOS it works perfectly, but on AndroidTV it looks like hasTVPreferredFocus only works once, the initial time the screen renders? Afterwards (or when navigating back) it is fully ignored.

[danychi]

@wouterds I have tried to use the approach from your FocusService in this small repo but I did not succeed. The focus gets lost when pressing the back button. Btw really cool repo and nice code 🙌