[Webkit-unassigned] [Bug 280181] New: Fullscreen PWAs (homescreen / web apps) do not hide navigation bar

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Mon Sep 23 05:28:35 PDT 2024


https://bugs.webkit.org/show_bug.cgi?id=280181

            Bug ID: 280181
           Summary: Fullscreen PWAs (homescreen / web apps) do not hide
                    navigation bar
           Product: WebKit
           Version: Safari 18
          Hardware: iPhone / iPad
                OS: iOS 18
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Platform
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: formularsumo at outlook.com

PWAs with the manifest member "display": "fullscreen" do not correctly enter fullscreen on iOS.

I make a PWA which can be accessed here https://formularsumo.github.io/Star-Wars-Galaxy-Collection-Web/ and used for testing. It's a game which works best in landscape mode and in fullscreen. As the requestFullscreen API is currently unsupported on iOS, the only way for users to play it in fullscreen is to install it as a PWA ("add to homescreen"). However when you launch the PWA, it still displays both the navigation bar and status bar when in portrait, and navigation bar when in landscape.

According to https://developer.mozilla.org/en-US/docs/Web/Manifest/display, the "fullscreen" value should use the "entire display area" / "entire screen", but on iOS it's not doing this. On Android, browsers such as Chrome or Firefox do correctly hide both the status and navigation bar when in fullscreen, whether in portrait or landscape. The same behaviour on iOS is essential for games to function properly.

Closely related is that swiping up to leave a fullscreen PWA does not work like it does on fullscreen native apps. Fullscreen native apps require two swipes to exit to prevent accidental gestures. One to bring up the status bar, and one to exit. Firefox on Android does have this behaviour for PWAs. Hopefully once the status bar is correctly hidden for fullscreen iOS PWAs this will be fixed alongside it, if not I can create a separate issue if needed.

For all my findings on the differences between fullscreen PWAs on different browsers/platforms see here - https://github.com/FormularSumo/Star-Wars-Galaxy-Collection-Web/issues/10

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20240923/74889f39/attachment.htm>


More information about the webkit-unassigned mailing list