PWA - Status bar background and text color on IOS 13 dark-mode

Question

I'm experiencing some trouble with my PWAs status bar color after Apple introduced the dark mode on the new IOS 13.

I used to set the "apple-mobile-web-app-status-bar-style" to "black-translucent" for a transparent background with white text on the status bar. Now, depending on the user system theme (light or dark), the text color changes from white to black and vice-versa. Because my layout uses a dark background the result is now black text over an "almost black" background.

Any workaround for this?

black-translucent - shows white text - ios12 black-translucent - shows black text - ios13

Answer 1

black-translucent seems to be a depreciated value of this meta tag. According to the user "furvy" at a discussion on apple.com: https://forums.developer.apple.com/thread/89471. He said:

Today I noticed this in the Safari remote debugger when looking at one of my Web Apps... '"black-translucent" is a deprecated apple-mobile-web-app-status-bar-style value. Support for this value will be removed in a future release.' [...]

It's so annoying also for my PWA, but this answer was in 2017 so it may be that it still worked due to a bug in iOS 12, but in iOS 13 they completely removed it.