Tuesday, 15 June 2021

Electron.js: how to create a separate webContents.session for a window?

I have an Electron file manager app, which creates 2 windows for different purposes:

  • quickView a renderer window used for previewing local files. It uses "will-download" listener for detecting unsupported files by preventing download.

  • main the main process. It uses "will-download" listener for downloading files.

Each with their own will-download listeners attached to their session. But for some reason the quickView listener overwrites the main listener.

Window 1

In the following line I'm creating a will-download listener for the "main" process. The purpose of this listener is to download files:

https://github.com/aleksey-hoffman/sigma-file-manager/blob/55fd2462cf83898610883191807b7488fb5bdf89/src/utils/downloadManager.js#L133

win.webContents.session.on('will-download', listener)

The windows.main parameter in the line below is the win reference in the line above:

https://github.com/aleksey-hoffman/sigma-file-manager/blob/55fd2462cf83898610883191807b7488fb5bdf89/src/electronMain.js#L516

const resultInfo = await downloadManager.download(windows.main, {

Window 2

In the following line I'm creating a will-download listener for the "quickView" window. The purpose of this listener is to detect unsupported files (which triggers download event in Chromium) and prevent the download event:

https://github.com/aleksey-hoffman/sigma-file-manager/blob/55fd2462cf83898610883191807b7488fb5bdf89/src/electronMain.js#L232

windows.quickViewWindow.webContents.session.once('will-download', _willDownloadHandler)

I haven't found another way to detect unsupported files, which is why I'm using a will-download event in the first place.

Problem

For some reason the will-download handler of the quickView window overrides the handler of the main:

When I trigger the app update download event here (from the main process):

https://github.com/aleksey-hoffman/sigma-file-manager/blob/55fd2462cf83898610883191807b7488fb5bdf89/src/electronMain.js#L516

const resultInfo = await downloadManager.download(windows.main, {

It triggers the event handler of the quickView renderer window:

https://github.com/aleksey-hoffman/sigma-file-manager/blob/55fd2462cf83898610883191807b7488fb5bdf89/src/electronMain.js#L241

function _willDownloadHandler (event, item, webContents) {
  ...
  windows.main.webContents.send('load:webview::failed', {path: fileURL})

Partial fix

I partially fixed the problem in this commit by specifying a custom partition name for the session of the quickView window, so it doesn't use the default session and do not overwrite the will-download listener created by main:

Main process:

windows.quickViewWindow = new electron.BrowserWindow({
  ...
  webPreferences: {
    partition: 'quickPreview',

...

windows.quickViewWindow.webContents.session.once(
  'will-download',
  (event, item, webContents) => {
    event.preventDefault()
    ...
  }
)

quickViewWindow.html:

ipcRenderer.on('load:webview', (event, data) => {
  ...
  webviewNode.setAttribute('partition', 'quickPreview')

But this fix resulted in another problem:

Setting a custom partition to a webview causes the Windows protocol link association pop up in production when the window containing this webview is created:

image

I think it might be caused by the custom app:// protocol created by the electron-builder-plugin. It seems the pop up is triggered by the "app" link.

To reproduce:

  1. Download the project
git clone https://github.com/aleksey-hoffman/sigma-file-manager.git
cd sigma-file-manager
npm install
git checkout 47ce65b
npm run electron:build
  1. Install the built app from ./dist_electron
  2. During the app launch you can see the pop up

The window containing this webview is created on app.ready event. The pop up appears when the window gets created:

https://github.com/aleksey-hoffman/sigma-file-manager/blob/47ce65bdac78e5c9b17315f16623d40d81dcf1bb/src/electronMain.js#L698



from Electron.js: how to create a separate webContents.session for a window?

No comments:

Post a Comment