Conversation
The window insets listener can fire before the WebView has a document, so `document.documentElement` is null and the injected script logs "Cannot read properties of null (reading 'style')" on startup. Apply the values immediately when `document.documentElement` exists, otherwise apply the most recent values once on `DOMContentLoaded`. Closes ionic-team#8530
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The window insets listener can fire before the WebView has a document (first layout, or when the host app calls
requestApplyInsetsearly). At that pointdocument.documentElementis null, so the script injected byinjectSafeAreaCSS()throws and logs this on startup:This change applies the
--safe-area-inset-*values right away whendocument.documentElementexists, which is the same as before. If it doesn't exist yet, the values are applied once onDOMContentLoadedinstead. If several calls come in before the document is ready, only one listener is added and it uses the most recent values. If a later call finds the document and applies values first, the pending ones are dropped, so older insets can't overwrite newer ones. Errors fromsetPropertyare still caught and logged as before.Closes #8530
Testing
./gradlew build test -b capacitor/build.gradle(same asnpm run verifyinandroid/) passes with JDK 21, including lint. Prettier (prettier-plugin-javawith@ionic/prettier-config) reports no changes for the file.SystemBars.javais identical tomain),viewport-fit=cover, defaultinsetsHandling, on an API 36 arm64 emulator with WebView 133:0px, since WebView < 140 takes the native padding path here).console.logs showed both paths working. Most launches applied the values immediately. On one launch the first three calls were deferred, then the values were applied once onDOMContentLoaded(onhttps://localhost/), followed by the normal call afteronPageCommitVisible.documentto check: document present (applied immediately), document missing (no error, oneDOMContentLoadedlistener), repeated calls before the document exists (latest values win), a deferred call followed by an immediate one (stale values not applied), andsetPropertythrowing (still logged).I couldn't test the pass-through branch with non-zero values on a real device (it needs WebView 140+), but that branch uses the same script.
The same script is on
next(whereinsetsHandlingnow defaults tonative, butcssstill uses it), and this patch applies there cleanly. iOS doesn't inject these variables, so it has no equivalent issue.