Skip to content

Instantly share code, notes, and snippets.

@kevinlinv

kevinlinv/index.html Secret

Last active November 8, 2021 06:36
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kevinlinv/2de60478ffec6a2f18f1ec0fc6f5add9 to your computer and use it in GitHub Desktop.
Save kevinlinv/2de60478ffec6a2f18f1ec0fc6f5add9 to your computer and use it in GitHub Desktop.
Download ZIP
BrowserView.setBackgroundColor regression
Raw
index.html
<!DOCTYPE html>
<html>
<body>
<h1>Expecting the background of the view to be blue</h1>
<script src="./renderer.js"></script>
</body>
</html>
Raw
main.js
// Modules to control application life and create native browser window
const {app, BrowserWindow, BrowserView} = require('electron')
app.whenReady().then(() => {
const mainWindow = new BrowserWindow()
mainWindow.setBackgroundColor('#000')
const view = new BrowserView()
view.webContents.loadFile('index.html');
//
// Test Case 1 - expected the background of the content to be #1224fa (blue) - matches the view background
//
// Test Case 2 - comment the setBackgroundColor - expected the background transparent and can see the window's backround color (black)
//
view.setBackgroundColor('#1224fa');
const { width, height } = mainWindow.getContentBounds();
mainWindow.addBrowserView(view);
view.setBounds({ x: 0, y: 0, width, height })
})
Raw
package.json
{
"name": "11 - view set background color bug",
"productName": "11 - view set background color bug",
"description": "My Electron application description",
"keywords": [],
"main": "./main.js",
"version": "1.0.0",
"author": "kevin",
"scripts": {
"start": "electron ."
},
"dependencies": {},
"devDependencies": {
"electron": "14.0.1"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment