Is there an existing request?
Describe the feature request
Current behavior
On iOS Safari, when a React Native Web screen uses an inner ScrollView as the main scrolling container, Safari does not collapse its bottom browser bar while scrolling.
If the same screen is changed to use normal document scrolling instead of an inner ScrollView, Safari collapses the bottom bar as expected.
This makes mobile web apps feel less native/fullscreen when built with RN Web scrolling primitives.
Expected behavior
Ideally, there would be a recommended RN Web pattern for pages that need:
- Safari browser chrome collapse
- document-level scrolling behavior
- while still using RN Web components
At minimum, I would like to confirm whether this is expected browser behavior or a known RN Web limitation.
Reproduction
Minimal pattern:
- Render a full-height RN Web app shell
- Disable body scroll / let the app root fill the viewport
- Use a
ScrollView as the main page scroll container
- Open the page in iOS Safari
- Scroll down
Actual result
The inner content scrolls, but Safari keeps the bottom address bar visible.
Comparison
If I replace the inner ScrollView with a plain View and let the document itself scroll, Safari collapses the bottom bar normally.
Question
Is this expected because RN Web ScrollView uses an inner scroll container and Safari only collapses browser chrome on document viewport scroll?
If yes, is there a recommended approach for RN Web apps that need Safari fullscreen-like scrolling behavior on iOS?
Environment
- expo: ^54.0.33
- react-native-web: ^0.21.0
- react-native: 0.81.5
- react: 19.1.0
- react-dom: 19.1.0
- expo-router: ~6.0.23
- Platform: iOS Safari
Is there an existing request?
Describe the feature request
Current behavior
On iOS Safari, when a React Native Web screen uses an inner
ScrollViewas the main scrolling container, Safari does not collapse its bottom browser bar while scrolling.If the same screen is changed to use normal document scrolling instead of an inner
ScrollView, Safari collapses the bottom bar as expected.This makes mobile web apps feel less native/fullscreen when built with RN Web scrolling primitives.
Expected behavior
Ideally, there would be a recommended RN Web pattern for pages that need:
At minimum, I would like to confirm whether this is expected browser behavior or a known RN Web limitation.
Reproduction
Minimal pattern:
ScrollViewas the main page scroll containerActual result
The inner content scrolls, but Safari keeps the bottom address bar visible.
Comparison
If I replace the inner
ScrollViewwith a plainViewand let the document itself scroll, Safari collapses the bottom bar normally.Question
Is this expected because RN Web
ScrollViewuses an inner scroll container and Safari only collapses browser chrome on document viewport scroll?If yes, is there a recommended approach for RN Web apps that need Safari fullscreen-like scrolling behavior on iOS?
Environment