bug: iOS WebView background color configuration option not showing due to background isOpaque setting

[jcroucher]

I am trying to set the WebView background color using the capacitor.config.json file with the param "backgroundColor": "#000000"

I can see the value is going through to the Swift code in CAPBridgeViewController.swift in this block

if let backgroundColor = configuration.backgroundColor {
            aWebView.backgroundColor = backgroundColor
            aWebView.scrollView.backgroundColor = backgroundColor
        } else if #available(iOS 13, *) {
            // Use the system background colors if background is not set by user
            aWebView.backgroundColor = UIColor.systemBackground
            aWebView.scrollView.backgroundColor = UIColor.systemBackground
        }

If I make a change to the block of code setting it to opaque it then works

if let backgroundColor = configuration.backgroundColor {
            aWebView.isOpaque = false
            aWebView.backgroundColor = backgroundColor
            aWebView.scrollView.backgroundColor = backgroundColor
        } else if #available(iOS 13, *) {
            // Use the system background colors if background is not set by user
            aWebView.backgroundColor = UIColor.systemBackground
            aWebView.scrollView.backgroundColor = UIColor.systemBackground
        }

[jcesarmobile]

can you provide a sample app?

isOpaque should be set to false if the WebView is transparent, which is not the case, so not sure how setting it to opaque would help in this situation

[jcroucher]

Attached is a full dump of a test project

To reproduce

init npm create www folder and add index.html. Set the css body bg to transparent install capacitor install capacitor ios init ios update capacitor.config.json add backgroundColor property npx cap sync deploy to ios. background is white

edit Pods/Development Pods/Capacitor/CAPBridgeViewController Add

aWebView.isOpaque = false

to line 292 under the line

if let backgroundColor = configuration.backgroundColor {

Rebuild and deplploy

Background color set in capacitor.conf.json now appears

testtb.zip

And I agree I would have thought isOpaque should be "true" not "false" but I assume I am misunderstanding where the color is actually being set.

Usually, I would just set the BG with CSS, but I have a camera preview on the page. The page needs to be set to transparent so the camera preview can be seen as its sits below the page. This causes a white flash before the camera preview appears. I need to be able to set the app WebView to black.

[florian72810]

Still present in Capacitor-iOS 4.1.0

I can also provide a sample app.