[Bug]: browserWindow.setBackgroundColor() does not work without resizing the window

[miniak]

Preflight Checklist

• I have read the Contributing Guidelines for this project.
• I agree to follow the Code of Conduct that this project adheres to.
• I have searched the issue tracker for a bug report that matches the one I want to file, without success.

Electron Version

23.2.0

What operating system are you using?

macOS

Operating System Version

macOS Monterey 12.6.3

What arch are you using?

arm64 (including Apple Silicon)

Last Known Working Electron version

No response

Expected Behavior

Calling browserWindow.setBackgroundColor() at any time works properly

Actual Behavior

Calling browserWindow.setBackgroundColor() when the window is already visible (with setTimeout for example) does not work until the window is resized by the user or programmatically

Testcase Gist URL

No response

Additional Information

const {app, BrowserWindow} = require('electron')

function createWindow () {
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
  })

  setTimeout(() => {
    mainWindow.setBackgroundColor('#80ff0000')
  }, 1000)

  mainWindow.loadFile('about:blank')
}

app.whenReady().then(() => {
  createWindow()
})

app.on('window-all-closed', function () {
  app.quit()
})

[miniak]

This seems to be fixing the issue

diff --git a/shell/browser/api/electron_api_browser_window.cc b/shell/browser/api/electron_api_browser_window.cc
index b92954814d..18af1c5186 100644
--- a/shell/browser/api/electron_api_browser_window.cc
+++ b/shell/browser/api/electron_api_browser_window.cc
@@ -330,8 +330,9 @@ void BrowserWindow::SetBackgroundColor(const std::string& color_name) {
   auto* rwhv = web_contents()->GetRenderWidgetHostView();
   if (rwhv) {
     rwhv->SetBackgroundColor(color);
-    static_cast<content::RenderWidgetHostViewBase*>(rwhv)
-        ->SetContentBackgroundColor(color);
+    auto* rwhv_base = static_cast<content::RenderWidgetHostViewBase*>(rwhv);
+    rwhv_base->SetContentBackgroundColor(color);
+    rwhv_base->RequestRepaintForTesting();
   }
   // Also update the web preferences object otherwise the view will be reset on
   // the next load URL call

[johnlindquist]

@miniak Do you have a recommended programmatic workaround until this is sorted?

[johnlindquist]

Also, the behavior is a little for me:

1. Use setBackgroundColor()
2. Background color successfully changes
3. Wait somewhere between 1-10 seconds (I don't know why it's random)
4. Color unsets

Note: Using getBackgroundColor() will still print the correct value, but the color visually disappears from the window.

  setInterval(() => {
    console.log(`Background color:`, win?.getBackgroundColor())
  }, 1000)

This is what it looks like on my machine. The only code I'm adding to a basic starter template:

  setTimeout(() => {
    win?.setBackgroundColor(`rgba(255, 0, 0, 0.5)`)
    console.log(win?.getBackgroundColor())
  }, 3000)

CleanShot.2023-04-14.at.14.19.44.mp4

[codebytere]

@johnlindquist it looks like you have some transparency being applied to the window - could you possibly attach a Fiddle repro?

[johnlindquist]

@codebytere Thanks for following up!

Here's the fiddle gist:

https://gist.github.com/johnlindquist/9b5953b9d62ed635515b0275e24a50b6

I do need to wait ~7 seconds for it to happen. You can also trigger the bug by resizing the window.

Things I changed:

• transparent: true
• vibrancy: "hub"
• used setBackgroundColor with transparency
• added a setInterval so the dom updates (the bug didn't trigger if the dom wasn't updating, unless I resized it)

CleanShot.2023-04-19.at.13.37.51.mp4

[codebytere]

I addressed something similar a while ago 🤔 #32593

I'll take a look soon!

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. If you have any new additional information—in particular, if this is still reproducible in the latest version of Electron or in the beta—please include it with your comment!

[johnlindquist]

Still seeing this in 26.0.0-beta.7

[electron-issue-triage]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. If you have any new additional information—in particular, if this is still reproducible in the latest version of Electron or in the beta—please include it with your comment!

[electron-issue-triage]

This issue has been closed due to inactivity, and will not be monitored. If this is a bug and you can reproduce this issue on a supported version of Electron please open a new issue and include instructions for reproducing the issue.