feat: service worker preload scripts for improved extensions support (#44411)

* feat: preload scripts for service workers

* feat: service worker IPC

* test: service worker preload scripts and ipc

lib/browser/api/service-worker-main.ts

@@ -1,5 +1,27 @@
+import { IpcMainImpl } from '@electron/internal/browser/ipc-main-impl';
+
 const { ServiceWorkerMain } = process._linkedBinding('electron_browser_service_worker_main');
 
+Object.defineProperty(ServiceWorkerMain.prototype, 'ipc', {
+  get () {
+    const ipc = new IpcMainImpl();
+    Object.defineProperty(this, 'ipc', { value: ipc });
+    return ipc;
+  }
+});
+
+ServiceWorkerMain.prototype.send = function (channel, ...args) {
+  if (typeof channel !== 'string') {
+    throw new TypeError('Missing required channel argument');
+  }
+
+  try {
+    return this._send(false /* internal */, channel, args);
+  } catch (e) {
+    console.error('Error sending from ServiceWorkerMain: ', e);
+  }
+};
+
 ServiceWorkerMain.prototype.startTask = function () {
   // TODO(samuelmaddock): maybe make timeout configurable in the future
   const hasTimeout = false;

lib/browser/api/session.ts

@@ -1,4 +1,5 @@
 import { fetchWithSession } from '@electron/internal/browser/api/net-fetch';
+import { addIpcDispatchListeners } from '@electron/internal/browser/ipc-dispatch';
 import * as deprecate from '@electron/internal/common/deprecate';
 
 import { net } from 'electron/main';
@@ -21,6 +22,10 @@ Object.defineProperty(systemPickerVideoSource, 'id', {
 systemPickerVideoSource.name = '';
 Object.freeze(systemPickerVideoSource);
 
+Session.prototype._init = function () {
+  addIpcDispatchListeners(this, this.serviceWorkers);
+};
+
 Session.prototype.fetch = function (input: RequestInfo, init?: RequestInit) {
   return fetchWithSession(input, init, this, net.request);
 };

lib/browser/devtools.ts

@@ -69,6 +69,7 @@ const assertChromeDevTools = function (contents: Electron.WebContents, api: stri
 
 ipcMainInternal.handle(IPC_MESSAGES.INSPECTOR_CONTEXT_MENU, function (event, items: ContextMenuItem[], isEditMenu: boolean) {
   return new Promise<number | void>(resolve => {
+    if (event.type !== 'frame') return;
     assertChromeDevTools(event.sender, 'window.InspectorFrontendHost.showContextMenuAtPoint()');
 
     const template = isEditMenu ? getEditMenuItems() : convertToMenuTemplate(items, resolve);
@@ -80,6 +81,7 @@ ipcMainInternal.handle(IPC_MESSAGES.INSPECTOR_CONTEXT_MENU, function (event, ite
 });
 
 ipcMainInternal.handle(IPC_MESSAGES.INSPECTOR_SELECT_FILE, async function (event) {
+  if (event.type !== 'frame') return [];
   assertChromeDevTools(event.sender, 'window.UI.createFileSelectorElement()');
 
   const result = await dialog.showOpenDialog({});
@@ -92,6 +94,7 @@ ipcMainInternal.handle(IPC_MESSAGES.INSPECTOR_SELECT_FILE, async function (event
 });
 
 ipcMainUtils.handleSync(IPC_MESSAGES.INSPECTOR_CONFIRM, async function (event, message: string = '', title: string = '') {
+  if (event.type !== 'frame') return;
   assertChromeDevTools(event.sender, 'window.confirm()');
 
   const options = {

lib/browser/guest-view-manager.ts

@@ -267,9 +267,10 @@ const isWebViewTagEnabled = function (contents: Electron.WebContents) {
 };
 
 const makeSafeHandler = function<Event extends { sender: Electron.WebContents }> (channel: string, handler: (event: Event, ...args: any[]) => any) {
-  return (event: Event, ...args: any[]) => {
+  return (event: Electron.IpcMainInvokeEvent | Electron.IpcMainServiceWorkerInvokeEvent, ...args: any[]) => {
+    if (event.type !== 'frame') return;
     if (isWebViewTagEnabled(event.sender)) {
-      return handler(event, ...args);
+      return handler(event as unknown as Event, ...args);
     } else {
       console.error(`<webview> IPC message ${channel} sent by WebContents with <webview> disabled (${event.sender.id})`);
       throw new Error('<webview> disabled');
@@ -281,7 +282,7 @@ const handleMessage = function (channel: string, handler: (event: Electron.IpcMa
   ipcMainInternal.handle(channel, makeSafeHandler(channel, handler));
 };
 
-const handleMessageSync = function (channel: string, handler: (event: ElectronInternal.IpcMainInternalEvent, ...args: any[]) => any) {
+const handleMessageSync = function (channel: string, handler: (event: { sender: Electron.WebContents }, ...args: any[]) => any) {
   ipcMainUtils.handleSync(channel, makeSafeHandler(channel, handler));
 };
 
@@ -294,8 +295,10 @@ handleMessageSync(IPC_MESSAGES.GUEST_VIEW_MANAGER_DETACH_GUEST, function (event,
 });
 
 // this message is sent by the actual <webview>
-ipcMainInternal.on(IPC_MESSAGES.GUEST_VIEW_MANAGER_FOCUS_CHANGE, function (event: ElectronInternal.IpcMainInternalEvent, focus: boolean) {
-  event.sender.emit('-focus-change', {}, focus);
+ipcMainInternal.on(IPC_MESSAGES.GUEST_VIEW_MANAGER_FOCUS_CHANGE, function (event, focus: boolean) {
+  if (event.type === 'frame') {
+    event.sender.emit('-focus-change', {}, focus);
+  }
 });
 
 handleMessage(IPC_MESSAGES.GUEST_VIEW_MANAGER_CALL, function (event, guestInstanceId: number, method: string, args: any[]) {

lib/browser/ipc-dispatch.ts

@@ -0,0 +1,91 @@
+import { ipcMainInternal } from '@electron/internal/browser/ipc-main-internal';
+import { MessagePortMain } from '@electron/internal/browser/message-port-main';
+
+import type { ServiceWorkerMain } from 'electron/main';
+
+const v8Util = process._linkedBinding('electron_common_v8_util');
+
+const addReturnValueToEvent = (event: Electron.IpcMainEvent | Electron.IpcMainServiceWorkerEvent) => {
+  Object.defineProperty(event, 'returnValue', {
+    set: (value) => event._replyChannel.sendReply(value),
+    get: () => {}
+  });
+};
+
+/**
+ * Listens for IPC dispatch events on `api`.
+ *
+ * NOTE: Currently this only supports dispatching IPCs for ServiceWorkerMain.
+ */
+export function addIpcDispatchListeners (api: NodeJS.EventEmitter, serviceWorkers: Electron.ServiceWorkers) {
+  const getServiceWorkerFromEvent = (event: Electron.IpcMainServiceWorkerEvent | Electron.IpcMainServiceWorkerInvokeEvent): ServiceWorkerMain | undefined => {
+    return serviceWorkers._getWorkerFromVersionIDIfExists(event.versionId);
+  };
+  const addServiceWorkerPropertyToEvent = (event: Electron.IpcMainServiceWorkerEvent | Electron.IpcMainServiceWorkerInvokeEvent) => {
+    Object.defineProperty(event, 'serviceWorker', {
+      get: () => serviceWorkers.getWorkerFromVersionID(event.versionId)
+    });
+  };
+
+  api.on('-ipc-message' as any, function (event: Electron.IpcMainEvent | Electron.IpcMainServiceWorkerEvent, channel: string, args: any[]) {
+    const internal = v8Util.getHiddenValue<boolean>(event, 'internal');
+
+    if (internal) {
+      ipcMainInternal.emit(channel, event, ...args);
+    } else if (event.type === 'service-worker') {
+      addServiceWorkerPropertyToEvent(event);
+      getServiceWorkerFromEvent(event)?.ipc.emit(channel, event, ...args);
+    }
+  } as any);
+
+  api.on('-ipc-invoke' as any, async function (event: Electron.IpcMainInvokeEvent | Electron.IpcMainServiceWorkerInvokeEvent, channel: string, args: any[]) {
+    const internal = v8Util.getHiddenValue<boolean>(event, 'internal');
+
+    const replyWithResult = (result: any) => event._replyChannel.sendReply({ result });
+    const replyWithError = (error: Error) => {
+      console.error(`Error occurred in handler for '${channel}':`, error);
+      event._replyChannel.sendReply({ error: error.toString() });
+    };
+
+    const targets: (Electron.IpcMainServiceWorker | ElectronInternal.IpcMainInternal | undefined)[] = [];
+
+    if (internal) {
+      targets.push(ipcMainInternal);
+    } else if (event.type === 'service-worker') {
+      addServiceWorkerPropertyToEvent(event);
+      const workerIpc = getServiceWorkerFromEvent(event)?.ipc;
+      targets.push(workerIpc);
+    }
+
+    const target = targets.find(target => (target as any)?._invokeHandlers.has(channel));
+    if (target) {
+      const handler = (target as any)._invokeHandlers.get(channel);
+      try {
+        replyWithResult(await Promise.resolve(handler(event, ...args)));
+      } catch (err) {
+        replyWithError(err as Error);
+      }
+    } else {
+      replyWithError(new Error(`No handler registered for '${channel}'`));
+    }
+  } as any);
+
+  api.on('-ipc-message-sync' as any, function (event: Electron.IpcMainEvent | Electron.IpcMainServiceWorkerEvent, channel: string, args: any[]) {
+    const internal = v8Util.getHiddenValue<boolean>(event, 'internal');
+    addReturnValueToEvent(event);
+    if (internal) {
+      ipcMainInternal.emit(channel, event, ...args);
+    } else if (event.type === 'service-worker') {
+      addServiceWorkerPropertyToEvent(event);
+      getServiceWorkerFromEvent(event)?.ipc.emit(channel, event, ...args);
+    }
+  } as any);
+
+  api.on('-ipc-ports' as any, function (event: Electron.IpcMainEvent | Electron.IpcMainServiceWorkerEvent, channel: string, message: any, ports: any[]) {
+    event.ports = ports.map(p => new MessagePortMain(p));
+    if (event.type === 'service-worker') {
+      addServiceWorkerPropertyToEvent(event);
+      getServiceWorkerFromEvent(event)?.ipc.emit(channel, event, message);
+    }
+  } as any);
+}

lib/browser/ipc-main-internal-utils.ts

@@ -19,7 +19,7 @@ export function invokeInWebContents<T> (sender: Electron.WebContents, command: s
     const requestId = ++nextId;
     const channel = `${command}_RESPONSE_${requestId}`;
     ipcMainInternal.on(channel, function handler (event, error: Error, result: any) {
-      if (event.sender !== sender) {
+      if (event.type === 'frame' && event.sender !== sender) {
         console.error(`Reply to ${command} sent by unexpected WebContents (${event.sender.id})`);
         return;
       }

lib/browser/rpc-server.ts

@@ -9,6 +9,8 @@ import * as path from 'path';
 
 // Implements window.close()
 ipcMainInternal.on(IPC_MESSAGES.BROWSER_WINDOW_CLOSE, function (event) {
+  if (event.type !== 'frame') return;
+
   const window = event.sender.getOwnerBrowserWindow();
   if (window) {
     window.close();
@@ -17,10 +19,12 @@ ipcMainInternal.on(IPC_MESSAGES.BROWSER_WINDOW_CLOSE, function (event) {
 });
 
 ipcMainInternal.handle(IPC_MESSAGES.BROWSER_GET_LAST_WEB_PREFERENCES, function (event) {
+  if (event.type !== 'frame') return;
   return event.sender.getLastWebPreferences();
 });
 
 ipcMainInternal.handle(IPC_MESSAGES.BROWSER_GET_PROCESS_MEMORY_INFO, function (event) {
+  if (event.type !== 'frame') return;
   return event.sender._getProcessMemoryInfo();
 });
 
@@ -45,16 +49,23 @@ ipcMainUtils.handleSync(IPC_MESSAGES.BROWSER_CLIPBOARD_SYNC, function (event, me
 });
 
 const getPreloadScriptsFromEvent = (event: ElectronInternal.IpcMainInternalEvent) => {
-  const session: Electron.Session = event.sender.session;
-  const preloadScripts = session.getPreloadScripts();
-  const framePreloads = preloadScripts.filter(script => script.type === 'frame');
+  const session: Electron.Session = event.type === 'service-worker' ? event.session : event.sender.session;
+  let preloadScripts = session.getPreloadScripts();
 
-  const webPrefPreload = event.sender._getPreloadScript();
-  if (webPrefPreload) framePreloads.push(webPrefPreload);
+  if (event.type === 'frame') {
+    preloadScripts = preloadScripts.filter(script => script.type === 'frame');
+
+    const webPrefPreload = event.sender._getPreloadScript();
+    if (webPrefPreload) preloadScripts.push(webPrefPreload);
+  } else if (event.type === 'service-worker') {
+    preloadScripts = preloadScripts.filter(script => script.type === 'service-worker');
+  } else {
+    throw new Error(`getPreloadScriptsFromEvent: event.type is invalid (${(event as any).type})`);
+  }
 
   // TODO(samuelmaddock): Remove filter after Session.setPreloads is fully
   // deprecated. The new API will prevent relative paths from being registered.
-  return framePreloads.filter(script => path.isAbsolute(script.filePath));
+  return preloadScripts.filter(script => path.isAbsolute(script.filePath));
 };
 
 const readPreloadScript = async function (script: Electron.PreloadScript): Promise<ElectronInternal.PreloadScript> {
@@ -95,5 +106,6 @@ ipcMainUtils.handleSync(IPC_MESSAGES.BROWSER_NONSANDBOX_LOAD, function (event) {
 });
 
 ipcMainInternal.on(IPC_MESSAGES.BROWSER_PRELOAD_ERROR, function (event, preloadPath: string, error: Error) {
-  event.sender.emit('preload-error', event, preloadPath, error);
+  if (event.type !== 'frame') return;
+  event.sender?.emit('preload-error', event, preloadPath, error);
 });

lib/preload_realm/.eslintrc.json

@@ -0,0 +1,18 @@
+{
+  "rules": {
+    "no-restricted-imports": [
+      "error",
+      {
+        "paths": [
+          "electron",
+          "electron/main"
+        ],
+        "patterns": [
+          "./*",
+          "../*",
+          "@electron/internal/browser/*"
+        ]
+      }
+    ]
+  }
+}

lib/preload_realm/api/exports/electron.ts

@@ -0,0 +1,6 @@
+import { defineProperties } from '@electron/internal/common/define-properties';
+import { moduleList } from '@electron/internal/preload_realm/api/module-list';
+
+module.exports = {};
+
+defineProperties(module.exports, moduleList);

lib/preload_realm/api/module-list.ts

@@ -0,0 +1,14 @@
+export const moduleList: ElectronInternal.ModuleEntry[] = [
+  {
+    name: 'contextBridge',
+    loader: () => require('@electron/internal/renderer/api/context-bridge')
+  },
+  {
+    name: 'ipcRenderer',
+    loader: () => require('@electron/internal/renderer/api/ipc-renderer')
+  },
+  {
+    name: 'nativeImage',
+    loader: () => require('@electron/internal/common/api/native-image')
+  }
+];

lib/preload_realm/init.ts

@@ -0,0 +1,58 @@
+import '@electron/internal/sandboxed_renderer/pre-init';
+import { IPC_MESSAGES } from '@electron/internal/common/ipc-messages';
+import type * as ipcRendererUtilsModule from '@electron/internal/renderer/ipc-renderer-internal-utils';
+import { createPreloadProcessObject, executeSandboxedPreloadScripts } from '@electron/internal/sandboxed_renderer/preload';
+
+import * as events from 'events';
+
+declare const binding: {
+  get: (name: string) => any;
+  process: NodeJS.Process;
+  createPreloadScript: (src: string) => Function
+};
+
+const ipcRendererUtils = require('@electron/internal/renderer/ipc-renderer-internal-utils') as typeof ipcRendererUtilsModule;
+
+const {
+  preloadScripts,
+  process: processProps
+} = ipcRendererUtils.invokeSync<{
+  preloadScripts: ElectronInternal.PreloadScript[];
+  process: NodeJS.Process;
+}>(IPC_MESSAGES.BROWSER_SANDBOX_LOAD);
+
+const electron = require('electron');
+
+const loadedModules = new Map<string, any>([
+  ['electron', electron],
+  ['electron/common', electron],
+  ['events', events],
+  ['node:events', events]
+]);
+
+const loadableModules = new Map<string, Function>([
+  ['url', () => require('url')],
+  ['node:url', () => require('url')]
+]);
+
+const preloadProcess = createPreloadProcessObject();
+
+Object.assign(preloadProcess, binding.process);
+Object.assign(preloadProcess, processProps);
+
+Object.assign(process, processProps);
+
+require('@electron/internal/renderer/ipc-native-setup');
+
+executeSandboxedPreloadScripts({
+  loadedModules,
+  loadableModules,
+  process: preloadProcess,
+  createPreloadScript: binding.createPreloadScript,
+  exposeGlobals: {
+    Buffer,
+    // FIXME(samuelmaddock): workaround webpack bug replacing this with just
+    // `__webpack_require__.g,` which causes script error
+    global: globalThis
+  }
+}, preloadScripts);

lib/renderer/api/ipc-renderer.ts

@@ -1,8 +1,10 @@
+import { getIPCRenderer } from '@electron/internal/renderer/ipc-renderer-bindings';
+
 import { EventEmitter } from 'events';
 
-const { ipc } = process._linkedBinding('electron_renderer_ipc');
-
+const ipc = getIPCRenderer();
 const internal = false;
+
 class IpcRenderer extends EventEmitter implements Electron.IpcRenderer {
   send (channel: string, ...args: any[]) {
     return ipc.send(internal, channel, args);

lib/renderer/common-init.ts

@@ -1,27 +1,16 @@
-import { ipcRendererInternal } from '@electron/internal/renderer/ipc-renderer-internal';
 import type * as securityWarningsModule from '@electron/internal/renderer/security-warnings';
 import type * as webFrameInitModule from '@electron/internal/renderer/web-frame-init';
 import type * as webViewInitModule from '@electron/internal/renderer/web-view/web-view-init';
 import type * as windowSetupModule from '@electron/internal/renderer/window-setup';
 
-import { ipcRenderer } from 'electron/renderer';
-
 const { mainFrame } = process._linkedBinding('electron_renderer_web_frame');
-const v8Util = process._linkedBinding('electron_common_v8_util');
 
 const nodeIntegration = mainFrame.getWebPreference('nodeIntegration');
 const webviewTag = mainFrame.getWebPreference('webviewTag');
 const isHiddenPage = mainFrame.getWebPreference('hiddenPage');
 const isWebView = mainFrame.getWebPreference('isWebView');
 
-// ElectronApiServiceImpl will look for the "ipcNative" hidden object when
-// invoking the 'onMessage' callback.
-v8Util.setHiddenValue(global, 'ipcNative', {
-  onMessage (internal: boolean, channel: string, ports: MessagePort[], args: any[]) {
-    const sender = internal ? ipcRendererInternal : ipcRenderer;
-    sender.emit(channel, { sender, ports }, ...args);
-  }
-});
+require('@electron/internal/renderer/ipc-native-setup');
 
 switch (window.location.protocol) {
   case 'devtools:': {

lib/renderer/ipc-native-setup.ts

@@ -0,0 +1,14 @@
+import { ipcRendererInternal } from '@electron/internal/renderer/ipc-renderer-internal';
+
+import { ipcRenderer } from 'electron/renderer';
+
+const v8Util = process._linkedBinding('electron_common_v8_util');
+
+// ElectronApiServiceImpl will look for the "ipcNative" hidden object when
+// invoking the 'onMessage' callback.
+v8Util.setHiddenValue(globalThis, 'ipcNative', {
+  onMessage (internal: boolean, channel: string, ports: MessagePort[], args: any[]) {
+    const sender = internal ? ipcRendererInternal : ipcRenderer;
+    sender.emit(channel, { sender, ports }, ...args);
+  }
+});

lib/renderer/ipc-renderer-bindings.ts

@@ -0,0 +1,17 @@
+let ipc: NodeJS.IpcRendererImpl | undefined;
+
+/**
+ * Get IPCRenderer implementation for the current process.
+ */
+export function getIPCRenderer () {
+  if (ipc) return ipc;
+  const ipcBinding = process._linkedBinding('electron_renderer_ipc');
+  switch (process.type) {
+    case 'renderer':
+      return (ipc = ipcBinding.createForRenderFrame());
+    case 'service-worker':
+      return (ipc = ipcBinding.createForServiceWorker());
+    default:
+      throw new Error(`Cannot create IPCRenderer for '${process.type}' process`);
+  }
+};

lib/renderer/ipc-renderer-internal.ts

@@ -1,7 +1,8 @@
+import { getIPCRenderer } from '@electron/internal/renderer/ipc-renderer-bindings';
+
 import { EventEmitter } from 'events';
 
-const { ipc } = process._linkedBinding('electron_renderer_ipc');
-
+const ipc = getIPCRenderer();
 const internal = true;
 
 class IpcRendererInternal extends EventEmitter implements ElectronInternal.IpcRendererInternal {

lib/sandboxed_renderer/init.ts

@@ -7,12 +7,10 @@ import * as events from 'events';
 import { setImmediate, clearImmediate } from 'timers';
 
 declare const binding: {
-  get: (name: string) => any;
   process: NodeJS.Process;
   createPreloadScript: (src: string) => Function
 };
 
-const v8Util = process._linkedBinding('electron_common_v8_util');
 const ipcRendererUtils = require('@electron/internal/renderer/ipc-renderer-internal-utils') as typeof ipcRendererUtilsModule;
 
 const {
@@ -43,6 +41,7 @@ const loadableModules = new Map<string, Function>([
 const preloadProcess = createPreloadProcessObject();
 
 // InvokeEmitProcessEvent in ElectronSandboxedRendererClient will look for this
+const v8Util = process._linkedBinding('electron_common_v8_util');
 v8Util.setHiddenValue(global, 'emit-process-event', (event: string) => {
   (process as events.EventEmitter).emit(event);
   (preloadProcess as events.EventEmitter).emit(event);