top insets wrong value not same as safe area insets

[dhruv-00]

Description

The insets value of top is showing wrong it is not same as useSafeAreaInsets some times it shows fine and some time when app is opened with killed state notificaion

Steps to reproduce

create new react native app install unistyles and safe area context match both insets value it will be different check in the repro

Snack or a link to a repository (optional)

https://github.com/dhruv-00/unistyles-repro

Unistyles version

2.5.1

React Native version

0.73.6

Platforms

Android

Engine

JSC

Architecture

Paper (old)

[dhruv-00]

https://github.com/jpudysz/react-native-unistyles/assets/86352938/111398c6-db21-44a6-b6f8-9d

6f561ad6dd

[jpudysz]

Hello 👋

But what is the issue? That unistyles is not showing exact same values as safe-area-context?

On your example status bar is translucent or not? If not then indeed it's a bug, if it is then Unistyles reports correct value = 46.

What's your phone model / android version?
What's your setup, do you use expo? Do you use any windows flags?
If you want me to help I need a lot more details.

Also please take a look here: https://www.unistyl.es/reference/dimensions/#insets

[dhruv-00]

the issue is that normally it is working fine but when the app is in killed state and I open it with notification then the top value is not proper.
In my main app the issue is coming when opening with notification
when I tried to create it with new reproducible example then it was already showing wrong value in the first time without notification opening

phone: OnPlus 12 / Android 14
react native cli

[dhruv-00]

after setting status bar translucent

[jpudysz]

Ok, so you don't have satus bar translucent, and it happens only if you open the app from push notification?

[dhruv-00]

yes exactly, and my main app is react-native 0.72.6
but in the reproducible example it is latest version and it is reproducible without opening the notification

[jpudysz]

Ok to sum it up:

Android 14 with RN 0.73, Unistyles 2.5.1, when you open fresh app you're receiving invalid top inset (but not always).
You're not using expo.

So the last question:
Did you modify anyhow window flags? Example is in the documentation posted above.

[dhruv-00]

No I did not change any windows flags

[jpudysz]

Cool, thanks for the report. I'm a little bit surprised as Android 14 has a stable inset API. Maybe it's something about OnePlus

[jpudysz]

I will be able to get OnePlus with Android 14 on Tuesday (after Easter). I will debug it directly 🙏

[efstathiosntonas]

@jpudysz 2.5.2 fixes this or it's unrelated?

[jpudysz]

It was not addressed specifically for this issue. I will debug this report tomorrow with OnePlus device 🙏

[jpudysz]

Hey @dhruv-00 can you check how it works with fresh release (2.5.2 )?

[dhruv-00]

let me check I'll update you

[dhruv-00]

@jpudysz I'm not able to reproduce in the example I provided but in my main app which is using react native "0.72.6" normally it is working but when app is opened from notification in kill state it is still providing wrong value

[jpudysz]

Ok thanks for the tests. Tomorrow, I will setup deeplinking and try to repro it with OnePlus 🙏

[jpudysz]

Tested on OnePlus 9 Pro with Android 14.

1. Opening app from killed state with deeplinking:

npx uri-scheme open unistyles:// --android

Shows always top=0.

2. I was able to reproduce double reporting with:

 <StatusBar translucent />

 (NOBRIDGE) LOG  Bridgeless mode is enabled
 (NOBRIDGE) LOG  Running "bare" with {"rootTag":51,"initialProps":{},"fabric":true}
 (NOBRIDGE) LOG  UnistylesRuntime.insets: 0
 (NOBRIDGE) LOG  UnistylesRuntime.insets: 32

But it's because StatusBar is rendered in JSX, so it happends after first re-render.

Any other idea how can I test it?

[dhruv-00]

On which react native version you are trying it?

[jpudysz]

0.74-rc.5 and 0.73.6 in your example

[jpudysz]

Tried your example with 0.72.6:

hmm, any ideas whats different in your app?

EDIT:

same output with:

npx uri-scheme open unistyles:// --android

[dhruv-00]

first one is with notification and second one is with uri scheme
https://github.com/jpudysz/react-native-unistyles/assets/86352938/942aee07-4b4c-4a01-8280-933a5d2cb8c5

[jpudysz]

Ok, so I need to setup Firebase project 🫡

[dhruv-00]

Are there any steps by which I can debug this? 
may be looking into any specific files.
which you think might be causing the issue.

[jpudysz]

You would need to debug kotlin files..
Let me firstly try with some push notification. I just hope I will be able to repro and isolate the issue

[jpudysz]

Reproduced!

[jpudysz]

That was extremely difficult to spot, but thanks to you, Unistyles can now properly initialize in headless mode.

The issue was that layout listeners were not being properly set when the app was initializing from headless mode, e.g. from a push notification. You should now receive the correct value.

Disclaimer:
Unistyles will emit two insets events when run in headless mode, but this should not be visible to the end user.
It's possible to emit a single event, but I need to refactor how the C++ module works, so most likely, this will be implemented in Unistyles 3.0.

I will release Unistyles 2.5.3 soon 🎉