[Webkit-unassigned] [Bug 262212] New: Web apps added to homescreen do not dynamically respect the OS appearance on change

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Wed Sep 27 14:25:00 PDT 2023


            Bug ID: 262212
           Summary: Web apps added to homescreen do not dynamically
                    respect the OS appearance on change
           Product: WebKit
           Version: Safari 17
          Hardware: iPhone / iPad
                OS: iOS 17
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: mlettini at gmail.com
                CC: bfulgham at webkit.org, simon.fraser at apple.com,
                    zalan at apple.com

We have a PWA that includes a site.manifest file which includes `display: standalone`. When added to a phone’s home screen, this display property renders the app as if it were a standalone application, with no Safari browser UI. This is all good and expected.

However, after adding to home screen, if your OS changes appearance between light and dark mode while the app is open, the app will not also dynamically change it’s appearance to match (even though the HTML and CSS are set up with explicit light and dark mode designs). The only solution is to completely close the app and reopen it, and then it will be in the new OS appearance. This is unexpected, since both Safari websites and other native apps change their appearance dynamically to match the OS at the moment the OS’s appearance changes.

Steps to reproduce:

1. Have a web app that includes HTML and CSS necessary to have different appearances when prefers-color-scheme is light or dark mode.
2. Add a site.manifest file with the property `display: standalone` or `display: fullscreen` (may also need a `scope` property).
3. Add that web app to the home screen.
4. Open the app.
5. Using the iOS control center, change the appearance of the OS between light and dark mode. You will see that other apps change along with this toggle, while this PWA does not.

Possibly related to: https://bugs.webkit.org/show_bug.cgi?id=259328 ?

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/20230927/1adb977b/attachment.htm>

More information about the webkit-unassigned mailing list