Created
April 15, 2021 18:50
-
-
Save Jelmerro/37b92f38f767d7942334f218c254cd1d to your computer and use it in GitHub Desktop.
webview visibility updates are broken
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
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Hello World!</title> | |
| <link href="./styles.css" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <h1>Hello World!</h1> | |
| <button class="button1">Toggle display</button> | |
| <button class="button2">Minimize then toggle</button> | |
| <button class="button3">Maximize, minimize and then toggle</button> | |
| <webview src="./index.html"></webview> | |
| </body> | |
| </html> |
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
| const {app, BrowserWindow, ipcMain} = require('electron') | |
| const path = require('path') | |
| let mainWindow | |
| function createWindow () { | |
| mainWindow = new BrowserWindow({ | |
| width: 800, | |
| height: 600, | |
| frame: false, | |
| webPreferences: { | |
| preload: path.join(__dirname, 'renderer.js'), | |
| contextIsolation: false, | |
| webviewTag: true | |
| } | |
| }) | |
| mainWindow.webContents.once("did-finish-load", () => { | |
| mainWindow.webContents.on("will-attach-webview", (_, prefs) => { | |
| prefs.preload = path.join(__dirname, 'preload.js') | |
| prefs.contextIsolation = false | |
| }) | |
| }) | |
| mainWindow.loadFile('index.html') | |
| } | |
| app.whenReady().then(createWindow) | |
| ipcMain.on("minimize", () => mainWindow.minimize()) | |
| ipcMain.on("maximize-then-minimize", () => { | |
| mainWindow.maximize() | |
| setTimeout(() => { | |
| mainWindow.minimize() | |
| }, 200) | |
| }) |
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
| window.addEventListener("load", () => { | |
| document.querySelector("h1").textContent = "Hello Webview!" | |
| ;[...document.querySelectorAll("button")].forEach(b => b.remove()) | |
| const {ipcRenderer} = require("electron") | |
| window.addEventListener("visibilitychange", () => { | |
| ipcRenderer.sendToHost("data", document.visibilityState) | |
| }) | |
| }) |
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
| const {ipcRenderer} = require("electron") | |
| let webview | |
| const toggleVisibility = () => { | |
| if (webview.style.display === "none") { | |
| webview.style.display = "inherit" | |
| log("set: visible") | |
| } else { | |
| webview.style.display = "none" | |
| log("set: hidden") | |
| } | |
| } | |
| const log = text => { | |
| const el = document.createElement("div") | |
| el.textContent = text | |
| document.body.appendChild(el) | |
| } | |
| window.addEventListener("DOMContentLoaded", () => { | |
| document.querySelector("h1").textContent = "Hello Renderer!" | |
| webview = document.querySelector("webview") | |
| document.querySelector(".button1").addEventListener("click", toggleVisibility) | |
| document.querySelector(".button2").addEventListener("click", () => { | |
| ipcRenderer.send("minimize") | |
| log("minimize") | |
| setTimeout(toggleVisibility, 1000) | |
| }) | |
| document.querySelector(".button3").addEventListener("click", () => { | |
| ipcRenderer.send("maximize-then-minimize") | |
| log("maximize then minimize") | |
| setTimeout(toggleVisibility, 1000) | |
| }) | |
| webview.addEventListener("ipc-message", e => document.body.lastChild.textContent += `, actual: ${e.args[0]}`) | |
| }) |
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
| webview {border: 2px solid #000;} | |
| webview {position: absolute;top: 200px;left: 200px;} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment