javascript - Electron BrowserView not capturing mouse events - Stack Overflow

admin管理员组

文章数量:1406969

I have a Electron based browser like application which requires rendering of client applications. I was tempted to use electron's webivew to render my apps but they are not remended and also disabled by default. Also because of chromiums OOPIF (Out of process IFrames) architecture behind webviews its no longer possible to capture keyboard and mouse events which are critical to my application.

So I am using the newer BrowserView api and using it to render my client web applications. But sadly I could only capture keyboard events using before-input-event event.

This is a sample of my code.

let mainWindow = null;

app.on('ready', () => {
  mainWindow = new BrowserWindow({ show: false });
  mainWindow.setBounds({ x: 0, y: 0, width: 800, height: 600 })
  mainWindow.once('ready-to-show', () => {
    mainWindow.show();
  });

  let view = new BrowserView()
  mainWindow.setBrowserView(view)
  view.webContents.loadURL('')
  view.webContents.on('before-input-event', (event, input) => {
    console.log(event, input);
  });
});

I looked into electron's github issues and the official documents as well but couldn't find anything. Has anyone found a way to capture the mouse events as well from inside of a BrowserView ? Any help would be very appreciated.

I have a Electron based browser like application which requires rendering of client applications. I was tempted to use electron's webivew to render my apps but they are not remended and also disabled by default. Also because of chromiums OOPIF (Out of process IFrames) architecture behind webviews its no longer possible to capture keyboard and mouse events which are critical to my application.

So I am using the newer BrowserView api and using it to render my client web applications. But sadly I could only capture keyboard events using before-input-event event.

This is a sample of my code.

let mainWindow = null;

app.on('ready', () => {
  mainWindow = new BrowserWindow({ show: false });
  mainWindow.setBounds({ x: 0, y: 0, width: 800, height: 600 })
  mainWindow.once('ready-to-show', () => {
    mainWindow.show();
  });

  let view = new BrowserView()
  mainWindow.setBrowserView(view)
  view.webContents.loadURL('https://electronjs')
  view.webContents.on('before-input-event', (event, input) => {
    console.log(event, input);
  });
});

I looked into electron's github issues and the official documents as well but couldn't find anything. Has anyone found a way to capture the mouse events as well from inside of a BrowserView ? Any help would be very appreciated.

• javascript
• electron

Share Follow asked Jul 29, 2019 at 19:23 Gaurab KcGaurab Kc 85199 silver badges99 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

by using preload webPreferences for browserview where you can use ipcRenderer where the preload.js script will be

document.addEventListener('click', (event) => {
  ipcRenderer.send('something', event);
});

and in the main electron js you have to use preload and call ipc main to capture the mouse data

let view = new BrowserView({
 webPreferences: {
  preload: path.join(__dirname, 'preload.js'),
 }
});

ipcMain.on('something', function (event, arg) {
  // your code here
})

本文标签： javascriptElectron BrowserView not capturing mouse eventsStack Overflow