electron/remote

@electron/remote for multiple windows

otsybulsky opened this issue ยท 10 comments

Hi! I use electron 14 and @electron/remote 2.0.1 for main window successfully. Then I try open child window.
I get an error

core.js:6479 ERROR Error: @electron/remote is disabled for this WebContents. 
Call require("@electron/remote/main").enable(webContents) to enable it.
    at IpcMainImpl.<anonymous> (C:\projects\xProject\node_modules\@electron\remote\dist\src\main\server.js:317:61)
    at IpcMainImpl.emit (events.js:376:20)
    at Object.<anonymous> (electron/js2c/browser_init.js:161:10490)
    at Object.emit (events.js:376:20)

Please help me understand how to open multiple child window with call require("@electron/remote/main").enable(webContents).

Thank you for help.

like this?

import { enable as enableWebContents } from "@electron/remote/main"
const win = new BrowserWindow({...})
enableWebContents(win.webContents)

This works well for the main process. But not for child windows. It looks like I need to use remote.require ("@ electron / remote / main"). Enable (#72 (comment)). I hope this will resolve the issue. Finally I keep moving!

Thanks to @otsybulsky for this useful hint.
I had the same issue in my Electron app making use of a "child" window (Electron 15.0.0 and @electron/remote 2.0.1), and I can confirm that this does indeed work flawlessly from a renderer process:

const remote = require ('@electron/remote');
// [...]
remote.require ('@electron/remote/main').enable (applyWindow.webContents);

https://github.com/tonton-pixel/color-ramp-formulator/blob/f8af8c466d20b4e963668cc4fa9a5b6028c6a0ed/renderer/renderer.js#L3

https://github.com/tonton-pixel/color-ramp-formulator/blob/f8af8c466d20b4e963668cc4fa9a5b6028c6a0ed/renderer/renderer.js#L1648

imndx commented

Thanks to @otsybulsky for this useful hint.
I had the same issue in my Electron app making use of a "child" window (Electron 15.0.0 and @electron/remote 2.0.1), and I can confirm that this does indeed work flawlessly from a renderer process:

const remote = require ('@electron/remote');
// [...]
remote.require ('@electron/remote/main').enable (applyWindow.webContents);

https://github.com/tonton-pixel/color-ramp-formulator/blob/f8af8c466d20b4e963668cc4fa9a5b6028c6a0ed/renderer/renderer.js#L3

https://github.com/tonton-pixel/color-ramp-formulator/blob/f8af8c466d20b4e963668cc4fa9a5b6028c6a0ed/renderer/renderer.js#L1648

Thanks to @tonton-pixel , but your solution not works for me, the child window created from the main window still complains: Uncaught Error: @electron/remote is disabled for this WebContents. Call require("@electron/remote/main").enable(webContents) to enable it.".

The following is my code, anyone has any idea? Thanks.

// click some button in the main window
            let win = new BrowserWindow(
                {
                    width: width,
                    height: height,
                    minWidth: width,
                    minHeight: height,
                    resizable: true,
                    maximizable: false,
                    webPreferences: {
                        scrollBounce: false,
                        nativeWindowOpen: true,
                        nodeIntegration: true,
                        contextIsolation: false,
                    },
                }
            );

            const remote = require('@electron/remote');
            remote.require("@electron/remote/main").enable(win.webContents)

My code contains this flow:
remote = window.require('@electron/remote');
let win = new remote.BrowserWindow({...
remote.require("@electron/remote/main").enable(win.webContents)

imndx commented

My code contains this flow:
remote = window.require('@electron/remote');
let win = new remote.BrowserWindow({...
remote.require("@electron/remote/main").enable(win.webContents)

Thanks for your reply.

I tried your flow, but still the same error.

imndx commented

Finally, I figured out a solution, I CANNOT explain why, BUT it works for me.

  1. in the main process, add the following lines:
    app.on('remote-require', (event, args) => {
        // event.preventDefault();
        event.returnValue = require('@electron/remote/main');
    });
  1. in the redenerer process, where create the new BrowserWindow, add the following lines:
const remote = require('@electron/remote');
....

 const remoteMain = remote.require("@electron/remote/main");
remoteMain.enable(win.webContents);

I create windows from renderer and I use nativeWindowOpen: true,
I my case it works with (in main process) :

const remoteMain = require('@electron/remote/main')

...

mainWin.webContents.on('did-create-window', (childWin) => {
    remoteMain.enable(childWin.webContents)
})

It should be called immediately after window created.

your solution not work for me too, It will show error: "@electron/remote" cannot be required in the browser process. Instead require("@electron/remote/main")