electrobun 1.12.1-beta.2 → 1.12.1-beta.3

package/dist/api/bun/core/Updater.ts

@@ -10,7 +10,7 @@ import {
 } from "fs";
 import { execSync } from "child_process";
 import { OS as currentOS, ARCH as currentArch } from "../../shared/platform";
-import { getPlatformPrefix, getTarballFileName } from "../../shared/naming";
+import { getPlatformPrefix, getTarballFileName, getAppFileName } from "../../shared/naming";
 import { quit } from "./Utils";
 
 // Update status types for granular progress tracking
@@ -854,10 +854,8 @@ const Updater = {
 					}
 				} else if (currentOS === "win") {
 					// On Windows, the actual app is inside a subdirectory
-					// Use same sanitization as extractor: remove spaces and dots
-					const appBundleName = localInfo.name
-						.replace(/ /g, "")
-						.replace(/\./g, "-");
+					// Use same naming logic as CLI and extractor
+					const appBundleName = getAppFileName(localInfo.name, localInfo.channel);
 					newAppBundlePath = join(extractionDir, appBundleName);
 
 					// Verify the extracted app exists
@@ -1043,7 +1041,7 @@ del "%~f0"
 				if (currentOS === "macos") {
 					// Use a detached shell so relaunch survives after killApp terminates the current process
 					// eslint-disable-next-line @typescript-eslint/no-explicit-any
-					await Bun.spawn(["sh", "-c", `open "${runningAppBundlePath}" &`], {
+					Bun.spawn(["sh", "-c", `open "${runningAppBundlePath}" &`], {
 						detached: true,
 					} as any);
 				} else if (currentOS === "linux") {

package/dist/api/bun/preload/.generated/compiled.ts

@@ -2,7 +2,7 @@
 // Run "bun build.ts" or "bun build:dev" from the package folder to regenerate.
 
 // Full preload for trusted webviews (RPC, encryption, drag regions, webview tags)
-export const preloadScript = "(() => {\n  // src/bun/preload/encryption.ts\n  function base64ToUint8Array(base64) {\n    return new Uint8Array(atob(base64).split(\"\").map((char) => char.charCodeAt(0)));\n  }\n  function uint8ArrayToBase64(uint8Array) {\n    let binary = \"\";\n    for (let i = 0;i < uint8Array.length; i++) {\n      binary += String.fromCharCode(uint8Array[i]);\n    }\n    return btoa(binary);\n  }\n  async function generateKeyFromBytes(rawKey) {\n    return await window.crypto.subtle.importKey(\"raw\", rawKey, { name: \"AES-GCM\" }, true, [\"encrypt\", \"decrypt\"]);\n  }\n  async function initEncryption() {\n    const secretKey = await generateKeyFromBytes(new Uint8Array(window.__electrobunSecretKeyBytes));\n    const encryptString = async (plaintext) => {\n      const encoder = new TextEncoder;\n      const encodedText = encoder.encode(plaintext);\n      const iv = window.crypto.getRandomValues(new Uint8Array(12));\n      const encryptedBuffer = await window.crypto.subtle.encrypt({ name: \"AES-GCM\", iv }, secretKey, encodedText);\n      const encryptedData = new Uint8Array(encryptedBuffer.slice(0, -16));\n      const tag = new Uint8Array(encryptedBuffer.slice(-16));\n      return {\n        encryptedData: uint8ArrayToBase64(encryptedData),\n        iv: uint8ArrayToBase64(iv),\n        tag: uint8ArrayToBase64(tag)\n      };\n    };\n    const decryptString = async (encryptedDataB64, ivB64, tagB64) => {\n      const encryptedData = base64ToUint8Array(encryptedDataB64);\n      const iv = base64ToUint8Array(ivB64);\n      const tag = base64ToUint8Array(tagB64);\n      const combinedData = new Uint8Array(encryptedData.length + tag.length);\n      combinedData.set(encryptedData);\n      combinedData.set(tag, encryptedData.length);\n      const decryptedBuffer = await window.crypto.subtle.decrypt({ name: \"AES-GCM\", iv }, secretKey, combinedData);\n      const decoder = new TextDecoder;\n      return decoder.decode(decryptedBuffer);\n    };\n    window.__electrobun_encrypt = encryptString;\n    window.__electrobun_decrypt = decryptString;\n  }\n\n  // src/bun/preload/internalRpc.ts\n  var pendingRequests = {};\n  var requestId = 0;\n  var isProcessingQueue = false;\n  var sendQueue = [];\n  function processQueue() {\n    if (isProcessingQueue) {\n      setTimeout(processQueue);\n      return;\n    }\n    if (sendQueue.length === 0)\n      return;\n    isProcessingQueue = true;\n    const batch = JSON.stringify(sendQueue);\n    sendQueue.length = 0;\n    window.__electrobunInternalBridge?.postMessage(batch);\n    setTimeout(() => {\n      isProcessingQueue = false;\n    }, 2);\n  }\n  function send(type, payload) {\n    sendQueue.push(JSON.stringify({ type: \"message\", id: type, payload }));\n    processQueue();\n  }\n  function request(type, payload) {\n    return new Promise((resolve, reject) => {\n      const id = `req_${++requestId}_${Date.now()}`;\n      pendingRequests[id] = { resolve, reject };\n      sendQueue.push(JSON.stringify({\n        type: \"request\",\n        method: type,\n        id,\n        params: payload,\n        hostWebviewId: window.__electrobunWebviewId\n      }));\n      processQueue();\n      setTimeout(() => {\n        if (pendingRequests[id]) {\n          delete pendingRequests[id];\n          reject(new Error(`Request timeout: ${type}`));\n        }\n      }, 1e4);\n    });\n  }\n  function handleResponse(msg) {\n    if (msg && msg.type === \"response\" && msg.id) {\n      const pending = pendingRequests[msg.id];\n      if (pending) {\n        delete pendingRequests[msg.id];\n        if (msg.success)\n          pending.resolve(msg.payload);\n        else\n          pending.reject(msg.payload);\n      }\n    }\n  }\n\n  // src/bun/preload/dragRegions.ts\n  function isAppRegionDrag(e) {\n    const target = e.target;\n    if (!target || !target.closest)\n      return false;\n    const draggableByStyle = target.closest('[style*=\"app-region\"][style*=\"drag\"]');\n    const draggableByClass = target.closest(\".electrobun-webkit-app-region-drag\");\n    return !!(draggableByStyle || draggableByClass);\n  }\n  function initDragRegions() {\n    document.addEventListener(\"mousedown\", (e) => {\n      if (isAppRegionDrag(e)) {\n        send(\"startWindowMove\", { id: window.__electrobunWindowId });\n      }\n    });\n    document.addEventListener(\"mouseup\", (e) => {\n      if (isAppRegionDrag(e)) {\n        send(\"stopWindowMove\", { id: window.__electrobunWindowId });\n      }\n    });\n  }\n\n  // src/bun/preload/webviewTag.ts\n  var webviewRegistry = {};\n\n  class ElectrobunWebviewTag extends HTMLElement {\n    webviewId = null;\n    maskSelectors = new Set;\n    lastRect = { x: 0, y: 0, width: 0, height: 0 };\n    resizeObserver = null;\n    positionCheckLoop = null;\n    transparent = false;\n    passthroughEnabled = false;\n    hidden = false;\n    autoHidden = false;\n    sandboxed = false;\n    _eventListeners = {};\n    constructor() {\n      super();\n    }\n    connectedCallback() {\n      requestAnimationFrame(() => this.initWebview());\n    }\n    disconnectedCallback() {\n      if (this.webviewId !== null) {\n        send(\"webviewTagRemove\", { id: this.webviewId });\n        delete webviewRegistry[this.webviewId];\n      }\n      if (this.resizeObserver)\n        this.resizeObserver.disconnect();\n      if (this.positionCheckLoop)\n        clearInterval(this.positionCheckLoop);\n    }\n    async initWebview() {\n      const rect = this.getBoundingClientRect();\n      this.lastRect = {\n        x: rect.x,\n        y: rect.y,\n        width: rect.width,\n        height: rect.height\n      };\n      const url = this.getAttribute(\"src\");\n      const html = this.getAttribute(\"html\");\n      const preload = this.getAttribute(\"preload\");\n      const partition = this.getAttribute(\"partition\");\n      const renderer = this.getAttribute(\"renderer\") || \"native\";\n      const masks = this.getAttribute(\"masks\");\n      const sandbox = this.hasAttribute(\"sandbox\");\n      this.sandboxed = sandbox;\n      if (masks) {\n        masks.split(\",\").forEach((s) => this.maskSelectors.add(s.trim()));\n      }\n      try {\n        const webviewId = await request(\"webviewTagInit\", {\n          hostWebviewId: window.__electrobunWebviewId,\n          windowId: window.__electrobunWindowId,\n          renderer,\n          url,\n          html,\n          preload,\n          partition,\n          frame: {\n            width: rect.width,\n            height: rect.height,\n            x: rect.x,\n            y: rect.y\n          },\n          navigationRules: null,\n          sandbox\n        });\n        this.webviewId = webviewId;\n        this.id = `electrobun-webview-${webviewId}`;\n        webviewRegistry[webviewId] = this;\n        this.setupObservers();\n        this.syncDimensions(true);\n      } catch (err) {\n        console.error(\"Failed to init webview:\", err);\n      }\n    }\n    setupObservers() {\n      this.resizeObserver = new ResizeObserver(() => this.syncDimensions());\n      this.resizeObserver.observe(this);\n      this.positionCheckLoop = setInterval(() => this.syncDimensions(), 100);\n    }\n    syncDimensions(force = false) {\n      if (this.webviewId === null)\n        return;\n      const rect = this.getBoundingClientRect();\n      const newRect = {\n        x: rect.x,\n        y: rect.y,\n        width: rect.width,\n        height: rect.height\n      };\n      if (newRect.width === 0 && newRect.height === 0) {\n        if (!this.hidden) {\n          this.autoHidden = true;\n          this.toggleHidden(true);\n        }\n        this.lastRect = newRect;\n        return;\n      }\n      if (this.autoHidden) {\n        this.autoHidden = false;\n        this.toggleHidden(false);\n      }\n      if (!force && newRect.x === this.lastRect.x && newRect.y === this.lastRect.y && newRect.width === this.lastRect.width && newRect.height === this.lastRect.height) {\n        return;\n      }\n      this.lastRect = newRect;\n      const masks = [];\n      this.maskSelectors.forEach((selector) => {\n        try {\n          document.querySelectorAll(selector).forEach((el) => {\n            const mr = el.getBoundingClientRect();\n            masks.push({\n              x: mr.x - rect.x,\n              y: mr.y - rect.y,\n              width: mr.width,\n              height: mr.height\n            });\n          });\n        } catch (_e) {}\n      });\n      send(\"webviewTagResize\", {\n        id: this.webviewId,\n        frame: newRect,\n        masks: JSON.stringify(masks)\n      });\n    }\n    loadURL(url) {\n      if (this.webviewId === null)\n        return;\n      this.setAttribute(\"src\", url);\n      send(\"webviewTagUpdateSrc\", { id: this.webviewId, url });\n    }\n    loadHTML(html) {\n      if (this.webviewId === null)\n        return;\n      send(\"webviewTagUpdateHtml\", { id: this.webviewId, html });\n    }\n    reload() {\n      if (this.webviewId !== null)\n        send(\"webviewTagReload\", { id: this.webviewId });\n    }\n    goBack() {\n      if (this.webviewId !== null)\n        send(\"webviewTagGoBack\", { id: this.webviewId });\n    }\n    goForward() {\n      if (this.webviewId !== null)\n        send(\"webviewTagGoForward\", { id: this.webviewId });\n    }\n    async canGoBack() {\n      if (this.webviewId === null)\n        return false;\n      return await request(\"webviewTagCanGoBack\", {\n        id: this.webviewId\n      });\n    }\n    async canGoForward() {\n      if (this.webviewId === null)\n        return false;\n      return await request(\"webviewTagCanGoForward\", {\n        id: this.webviewId\n      });\n    }\n    toggleTransparent(value) {\n      if (this.webviewId === null)\n        return;\n      this.transparent = value !== undefined ? value : !this.transparent;\n      send(\"webviewTagSetTransparent\", {\n        id: this.webviewId,\n        transparent: this.transparent\n      });\n    }\n    togglePassthrough(value) {\n      if (this.webviewId === null)\n        return;\n      this.passthroughEnabled = value !== undefined ? value : !this.passthroughEnabled;\n      send(\"webviewTagSetPassthrough\", {\n        id: this.webviewId,\n        enablePassthrough: this.passthroughEnabled\n      });\n    }\n    toggleHidden(value) {\n      if (this.webviewId === null)\n        return;\n      this.hidden = value !== undefined ? value : !this.hidden;\n      send(\"webviewTagSetHidden\", { id: this.webviewId, hidden: this.hidden });\n    }\n    addMaskSelector(selector) {\n      this.maskSelectors.add(selector);\n      this.syncDimensions(true);\n    }\n    removeMaskSelector(selector) {\n      this.maskSelectors.delete(selector);\n      this.syncDimensions(true);\n    }\n    setNavigationRules(rules) {\n      if (this.webviewId !== null) {\n        send(\"webviewTagSetNavigationRules\", { id: this.webviewId, rules });\n      }\n    }\n    findInPage(searchText, options) {\n      if (this.webviewId === null)\n        return;\n      const forward = options?.forward !== false;\n      const matchCase = options?.matchCase || false;\n      send(\"webviewTagFindInPage\", {\n        id: this.webviewId,\n        searchText,\n        forward,\n        matchCase\n      });\n    }\n    stopFindInPage() {\n      if (this.webviewId !== null)\n        send(\"webviewTagStopFind\", { id: this.webviewId });\n    }\n    openDevTools() {\n      if (this.webviewId !== null)\n        send(\"webviewTagOpenDevTools\", { id: this.webviewId });\n    }\n    closeDevTools() {\n      if (this.webviewId !== null)\n        send(\"webviewTagCloseDevTools\", { id: this.webviewId });\n    }\n    toggleDevTools() {\n      if (this.webviewId !== null)\n        send(\"webviewTagToggleDevTools\", { id: this.webviewId });\n    }\n    on(event, listener) {\n      if (!this._eventListeners[event])\n        this._eventListeners[event] = [];\n      this._eventListeners[event].push(listener);\n    }\n    off(event, listener) {\n      if (!this._eventListeners[event])\n        return;\n      const idx = this._eventListeners[event].indexOf(listener);\n      if (idx !== -1)\n        this._eventListeners[event].splice(idx, 1);\n    }\n    emit(event, detail) {\n      const listeners = this._eventListeners[event];\n      if (listeners) {\n        const customEvent = new CustomEvent(event, { detail });\n        listeners.forEach((fn) => fn(customEvent));\n      }\n    }\n    get src() {\n      return this.getAttribute(\"src\");\n    }\n    set src(value) {\n      if (value) {\n        this.setAttribute(\"src\", value);\n        if (this.webviewId !== null)\n          this.loadURL(value);\n      } else {\n        this.removeAttribute(\"src\");\n      }\n    }\n    get html() {\n      return this.getAttribute(\"html\");\n    }\n    set html(value) {\n      if (value) {\n        this.setAttribute(\"html\", value);\n        if (this.webviewId !== null)\n          this.loadHTML(value);\n      } else {\n        this.removeAttribute(\"html\");\n      }\n    }\n    get preload() {\n      return this.getAttribute(\"preload\");\n    }\n    set preload(value) {\n      if (value)\n        this.setAttribute(\"preload\", value);\n      else\n        this.removeAttribute(\"preload\");\n    }\n    get renderer() {\n      return this.getAttribute(\"renderer\") || \"native\";\n    }\n    set renderer(value) {\n      this.setAttribute(\"renderer\", value);\n    }\n    get sandbox() {\n      return this.sandboxed;\n    }\n  }\n  function initWebviewTag() {\n    if (!customElements.get(\"electrobun-webview\")) {\n      customElements.define(\"electrobun-webview\", ElectrobunWebviewTag);\n    }\n    const injectStyles = () => {\n      const style = document.createElement(\"style\");\n      style.textContent = `\nelectrobun-webview {\n\tdisplay: block;\n\twidth: 800px;\n\theight: 300px;\n\tbackground: #fff;\n\tbackground-repeat: no-repeat !important;\n\toverflow: hidden;\n}\n`;\n      if (document.head?.firstChild) {\n        document.head.insertBefore(style, document.head.firstChild);\n      } else if (document.head) {\n        document.head.appendChild(style);\n      }\n    };\n    if (document.head) {\n      injectStyles();\n    } else {\n      document.addEventListener(\"DOMContentLoaded\", injectStyles);\n    }\n  }\n\n  // src/bun/preload/events.ts\n  function emitWebviewEvent(eventName, detail) {\n    setTimeout(() => {\n      const bridge = window.__electrobunEventBridge || window.__electrobunInternalBridge;\n      bridge?.postMessage(JSON.stringify({\n        id: \"webviewEvent\",\n        type: \"message\",\n        payload: {\n          id: window.__electrobunWebviewId,\n          eventName,\n          detail\n        }\n      }));\n    });\n  }\n  function initLifecycleEvents() {\n    window.addEventListener(\"load\", () => {\n      if (window === window.top) {\n        emitWebviewEvent(\"dom-ready\", document.location.href);\n      }\n    });\n    window.addEventListener(\"popstate\", () => {\n      emitWebviewEvent(\"did-navigate-in-page\", window.location.href);\n    });\n    window.addEventListener(\"hashchange\", () => {\n      emitWebviewEvent(\"did-navigate-in-page\", window.location.href);\n    });\n  }\n  var cmdKeyHeld = false;\n  var cmdKeyTimestamp = 0;\n  var CMD_KEY_THRESHOLD_MS = 500;\n  function isCmdHeld() {\n    if (cmdKeyHeld)\n      return true;\n    return Date.now() - cmdKeyTimestamp < CMD_KEY_THRESHOLD_MS && cmdKeyTimestamp > 0;\n  }\n  function initCmdClickHandling() {\n    window.addEventListener(\"keydown\", (event) => {\n      if (event.key === \"Meta\" || event.metaKey) {\n        cmdKeyHeld = true;\n        cmdKeyTimestamp = Date.now();\n      }\n    }, true);\n    window.addEventListener(\"keyup\", (event) => {\n      if (event.key === \"Meta\") {\n        cmdKeyHeld = false;\n        cmdKeyTimestamp = Date.now();\n      }\n    }, true);\n    window.addEventListener(\"blur\", () => {\n      cmdKeyHeld = false;\n    });\n    window.addEventListener(\"click\", (event) => {\n      if (event.metaKey || event.ctrlKey) {\n        const anchor = event.target?.closest?.(\"a\");\n        if (anchor && anchor.href) {\n          event.preventDefault();\n          event.stopPropagation();\n          event.stopImmediatePropagation();\n          emitWebviewEvent(\"new-window-open\", JSON.stringify({\n            url: anchor.href,\n            isCmdClick: true,\n            isSPANavigation: false\n          }));\n        }\n      }\n    }, true);\n  }\n  function initSPANavigationInterception() {\n    const originalPushState = history.pushState;\n    const originalReplaceState = history.replaceState;\n    history.pushState = function(state, title, url) {\n      if (isCmdHeld() && url) {\n        const resolvedUrl = new URL(String(url), window.location.href).href;\n        emitWebviewEvent(\"new-window-open\", JSON.stringify({\n          url: resolvedUrl,\n          isCmdClick: true,\n          isSPANavigation: true\n        }));\n        return;\n      }\n      return originalPushState.apply(this, [state, title, url]);\n    };\n    history.replaceState = function(state, title, url) {\n      if (isCmdHeld() && url) {\n        const resolvedUrl = new URL(String(url), window.location.href).href;\n        emitWebviewEvent(\"new-window-open\", JSON.stringify({\n          url: resolvedUrl,\n          isCmdClick: true,\n          isSPANavigation: true\n        }));\n        return;\n      }\n      return originalReplaceState.apply(this, [state, title, url]);\n    };\n  }\n  function initOverscrollPrevention() {\n    document.addEventListener(\"DOMContentLoaded\", () => {\n      const style = document.createElement(\"style\");\n      style.type = \"text/css\";\n      style.appendChild(document.createTextNode(\"html, body { overscroll-behavior: none; }\"));\n      document.head.appendChild(style);\n    });\n  }\n\n  // src/bun/preload/index.ts\n  initEncryption().catch((err) => console.error(\"Failed to initialize encryption:\", err));\n  var internalMessageHandler = (msg) => {\n    handleResponse(msg);\n  };\n  if (!window.__electrobun) {\n    window.__electrobun = {\n      receiveInternalMessageFromBun: internalMessageHandler,\n      receiveMessageFromBun: (msg) => {\n        console.log(\"receiveMessageFromBun (no handler):\", msg);\n      }\n    };\n  } else {\n    window.__electrobun.receiveInternalMessageFromBun = internalMessageHandler;\n    window.__electrobun.receiveMessageFromBun = (msg) => {\n      console.log(\"receiveMessageFromBun (no handler):\", msg);\n    };\n  }\n  window.__electrobunSendToHost = (message) => {\n    emitWebviewEvent(\"host-message\", JSON.stringify(message));\n  };\n  initLifecycleEvents();\n  initCmdClickHandling();\n  initSPANavigationInterception();\n  initOverscrollPrevention();\n  initDragRegions();\n  initWebviewTag();\n})();\n";
+export const preloadScript = "(() => {\n  // src/bun/preload/encryption.ts\n  function base64ToUint8Array(base64) {\n    return new Uint8Array(atob(base64).split(\"\").map((char) => char.charCodeAt(0)));\n  }\n  function uint8ArrayToBase64(uint8Array) {\n    let binary = \"\";\n    for (let i = 0;i < uint8Array.length; i++) {\n      binary += String.fromCharCode(uint8Array[i]);\n    }\n    return btoa(binary);\n  }\n  async function generateKeyFromBytes(rawKey) {\n    return await window.crypto.subtle.importKey(\"raw\", rawKey, { name: \"AES-GCM\" }, true, [\"encrypt\", \"decrypt\"]);\n  }\n  async function initEncryption() {\n    const secretKey = await generateKeyFromBytes(new Uint8Array(window.__electrobunSecretKeyBytes));\n    const encryptString = async (plaintext) => {\n      const encoder = new TextEncoder;\n      const encodedText = encoder.encode(plaintext);\n      const iv = window.crypto.getRandomValues(new Uint8Array(12));\n      const encryptedBuffer = await window.crypto.subtle.encrypt({ name: \"AES-GCM\", iv }, secretKey, encodedText);\n      const encryptedData = new Uint8Array(encryptedBuffer.slice(0, -16));\n      const tag = new Uint8Array(encryptedBuffer.slice(-16));\n      return {\n        encryptedData: uint8ArrayToBase64(encryptedData),\n        iv: uint8ArrayToBase64(iv),\n        tag: uint8ArrayToBase64(tag)\n      };\n    };\n    const decryptString = async (encryptedDataB64, ivB64, tagB64) => {\n      const encryptedData = base64ToUint8Array(encryptedDataB64);\n      const iv = base64ToUint8Array(ivB64);\n      const tag = base64ToUint8Array(tagB64);\n      const combinedData = new Uint8Array(encryptedData.length + tag.length);\n      combinedData.set(encryptedData);\n      combinedData.set(tag, encryptedData.length);\n      const decryptedBuffer = await window.crypto.subtle.decrypt({ name: \"AES-GCM\", iv }, secretKey, combinedData);\n      const decoder = new TextDecoder;\n      return decoder.decode(decryptedBuffer);\n    };\n    window.__electrobun_encrypt = encryptString;\n    window.__electrobun_decrypt = decryptString;\n  }\n\n  // src/bun/preload/internalRpc.ts\n  var pendingRequests = {};\n  var requestId = 0;\n  var isProcessingQueue = false;\n  var sendQueue = [];\n  function processQueue() {\n    if (isProcessingQueue) {\n      setTimeout(processQueue);\n      return;\n    }\n    if (sendQueue.length === 0)\n      return;\n    isProcessingQueue = true;\n    const batch = JSON.stringify(sendQueue);\n    sendQueue.length = 0;\n    window.__electrobunInternalBridge?.postMessage(batch);\n    setTimeout(() => {\n      isProcessingQueue = false;\n    }, 2);\n  }\n  function send(type, payload) {\n    sendQueue.push(JSON.stringify({ type: \"message\", id: type, payload }));\n    processQueue();\n  }\n  function request(type, payload) {\n    return new Promise((resolve, reject) => {\n      const id = `req_${++requestId}_${Date.now()}`;\n      pendingRequests[id] = { resolve, reject };\n      sendQueue.push(JSON.stringify({\n        type: \"request\",\n        method: type,\n        id,\n        params: payload,\n        hostWebviewId: window.__electrobunWebviewId\n      }));\n      processQueue();\n      setTimeout(() => {\n        if (pendingRequests[id]) {\n          delete pendingRequests[id];\n          reject(new Error(`Request timeout: ${type}`));\n        }\n      }, 1e4);\n    });\n  }\n  function handleResponse(msg) {\n    if (msg && msg.type === \"response\" && msg.id) {\n      const pending = pendingRequests[msg.id];\n      if (pending) {\n        delete pendingRequests[msg.id];\n        if (msg.success)\n          pending.resolve(msg.payload);\n        else\n          pending.reject(msg.payload);\n      }\n    }\n  }\n\n  // src/bun/preload/dragRegions.ts\n  function isAppRegionDrag(e) {\n    const target = e.target;\n    if (!target || !target.closest)\n      return false;\n    const draggableByStyle = target.closest('[style*=\"app-region\"][style*=\"drag\"]');\n    const draggableByClass = target.closest(\".electrobun-webkit-app-region-drag\");\n    return !!(draggableByStyle || draggableByClass);\n  }\n  function initDragRegions() {\n    document.addEventListener(\"mousedown\", (e) => {\n      if (isAppRegionDrag(e)) {\n        send(\"startWindowMove\", { id: window.__electrobunWindowId });\n      }\n    });\n    document.addEventListener(\"mouseup\", (e) => {\n      if (isAppRegionDrag(e)) {\n        send(\"stopWindowMove\", { id: window.__electrobunWindowId });\n      }\n    });\n  }\n\n  // src/bun/preload/webviewTag.ts\n  var webviewRegistry = {};\n\n  class ElectrobunWebviewTag extends HTMLElement {\n    webviewId = null;\n    maskSelectors = new Set;\n    lastRect = { x: 0, y: 0, width: 0, height: 0 };\n    resizeObserver = null;\n    positionCheckLoop = null;\n    transparent = false;\n    passthroughEnabled = false;\n    hidden = false;\n    sandboxed = false;\n    _eventListeners = {};\n    constructor() {\n      super();\n    }\n    connectedCallback() {\n      requestAnimationFrame(() => this.initWebview());\n    }\n    disconnectedCallback() {\n      if (this.webviewId !== null) {\n        send(\"webviewTagRemove\", { id: this.webviewId });\n        delete webviewRegistry[this.webviewId];\n      }\n      if (this.resizeObserver)\n        this.resizeObserver.disconnect();\n      if (this.positionCheckLoop)\n        clearInterval(this.positionCheckLoop);\n    }\n    async initWebview() {\n      const rect = this.getBoundingClientRect();\n      this.lastRect = {\n        x: rect.x,\n        y: rect.y,\n        width: rect.width,\n        height: rect.height\n      };\n      const url = this.getAttribute(\"src\");\n      const html = this.getAttribute(\"html\");\n      const preload = this.getAttribute(\"preload\");\n      const partition = this.getAttribute(\"partition\");\n      const renderer = this.getAttribute(\"renderer\") || \"native\";\n      const masks = this.getAttribute(\"masks\");\n      const sandbox = this.hasAttribute(\"sandbox\");\n      this.sandboxed = sandbox;\n      if (masks) {\n        masks.split(\",\").forEach((s) => this.maskSelectors.add(s.trim()));\n      }\n      try {\n        const webviewId = await request(\"webviewTagInit\", {\n          hostWebviewId: window.__electrobunWebviewId,\n          windowId: window.__electrobunWindowId,\n          renderer,\n          url,\n          html,\n          preload,\n          partition,\n          frame: {\n            width: rect.width,\n            height: rect.height,\n            x: rect.x,\n            y: rect.y\n          },\n          navigationRules: null,\n          sandbox\n        });\n        this.webviewId = webviewId;\n        this.id = `electrobun-webview-${webviewId}`;\n        webviewRegistry[webviewId] = this;\n        this.setupObservers();\n        this.syncDimensions(true);\n      } catch (err) {\n        console.error(\"Failed to init webview:\", err);\n      }\n    }\n    setupObservers() {\n      this.resizeObserver = new ResizeObserver(() => this.syncDimensions());\n      this.resizeObserver.observe(this);\n      this.positionCheckLoop = setInterval(() => this.syncDimensions(), 100);\n    }\n    syncDimensions(force = false) {\n      if (this.webviewId === null)\n        return;\n      const rect = this.getBoundingClientRect();\n      const newRect = {\n        x: rect.x,\n        y: rect.y,\n        width: rect.width,\n        height: rect.height\n      };\n      if (!force && newRect.x === this.lastRect.x && newRect.y === this.lastRect.y && newRect.width === this.lastRect.width && newRect.height === this.lastRect.height) {\n        return;\n      }\n      this.lastRect = newRect;\n      const masks = [];\n      this.maskSelectors.forEach((selector) => {\n        try {\n          document.querySelectorAll(selector).forEach((el) => {\n            const mr = el.getBoundingClientRect();\n            masks.push({\n              x: mr.x - rect.x,\n              y: mr.y - rect.y,\n              width: mr.width,\n              height: mr.height\n            });\n          });\n        } catch (_e) {}\n      });\n      send(\"webviewTagResize\", {\n        id: this.webviewId,\n        frame: newRect,\n        masks: JSON.stringify(masks)\n      });\n    }\n    loadURL(url) {\n      if (this.webviewId === null)\n        return;\n      this.setAttribute(\"src\", url);\n      send(\"webviewTagUpdateSrc\", { id: this.webviewId, url });\n    }\n    loadHTML(html) {\n      if (this.webviewId === null)\n        return;\n      send(\"webviewTagUpdateHtml\", { id: this.webviewId, html });\n    }\n    reload() {\n      if (this.webviewId !== null)\n        send(\"webviewTagReload\", { id: this.webviewId });\n    }\n    goBack() {\n      if (this.webviewId !== null)\n        send(\"webviewTagGoBack\", { id: this.webviewId });\n    }\n    goForward() {\n      if (this.webviewId !== null)\n        send(\"webviewTagGoForward\", { id: this.webviewId });\n    }\n    async canGoBack() {\n      if (this.webviewId === null)\n        return false;\n      return await request(\"webviewTagCanGoBack\", {\n        id: this.webviewId\n      });\n    }\n    async canGoForward() {\n      if (this.webviewId === null)\n        return false;\n      return await request(\"webviewTagCanGoForward\", {\n        id: this.webviewId\n      });\n    }\n    toggleTransparent(value) {\n      if (this.webviewId === null)\n        return;\n      this.transparent = value !== undefined ? value : !this.transparent;\n      send(\"webviewTagSetTransparent\", {\n        id: this.webviewId,\n        transparent: this.transparent\n      });\n    }\n    togglePassthrough(value) {\n      if (this.webviewId === null)\n        return;\n      this.passthroughEnabled = value !== undefined ? value : !this.passthroughEnabled;\n      send(\"webviewTagSetPassthrough\", {\n        id: this.webviewId,\n        enablePassthrough: this.passthroughEnabled\n      });\n    }\n    toggleHidden(value) {\n      if (this.webviewId === null)\n        return;\n      this.hidden = value !== undefined ? value : !this.hidden;\n      send(\"webviewTagSetHidden\", { id: this.webviewId, hidden: this.hidden });\n    }\n    addMaskSelector(selector) {\n      this.maskSelectors.add(selector);\n      this.syncDimensions(true);\n    }\n    removeMaskSelector(selector) {\n      this.maskSelectors.delete(selector);\n      this.syncDimensions(true);\n    }\n    setNavigationRules(rules) {\n      if (this.webviewId !== null) {\n        send(\"webviewTagSetNavigationRules\", { id: this.webviewId, rules });\n      }\n    }\n    findInPage(searchText, options) {\n      if (this.webviewId === null)\n        return;\n      const forward = options?.forward !== false;\n      const matchCase = options?.matchCase || false;\n      send(\"webviewTagFindInPage\", {\n        id: this.webviewId,\n        searchText,\n        forward,\n        matchCase\n      });\n    }\n    stopFindInPage() {\n      if (this.webviewId !== null)\n        send(\"webviewTagStopFind\", { id: this.webviewId });\n    }\n    openDevTools() {\n      if (this.webviewId !== null)\n        send(\"webviewTagOpenDevTools\", { id: this.webviewId });\n    }\n    closeDevTools() {\n      if (this.webviewId !== null)\n        send(\"webviewTagCloseDevTools\", { id: this.webviewId });\n    }\n    toggleDevTools() {\n      if (this.webviewId !== null)\n        send(\"webviewTagToggleDevTools\", { id: this.webviewId });\n    }\n    on(event, listener) {\n      if (!this._eventListeners[event])\n        this._eventListeners[event] = [];\n      this._eventListeners[event].push(listener);\n    }\n    off(event, listener) {\n      if (!this._eventListeners[event])\n        return;\n      const idx = this._eventListeners[event].indexOf(listener);\n      if (idx !== -1)\n        this._eventListeners[event].splice(idx, 1);\n    }\n    emit(event, detail) {\n      const listeners = this._eventListeners[event];\n      if (listeners) {\n        const customEvent = new CustomEvent(event, { detail });\n        listeners.forEach((fn) => fn(customEvent));\n      }\n    }\n    get src() {\n      return this.getAttribute(\"src\");\n    }\n    set src(value) {\n      if (value) {\n        this.setAttribute(\"src\", value);\n        if (this.webviewId !== null)\n          this.loadURL(value);\n      } else {\n        this.removeAttribute(\"src\");\n      }\n    }\n    get html() {\n      return this.getAttribute(\"html\");\n    }\n    set html(value) {\n      if (value) {\n        this.setAttribute(\"html\", value);\n        if (this.webviewId !== null)\n          this.loadHTML(value);\n      } else {\n        this.removeAttribute(\"html\");\n      }\n    }\n    get preload() {\n      return this.getAttribute(\"preload\");\n    }\n    set preload(value) {\n      if (value)\n        this.setAttribute(\"preload\", value);\n      else\n        this.removeAttribute(\"preload\");\n    }\n    get renderer() {\n      return this.getAttribute(\"renderer\") || \"native\";\n    }\n    set renderer(value) {\n      this.setAttribute(\"renderer\", value);\n    }\n    get sandbox() {\n      return this.sandboxed;\n    }\n  }\n  function initWebviewTag() {\n    if (!customElements.get(\"electrobun-webview\")) {\n      customElements.define(\"electrobun-webview\", ElectrobunWebviewTag);\n    }\n    const injectStyles = () => {\n      const style = document.createElement(\"style\");\n      style.textContent = `\nelectrobun-webview {\n\tdisplay: block;\n\twidth: 800px;\n\theight: 300px;\n\tbackground: #fff;\n\tbackground-repeat: no-repeat !important;\n\toverflow: hidden;\n}\n`;\n      if (document.head?.firstChild) {\n        document.head.insertBefore(style, document.head.firstChild);\n      } else if (document.head) {\n        document.head.appendChild(style);\n      }\n    };\n    if (document.head) {\n      injectStyles();\n    } else {\n      document.addEventListener(\"DOMContentLoaded\", injectStyles);\n    }\n  }\n\n  // src/bun/preload/events.ts\n  function emitWebviewEvent(eventName, detail) {\n    setTimeout(() => {\n      const bridge = window.__electrobunEventBridge || window.__electrobunInternalBridge;\n      bridge?.postMessage(JSON.stringify({\n        id: \"webviewEvent\",\n        type: \"message\",\n        payload: {\n          id: window.__electrobunWebviewId,\n          eventName,\n          detail\n        }\n      }));\n    });\n  }\n  function initLifecycleEvents() {\n    window.addEventListener(\"load\", () => {\n      if (window === window.top) {\n        emitWebviewEvent(\"dom-ready\", document.location.href);\n      }\n    });\n    window.addEventListener(\"popstate\", () => {\n      emitWebviewEvent(\"did-navigate-in-page\", window.location.href);\n    });\n    window.addEventListener(\"hashchange\", () => {\n      emitWebviewEvent(\"did-navigate-in-page\", window.location.href);\n    });\n  }\n  var cmdKeyHeld = false;\n  var cmdKeyTimestamp = 0;\n  var CMD_KEY_THRESHOLD_MS = 500;\n  function isCmdHeld() {\n    if (cmdKeyHeld)\n      return true;\n    return Date.now() - cmdKeyTimestamp < CMD_KEY_THRESHOLD_MS && cmdKeyTimestamp > 0;\n  }\n  function initCmdClickHandling() {\n    window.addEventListener(\"keydown\", (event) => {\n      if (event.key === \"Meta\" || event.metaKey) {\n        cmdKeyHeld = true;\n        cmdKeyTimestamp = Date.now();\n      }\n    }, true);\n    window.addEventListener(\"keyup\", (event) => {\n      if (event.key === \"Meta\") {\n        cmdKeyHeld = false;\n        cmdKeyTimestamp = Date.now();\n      }\n    }, true);\n    window.addEventListener(\"blur\", () => {\n      cmdKeyHeld = false;\n    });\n    window.addEventListener(\"click\", (event) => {\n      if (event.metaKey || event.ctrlKey) {\n        const anchor = event.target?.closest?.(\"a\");\n        if (anchor && anchor.href) {\n          event.preventDefault();\n          event.stopPropagation();\n          event.stopImmediatePropagation();\n          emitWebviewEvent(\"new-window-open\", JSON.stringify({\n            url: anchor.href,\n            isCmdClick: true,\n            isSPANavigation: false\n          }));\n        }\n      }\n    }, true);\n  }\n  function initSPANavigationInterception() {\n    const originalPushState = history.pushState;\n    const originalReplaceState = history.replaceState;\n    history.pushState = function(state, title, url) {\n      if (isCmdHeld() && url) {\n        const resolvedUrl = new URL(String(url), window.location.href).href;\n        emitWebviewEvent(\"new-window-open\", JSON.stringify({\n          url: resolvedUrl,\n          isCmdClick: true,\n          isSPANavigation: true\n        }));\n        return;\n      }\n      return originalPushState.apply(this, [state, title, url]);\n    };\n    history.replaceState = function(state, title, url) {\n      if (isCmdHeld() && url) {\n        const resolvedUrl = new URL(String(url), window.location.href).href;\n        emitWebviewEvent(\"new-window-open\", JSON.stringify({\n          url: resolvedUrl,\n          isCmdClick: true,\n          isSPANavigation: true\n        }));\n        return;\n      }\n      return originalReplaceState.apply(this, [state, title, url]);\n    };\n  }\n  function initOverscrollPrevention() {\n    document.addEventListener(\"DOMContentLoaded\", () => {\n      const style = document.createElement(\"style\");\n      style.type = \"text/css\";\n      style.appendChild(document.createTextNode(\"html, body { overscroll-behavior: none; }\"));\n      document.head.appendChild(style);\n    });\n  }\n\n  // src/bun/preload/index.ts\n  initEncryption().catch((err) => console.error(\"Failed to initialize encryption:\", err));\n  var internalMessageHandler = (msg) => {\n    handleResponse(msg);\n  };\n  if (!window.__electrobun) {\n    window.__electrobun = {\n      receiveInternalMessageFromBun: internalMessageHandler,\n      receiveMessageFromBun: (msg) => {\n        console.log(\"receiveMessageFromBun (no handler):\", msg);\n      }\n    };\n  } else {\n    window.__electrobun.receiveInternalMessageFromBun = internalMessageHandler;\n    window.__electrobun.receiveMessageFromBun = (msg) => {\n      console.log(\"receiveMessageFromBun (no handler):\", msg);\n    };\n  }\n  window.__electrobunSendToHost = (message) => {\n    emitWebviewEvent(\"host-message\", JSON.stringify(message));\n  };\n  initLifecycleEvents();\n  initCmdClickHandling();\n  initSPANavigationInterception();\n  initOverscrollPrevention();\n  initDragRegions();\n  initWebviewTag();\n})();\n";
 
 // Minimal preload for sandboxed/untrusted webviews (lifecycle events only, no RPC)
 export const preloadScriptSandboxed = "(() => {\n  // src/bun/preload/events.ts\n  function emitWebviewEvent(eventName, detail) {\n    setTimeout(() => {\n      const bridge = window.__electrobunEventBridge || window.__electrobunInternalBridge;\n      bridge?.postMessage(JSON.stringify({\n        id: \"webviewEvent\",\n        type: \"message\",\n        payload: {\n          id: window.__electrobunWebviewId,\n          eventName,\n          detail\n        }\n      }));\n    });\n  }\n  function initLifecycleEvents() {\n    window.addEventListener(\"load\", () => {\n      if (window === window.top) {\n        emitWebviewEvent(\"dom-ready\", document.location.href);\n      }\n    });\n    window.addEventListener(\"popstate\", () => {\n      emitWebviewEvent(\"did-navigate-in-page\", window.location.href);\n    });\n    window.addEventListener(\"hashchange\", () => {\n      emitWebviewEvent(\"did-navigate-in-page\", window.location.href);\n    });\n  }\n  var cmdKeyHeld = false;\n  var cmdKeyTimestamp = 0;\n  var CMD_KEY_THRESHOLD_MS = 500;\n  function isCmdHeld() {\n    if (cmdKeyHeld)\n      return true;\n    return Date.now() - cmdKeyTimestamp < CMD_KEY_THRESHOLD_MS && cmdKeyTimestamp > 0;\n  }\n  function initCmdClickHandling() {\n    window.addEventListener(\"keydown\", (event) => {\n      if (event.key === \"Meta\" || event.metaKey) {\n        cmdKeyHeld = true;\n        cmdKeyTimestamp = Date.now();\n      }\n    }, true);\n    window.addEventListener(\"keyup\", (event) => {\n      if (event.key === \"Meta\") {\n        cmdKeyHeld = false;\n        cmdKeyTimestamp = Date.now();\n      }\n    }, true);\n    window.addEventListener(\"blur\", () => {\n      cmdKeyHeld = false;\n    });\n    window.addEventListener(\"click\", (event) => {\n      if (event.metaKey || event.ctrlKey) {\n        const anchor = event.target?.closest?.(\"a\");\n        if (anchor && anchor.href) {\n          event.preventDefault();\n          event.stopPropagation();\n          event.stopImmediatePropagation();\n          emitWebviewEvent(\"new-window-open\", JSON.stringify({\n            url: anchor.href,\n            isCmdClick: true,\n            isSPANavigation: false\n          }));\n        }\n      }\n    }, true);\n  }\n  function initSPANavigationInterception() {\n    const originalPushState = history.pushState;\n    const originalReplaceState = history.replaceState;\n    history.pushState = function(state, title, url) {\n      if (isCmdHeld() && url) {\n        const resolvedUrl = new URL(String(url), window.location.href).href;\n        emitWebviewEvent(\"new-window-open\", JSON.stringify({\n          url: resolvedUrl,\n          isCmdClick: true,\n          isSPANavigation: true\n        }));\n        return;\n      }\n      return originalPushState.apply(this, [state, title, url]);\n    };\n    history.replaceState = function(state, title, url) {\n      if (isCmdHeld() && url) {\n        const resolvedUrl = new URL(String(url), window.location.href).href;\n        emitWebviewEvent(\"new-window-open\", JSON.stringify({\n          url: resolvedUrl,\n          isCmdClick: true,\n          isSPANavigation: true\n        }));\n        return;\n      }\n      return originalReplaceState.apply(this, [state, title, url]);\n    };\n  }\n  function initOverscrollPrevention() {\n    document.addEventListener(\"DOMContentLoaded\", () => {\n      const style = document.createElement(\"style\");\n      style.type = \"text/css\";\n      style.appendChild(document.createTextNode(\"html, body { overscroll-behavior: none; }\"));\n      document.head.appendChild(style);\n    });\n  }\n\n  // src/bun/preload/index-sandboxed.ts\n  initLifecycleEvents();\n  initCmdClickHandling();\n  initSPANavigationInterception();\n  initOverscrollPrevention();\n})();\n";

package/dist/api/bun/preload/webviewTag.ts

@@ -39,7 +39,6 @@ export class ElectrobunWebviewTag extends HTMLElement {
 	transparent = false;
 	passthroughEnabled = false;
 	hidden = false;
-	private autoHidden = false; // true when syncDimensions auto-hid due to zero-size element
 	// Sandbox mode: when true, disables RPC and only allows event emission in the child webview
 	sandboxed = false;
 	private _eventListeners: Record<string, Array<(event: CustomEvent) => void>> =
@@ -138,24 +137,6 @@ export class ElectrobunWebviewTag extends HTMLElement {
 			height: rect.height,
 		};
 
-		// If the element has zero size (e.g. display:none, unslotted from shadow DOM),
-		// hide the native webview instead of resizing to (0,0,0,0) which gets clamped
-		// to a small visible rect at the origin.
-		if (newRect.width === 0 && newRect.height === 0) {
-			if (!this.hidden) {
-				this.autoHidden = true;
-				this.toggleHidden(true);
-			}
-			this.lastRect = newRect;
-			return;
-		}
-
-		// Element is visible again — unhide only if we were the ones that hid it
-		if (this.autoHidden) {
-			this.autoHidden = false;
-			this.toggleHidden(false);
-		}
-
 		if (
 			!force &&
 			newRect.x === this.lastRect.x &&

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "electrobun",
-	"version": "1.12.1-beta.2",
+	"version": "1.12.1-beta.3",
 	"description": "Build ultra fast, tiny, and cross-platform desktop apps with Typescript.",
 	"license": "MIT",
 	"author": "Blackboard Technologies Inc.",