Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

react-native-screens@v4 breaks keyboard-controller #2554

Open
kirillzyusko opened this issue Dec 6, 2024 · 6 comments
Open

react-native-screens@v4 breaks keyboard-controller #2554

kirillzyusko opened this issue Dec 6, 2024 · 6 comments
Labels
Missing repro This issue need minimum repro scenario Platform: Android This issue is specific to Android

Comments

@kirillzyusko
Copy link
Contributor

Description

I just discovered this problem so I don't see an entire picture in my head yet, though what I can see is:

  • it looks like there is some race condition between keyboard-controller because sometimes everything works, sometimes not
  • if I remove ViewCompat.setOnApplyWindowInsetsListener(view, this) and ViewCompat.setOnApplyWindowInsetsListener(view, null) then keyboard-controller constantly receives events

I'm still in the beginning of my very early investigation, but decided to open an issue to keep people aware and to track a progress here 👀

Steps to reproduce

  1. Scroll down
  2. Set focus to last field (number 5)

Expected behavior

keyboard controller can receive events and propagate them to JS

Actual behavior

Native side of keyboard-controller doesn't receive keyboard events

Snack or a link to a repository

https://github.com/NyoriK/keyboard-controller-test-project

Screens version

4.1.0

React Native version

0.76.3

Platforms

Android

JavaScript runtime

Hermes

Workflow

Expo bare workflow

Architecture

Fabric (New Architecture)

Build type

Debug mode

Device

Android emulator

Device model

Pixel 8 Pro API 35

Acknowledgements

Yes

@github-actions github-actions bot added Platform: Android This issue is specific to Android Missing repro This issue need minimum repro scenario labels Dec 6, 2024
Copy link

github-actions bot commented Dec 6, 2024

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?

@kirillzyusko kirillzyusko changed the title react-native-screens@v4 break keyboard-controller react-native-screens@v4 breaks keyboard-controller Dec 6, 2024
@kirillzyusko
Copy link
Contributor Author

Issue does contain a minimal reproduction repo 🤞

@kkafar
Copy link
Member

kkafar commented Dec 6, 2024

I think I know what the case is. Most likely you register on decor view (or some view beneath) to listen for keyboard inset updates & I'm need to do the same overwriting your listener.

This is a serious issue, but we are limited by Android - i.e. only single listener is supported for given view & there is no way to check whether a view has listener or not (am I right here? Haven't verified this, will do on Monday), so most likely it works both ways - screens break keyboard-controller and keyboard-controller breaks screens, depending on who overwrites who.

I do not know what is the best way forward yet 🤷🏻‍♂️

Edit: also I'm writing from top of my head; will verify the issue on Monday

@kirillzyusko
Copy link
Contributor Author

I think I know what the case is. Most likely you register on decor view (or some view beneath) to listen for keyboard inset updates & I'm need to do the same overwriting your listener.

Right, I'm adding my own view under decor view and I'm attaching my listeners to my own view. However I do not get insets - is it because you setup your listener on decor view and consume all of insets so my listeners are not getting anything, right?

This is a serious issue, but we are limited by Android - i.e. only single listener is supported for given view & there is no way to check whether a view has listener or not (am I right here? Haven't verified this, will do on Monday), so most likely it works both ways - screens break keyboard-controller and keyboard-controller breaks screens, depending on who overwrites who.

Right, only a single listener is allowed. That's why I add my own view (in order not to break other libs).

I do not know what is the best way forward yet 🤷🏻‍♂️

What happens if you also add a child to decor view and setup your listener to that view? 🤔 Not sure, maybe I'm missing something, but I think such solution may work 🤷‍♂️

@kkafar
Copy link
Member

kkafar commented Dec 11, 2024

It is not that straightforward unfortunately. v4 comes with the "legacy" (in the light of edge-to-edge) statusBarTranslucent prop, which currently do modify insets on the level of decor view (if they are used) => I need to be attached to decor view itself and modify the insets there.

What I wonder now is where do I consume the insets, so that you don't get them below the decor view. Only place that comes to my mind right now are the form sheets on Android, which handle keyboard natively by them selves. I think I could have got insets handling there

@kirillzyusko
Copy link
Contributor Author

I think I could have got insets handling there

Well, I haven't checked yet, but maybe, yes

What I'm also confused is that (as you wrote) you were using that approach with attaching to decor view before to make statusBarTranslucent and on v3 it was working well 🤔

Will try to allocate some time to look into a fix 👀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Missing repro This issue need minimum repro scenario Platform: Android This issue is specific to Android
Projects
None yet
Development

No branches or pull requests

2 participants