software-mansion / software-mansion/react-native-screens

Android ComposeView, Composable is gone upon returning to Screen from stack

Open
#2,098 6 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

missing-repro platform:android
Dominant language
TypeScript
Stars
3.7k
Forks
714
Avg merge
2d 23h
Merged PRs (30d)
71

Description

Description

tldr; Jetpack ComposeViews do not maintain state or recompose upon returning to a Screen with a ComposeView driving a component of the Screen.

Suppose you have three screens, screens A, B and C

Screen B has a View that links to a ComposeView(..) from Android
Navigating to Screen C, then returning to Screen B, the ComposeView driven component is gone

According to this issue tracker, https://issuetracker.google.com/issues/284424175, the issue lies within how ScreenFragment recycles the views
https://github.com/software-mansion/react-native-screens/blob/main/android/src/main/java/com/swmansion/rnscreens/ScreenFragment.kt#L307-L321

https://github.com/react-native-community/discussions-and-proposals/issues/446#issuecomment-1012686694

Project to repro (thanks to @thevoiceless) - https://github.com/thevoiceless/RN-Compose-Playground

https://github.com/software-mansion/react-native-screens/assets/3791583/e0a08eb2-4eab-4ca1-ae8e-a3c4e37d1688

Steps to reproduce
  1. Use a SimpleViewManager to wrap a ComposeView
  2. Build the ComposeView with a simple Text(..)
  3. But that ComposeView in Screen A
  4. Navigate to Screen B
  5. Navigate BACK to Screen A
  6. Notice that the ComposeView is gone but the wrapper of the view itself is still in the hierarchy
Snack or a link to a repository

https://github.com/thevoiceless/RN-Compose-Playground

Screens version

3.21.0

React Native version

0.73.5

Platforms

Android

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with ScreenFragment.kt around lines 307-321 and reproduce the issue using the linked RN-Compose-Playground project. Trace how the ComposeView is handled when navigating away from and back to the screen, then verify that its content remains present and recomposes after returning.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, kotlin, react-native
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.