electrobun 1.12.3 → 1.13.0-beta.0

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

@@ -40,6 +40,10 @@ export type BrowserViewOptions<T = undefined> = {
 	// Use for untrusted content (remote URLs) to prevent malicious sites from
 	// accessing internal APIs, creating OOPIFs, or communicating with Bun
 	sandbox: boolean;
+	// Set transparent on the AbstractView at creation (before first paint)
+	startTransparent: boolean;
+	// Set passthrough on the AbstractView at creation (before first paint)
+	startPassthrough: boolean;
 	// renderer:
 };
 
@@ -93,6 +97,8 @@ export class BrowserView<T extends RPCWithTransport = RPCWithTransport> {
 	navigationRules: string | null = null;
 	// Sandbox mode disables RPC and only allows event emission (for untrusted content)
 	sandbox: boolean = false;
+	startTransparent: boolean = false;
+	startPassthrough: boolean = false;
 
 	constructor(options: Partial<BrowserViewOptions<T>> = defaultOptions) {
 		// const rpc = options.rpc;
@@ -118,6 +124,8 @@ export class BrowserView<T extends RPCWithTransport = RPCWithTransport> {
 		this.navigationRules = options.navigationRules || null;
 		this.renderer = options.renderer ?? defaultOptions.renderer ?? "native";
 		this.sandbox = options.sandbox ?? false;
+		this.startTransparent = options.startTransparent ?? false;
+		this.startPassthrough = options.startPassthrough ?? false;
 
 		BrowserViewMap[this.id] = this;
 		this.ptr = this.init() as Pointer;
@@ -167,6 +175,8 @@ export class BrowserView<T extends RPCWithTransport = RPCWithTransport> {
 			autoResize: this.autoResize,
 			navigationRules: this.navigationRules,
 			sandbox: this.sandbox,
+			startTransparent: this.startTransparent,
+			startPassthrough: this.startPassthrough,
 			// transparent is looked up from parent window in native.ts
 		});
 	}

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

@@ -1039,11 +1039,24 @@ del "%~f0"
 
 				// Cross-platform app launch (Windows is handled above with its own update script)
 				if (currentOS === "macos") {
-					// Use a detached shell so relaunch survives after killApp terminates the current process
+					// Wait for the current process to fully exit before relaunching.
+					// macOS 'open' on an already-running app just activates the existing
+					// instance instead of launching a new one, so we must ensure the
+					// current process has exited first. The detached shell survives our
+					// exit and polls until the process is gone.
+					const pid = process.pid;
 					// eslint-disable-next-line @typescript-eslint/no-explicit-any
-					Bun.spawn(["sh", "-c", `open "${runningAppBundlePath}" &`], {
-						detached: true,
-					} as any);
+					Bun.spawn(
+						[
+							"sh",
+							"-c",
+							`while kill -0 ${pid} 2>/dev/null; do sleep 0.5; done; sleep 1; open "${runningAppBundlePath}"`,
+						],
+						{
+							detached: true,
+							stdio: ["ignore", "ignore", "ignore"],
+						} as any,
+					);
 				} else if (currentOS === "linux") {
 					// On Linux, launch the launcher binary inside the app directory
 					const launcherPath = join(runningAppBundlePath, "bin", "launcher");

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    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";
+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      const transparent = this.hasAttribute(\"transparent\");\n      const passthrough = this.hasAttribute(\"passthrough\");\n      this.transparent = transparent;\n      this.passthroughEnabled = passthrough;\n      if (transparent)\n        this.style.opacity = \"0\";\n      if (passthrough)\n        this.style.pointerEvents = \"none\";\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          transparent,\n          passthrough\n        });\n        this.webviewId = webviewId;\n        this.id = `electrobun-webview-${webviewId}`;\n        webviewRegistry[webviewId] = this;\n        this.setupObservers();\n        this.syncDimensions(true);\n        requestAnimationFrame(() => {\n          Object.values(webviewRegistry).forEach((webview) => {\n            if (webview !== this && webview.webviewId !== null) {\n              webview.syncDimensions(true);\n            }\n          });\n        });\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      this.style.opacity = this.transparent ? \"0\" : \"\";\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      this.style.pointerEvents = this.passthroughEnabled ? \"none\" : \"\";\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

@@ -81,6 +81,13 @@ export class ElectrobunWebviewTag extends HTMLElement {
 		// Sandbox attribute: when present, the child webview is sandboxed (no RPC, events only)
 		const sandbox = this.hasAttribute("sandbox");
 		this.sandboxed = sandbox;
+		// Read transparent/passthrough attributes for initial state (avoids flash)
+		const transparent = this.hasAttribute("transparent");
+		const passthrough = this.hasAttribute("passthrough");
+		this.transparent = transparent;
+		this.passthroughEnabled = passthrough;
+		if (transparent) this.style.opacity = "0";
+		if (passthrough) this.style.pointerEvents = "none";
 
 		if (masks) {
 			masks.split(",").forEach((s) => this.maskSelectors.add(s.trim()));
@@ -103,6 +110,8 @@ export class ElectrobunWebviewTag extends HTMLElement {
 				},
 				navigationRules: null,
 				sandbox,
+				transparent,
+				passthrough,
 			})) as number;
 
 			this.webviewId = webviewId;
@@ -112,6 +121,17 @@ export class ElectrobunWebviewTag extends HTMLElement {
 			this.setupObservers();
 		// Force immediate sync after initialization
 		this.syncDimensions(true);
+		
+		// When adding a new webview, force all existing webviews to re-sync their positions
+		// This handles layout changes caused by the new webview
+		// Use requestAnimationFrame to ensure DOM layout is complete
+		requestAnimationFrame(() => {
+			Object.values(webviewRegistry).forEach(webview => {
+				if (webview !== this && webview.webviewId !== null) {
+					webview.syncDimensions(true);
+				}
+			});
+		});
 		} catch (err) {
 			console.error("Failed to init webview:", err);
 		}
@@ -219,6 +239,7 @@ export class ElectrobunWebviewTag extends HTMLElement {
 	toggleTransparent(value?: boolean) {
 		if (this.webviewId === null) return;
 		this.transparent = value !== undefined ? value : !this.transparent;
+		this.style.opacity = this.transparent ? "0" : "";
 		send("webviewTagSetTransparent", {
 			id: this.webviewId,
 			transparent: this.transparent,
@@ -229,6 +250,7 @@ export class ElectrobunWebviewTag extends HTMLElement {
 		if (this.webviewId === null) return;
 		this.passthroughEnabled =
 			value !== undefined ? value : !this.passthroughEnabled;
+		this.style.pointerEvents = this.passthroughEnabled ? "none" : "";
 		send("webviewTagSetPassthrough", {
 			id: this.webviewId,
 			enablePassthrough: this.passthroughEnabled,

package/dist/api/bun/proc/native.ts

@@ -196,6 +196,14 @@ export const native = (() => {
 				],
 				returns: FFIType.ptr,
 			},
+			// Pre-set flags for the next initWebview call (workaround for FFI param count limits)
+			setNextWebviewFlags: {
+				args: [
+					FFIType.bool, // startTransparent
+					FFIType.bool, // startPassthrough
+				],
+				returns: FFIType.void,
+			},
 
 			// webviewtag
 			webviewCanGoBack: {
@@ -903,7 +911,10 @@ export const ffi = {
 			autoResize: boolean;
 			navigationRules: string | null;
 			sandbox: boolean;
+			startTransparent: boolean;
+			startPassthrough: boolean;
 		}): FFIType.ptr => {
+
 			const {
 				id,
 				windowId,
@@ -919,6 +930,8 @@ export const ffi = {
 				frame: { x, y, width, height },
 				autoResize,
 				sandbox,
+				startTransparent,
+				startPassthrough,
 			} = params;
 
 			const parentWindow = BrowserWindow.getById(windowId);
@@ -971,6 +984,8 @@ window.__electrobunBunBridge = window.__electrobunBunBridge || window.webkit?.me
 
 			const customPreload = preload;
 
+			// Pre-set flags before initWebview (workaround for FFI param count limits)
+			native.symbols.setNextWebviewFlags(startTransparent, startPassthrough);
 			const webviewPtr = native.symbols.initWebview(
 				id,
 				windowPtr,
@@ -2103,6 +2118,8 @@ type WebviewTagInitParams = {
 	windowId: number;
 	navigationRules: string | null;
 	sandbox: boolean;
+	transparent: boolean;
+	passthrough: boolean;
 };
 
 export const internalRpcHandlers = {
@@ -2119,6 +2136,8 @@ export const internalRpcHandlers = {
 				frame,
 				navigationRules,
 				sandbox,
+				transparent,
+				passthrough,
 			} = params;
 
 			const url = !params.url && !html ? "https://electrobun.dev" : params.url;
@@ -2135,6 +2154,8 @@ export const internalRpcHandlers = {
 				renderer, //: "cef",
 				navigationRules,
 				sandbox,
+				startTransparent: transparent,
+				startPassthrough: passthrough,
 			});
 
 			return webviewForTag.id;

package/package.json

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

package/src/cli/index.ts

@@ -1087,7 +1087,6 @@ const defaultConfig = {
 	build: {
 		buildFolder: "build",
 		artifactFolder: "artifacts",
-		targets: undefined as unknown, // Will default to current platform if not specified
 		useAsar: false,
 		asarUnpack: undefined as string[] | undefined, // Glob patterns for files to exclude from ASAR (e.g., ["*.node", "*.dll"])
 		cefVersion: undefined as string | undefined, // Override CEF version: "CEF_VERSION+chromium-CHROMIUM_VERSION"