mWeb - Device navigation bar has borders and visible

[IuliiaHerets]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: v9.1.28-1
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from TestRail: #57281
Issue reported by: Applause Internal Team
Device used: Android 12 / Chrome
App Component: Other

Action Performed:

Precondition: logged in ND via mobile web.

1. Go to Settings > Workspace
2. Open each workspace screen
3. Scroll it

Expected Result:

Device buttons navigation bar is missing borders and barely visible.

Actual Result:

Device buttons navigation bar has borders and visible.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6802569_1744713344930.Screenrecorder-2025-04-15-10-34-14-453.mp4

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @isabelastisser (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[shubham1206agra]

I don't think this is a bug since edge to edge is only for Android native build.

[chrispader]

Yes, @shubham1206agra is correct. This is not a bug because edge-to-edge mode and therefore translucent navigation bar is an native only feature.

[chrispader]

I actually just found a recent blog post by Chrome, which shows how to migrate a website to "edge-to-edge" as well, to allow Chrome on Android to render the website edge-to-edge.

https://developer.chrome.com/docs/css-ui/edge-to-edge

I would like to try implement this in a follow-up as well. cc @lakchote @mountiny