Message Channel Ports not passed to the renderer | electronjs.org | Page 1

Hi all, im using electron-react-boilerplate and i cant seem to pass the message channel ports from my main process to the renderer, i can call onmessage but when i call .postMessage the application crashes. I cant seem to figure out if its my preload context isolation or something obvious im missing.

// Disable no-unused-vars, broken for spread args
/* eslint no-unused-vars: off */
import { contextBridge, ipcRenderer, IpcRendererEvent } from "electron";

export type Channels =
  | "ipc-example"
  | "ipc-store-get-settings"
  | "ipc-store-first-run"
  | "ipc-store-set-settings"
  | "initialise-device-windows"
  | "get-main-ports"
  | "recieve-main-ports"
  | `get-port-${number}`
  | `recieve-port-${number}`;

const electronHandler = {
  ipcRenderer: {
    sendMessage(channel: Channels, ...args: unknown[]) {
      ipcRenderer.send(channel, ...args);
    },
    on(channel: Channels, func: (_event: IpcRendererEvent, ...args: unknown[]) => void) {
      const subscription = (_event: IpcRendererEvent, ...args: unknown[]) => func(_event, ...args);
      ipcRenderer.on(channel, subscription);

      return () => {
        ipcRenderer.removeListener(channel, subscription);
      };
    },
    once(channel: Channels, func: (...args: unknown[]) => void) {
      ipcRenderer.once(channel, (_event, ...args) => func(...args));
    },
    invoke(channel: Channels) {
      return ipcRenderer.invoke(channel);
    },
  },
};

contextBridge.exposeInMainWorld("electron", electronHandler);

export type ElectronHandler = typeof electronHandler;

const { port1: m2d1Port, port2: d12mPort } = new MessageChannelMain();
  ipcMain.handle("get-port-1", () => {
    device1?.webContents.postMessage("recieve-port-1", null, [d12mPort]);
  });

#Message Channel Ports not passed to the renderer