Bugfix WebView showing gray background while loading content

mozilla-mobile · Oct 22, 2024 · 4b11c49 · 4b11c49
1 parent 552907a
commit 4b11c49
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/firefox-ios/Client/TabManagement/Tab.swift b/firefox-ios/Client/TabManagement/Tab.swift
@@ -369,10 +369,6 @@ class Tab: NSObject, ThemeApplicable, FeatureFlaggable {
             guard nightMode != oldValue else { return }
 
             webView?.evaluateJavascriptInDefaultContentWorld("window.__firefox__.NightMode.setEnabled(\(nightMode))")
-            // For WKWebView background color to take effect, isOpaque must be false,
-            // which is counter-intuitive. Default is true. The color is previously
-            // set to black in the WKWebView init.
-            webView?.isOpaque = !nightMode
 
             UserScriptManager.shared.injectUserScriptsIntoWebView(
                 webView,
@@ -532,8 +528,9 @@ class Tab: NSObject, ThemeApplicable, FeatureFlaggable {
                 webView.isInspectable = true
             }
 
-            // Night mode enables this by toggling WKWebView.isOpaque, otherwise this has no effect.
-            webView.backgroundColor = .black
+            // Set Opaque as false to customize background color for web view
+            webView.isOpaque = false
+            webView.backgroundColor = nightMode ? .black : .clear
 
             // Turning off masking allows the web content to flow outside of the scrollView's frame
             // which allows the content appear beneath the toolbars in the BrowserViewController

diff --git a/firefox-ios/Client/TabManagement/TabManagerNavDelegate.swift b/firefox-ios/Client/TabManagement/TabManagerNavDelegate.swift
@@ -15,6 +15,8 @@ class TabManagerNavDelegate: NSObject, WKNavigationDelegate {
     }
 
     func webView(_ webView: WKWebView, didCommit navigation: WKNavigation!) {
+        // restore webView content background color to default
+        webView.evaluateJavascriptInDefaultContentWorld("document.body.style.backgroundColor = '';")
         for delegate in delegates {
             delegate.webView?(webView, didCommit: navigation)
         }
@@ -77,6 +79,8 @@ class TabManagerNavDelegate: NSObject, WKNavigationDelegate {
     }
 
     func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
+        // Set webView content background to transparent so that WKCompositingView doesn't show gray background while loading
+        webView.evaluateJavascriptInDefaultContentWorld("document.body.style.backgroundColor = 'transparent';")
         for delegate in delegates {
             delegate.webView?(webView, didStartProvisionalNavigation: navigation)
         }