[Bug]: Preload script executing in the renderer process

[eiskalteschatten]

Preflight Checklist

• I have read the Contributing Guidelines for this project.
• I agree to follow the Code of Conduct that this project adheres to.
• I have searched the issue tracker for a bug report that matches the one I want to file, without success.

Electron Version

20.1.1

What operating system are you using?

Windows

Operating System Version

Windows 10 Version 21H2

What arch are you using?

x64

Last Known Working Electron version

19.0.6

Expected Behavior

When I create a window, I expect the preload script passed in the window options to run in the main process so that the contextBridge can be initialized for the renderer:

const browserWindowOptions: BrowserWindowConstructorOptions = {
  width: defaultWidth,
  height: defaultHeight,
  icon: path.join(__dirname, '../../assets/images/icon128.png'),
  webPreferences: {
    contextIsolation: true,
    preload: path.join(__dirname, '../preload.js'),
  },
};

const newWindow = new BrowserWindow(browserWindowOptions);

This is how it should look, but requires downgrading to Electron 19.0.6:

Actual Behavior

Instead, it runs in the renderer which causes an error to be thrown in the browser console saying that it cannot find the preload script:

This has only started happening since upgrading to version 20.1.1 and the preload script is definitely where it is expected to be for the main process.

Testcase Gist URL

No response

Additional Information

All it takes to reproduce is to clone https://github.com/eiskalteschatten/electron-react-typescript, run npm i, then npm start. It will compile the TypeScript files for the main process, launch the React development server, then start Electron.

Files of interest:

• The entry point for the main process: https://github.com/eiskalteschatten/electron-react-typescript/blob/master/src/main/index.ts
• The file that launches the browser window: https://github.com/eiskalteschatten/electron-react-typescript/blob/master/src/main/windows/main.ts
• The preload script concerned: https://github.com/eiskalteschatten/electron-react-typescript/blob/master/src/main/preload.ts

I'm currently running this on Windows 10, but I've also tested it with Ubuntu 22.04 and macOS 12.5.1 and the exact same error occurs.

This is not the only project I have where this error occurs and I've had to downgrade back to Electron 19 in order to avoid this problem from cropping up in the other, critical projects.

[Prinzhorn]

From a peek at the screenshots it looks like you're trying to import electron-log in your preload script. Please check out the breaking changes https://github.com/electron/electron/releases/tag/v20.0.0 in particular:

Renderers are now sandboxed by default unless nodeIntegration: true or sandbox: false is specified. #35125

[eiskalteschatten]

That is true, but it was only for debugging purposes trying to see if the preload script was executing at all. In the committed version on GitHub, electron-log isn't in the preload script and normally wouldn't be there. I only added it after the problem started occurring.

[Prinzhorn]

I expect the preload script [...] to run in the main process

That's not how it works and it never has been. Preload is part of the Renderer, that's why you can access the DOM from it. But until Electron 20 (without sandbox) preload scripts were allowed to do a lot more. Please re-read the breaking changes and what sandbox: true implies. E.g. you are importing os into the preload, which is not allowed.

https://www.electronjs.org/docs/latest/tutorial/sandbox#preload-scripts

[codebytere]

@Prinzhorn is correct.

[eiskalteschatten]

Well, then I guess my reading for tomorrow morning will be the docs again. Clearly, I misunderstood where the preload script is being executed and the concept behind it. 😅
Sorry about that, but I really do appreciate the quick responses. So, thank you!