[v4 JS] does not comply with statusbarPadding again

Bug Report

Ionic Info Using @ionic/core version 4.0.0-beta.11 directly from npm / CDN (like unpkg or jsdelivr). Using Chromium 69.0.3497.81 and Firefox 62.0 (Ubuntu 16.04).

Describe the Bug Ionic retrieves some configuration options from the location query parameters that start with ionic:. In particular, ionic:statusbarPadding=true adds a top margin to account for the mobile status bar / notch (iPhone X). This was fixed in version 4.0.0-beta.3 (see https://github.com/ionic-team/ionic/issues/14742), but it is broken again in version 4.0.0-beta.11; this configuration option is no longer applied.

Steps to Reproduce Steps to reproduce the behavior:

1. Go to: https://plnkr.co/edit/5l7QOnQt8LOVmRodi3UC?p=preview
2. In Chrome and Firefox, the top toolbar displays behind the simulated status bar.

Related Code

• Version 4.0.0-beta.11: https://plnkr.co/edit/5l7QOnQt8LOVmRodi3UC?p=preview (broken in Chrome 68, 69 and Firefox 62)
• Version 4.0.0-beta.4: https://plnkr.co/edit/ctZUiBljqX7GQHLeWCkL?p=preview (broken in Chrome 68, 69 and Firefox 62)
• Version 4.0.0-beta.3: https://plnkr.co/edit/GJnEC8qpfit8fWuWDdIa?p=preview (broken in Chrome 69, but works fine in Chrome 68 and Firefox 62)

Expected Behavior When the location includes the query parameter ionic:statusbarPadding=true, the App should add an extra top margin to account for the device status bar / notch.

Additional Context First reported for version 4.0.0-alpha.8 (https://github.com/ionic-team/ionic/issues/14742), was fixed in version 4.0.0-beta.3, but seems broken again since version 4.0.0-beta.4. Furthermore, even version 4.0.0-beta.3 looks broken in Chromium version 69.

[ghybs]

Hi,

Thank you a lot for the update!

I confirm that the ionic:_forceStatusbarPadding now works fine in both iOS and MD mode: https://plnkr.co/edit/sa2iCW3xHdTLWZ28N1ia?p=preview (beta.18)

As for the use case, indeed I do not use it in actual production. Nevertheless, I find it incredibly useful for demonstration purpose, and also for development.

Being able to showcase my app in a standard browser iframe side-by-side (somehow like ionic serve --lab used to do) really produces a nice effect on the audience.

Of course there are some limitations to what your app can do in such configuration. But since Ionic now also targets Progressive Web Apps, in many occasions an app does not have so many extra things that cannot run in a normal browser.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.