Electron get classname of object selected object using ipcRenderer in browser window

229 views Asked by At

I have a browser window object that uses 'NodeIntegration=true' to interact between the renderer and main using the ipcRendere, it works fine for pages such as github.com. Unfortunately for StackOverflow, it doesn't load the external javascript files. When I turn off NodeIntegration it works fine.

Below is my code

Using the context menu right click on the selected object o identify the class and pass as a sync message

click: () => {

  let codex = `
  var ipc = require('electron').ipcRenderer;
  var identified = document.elementFromPoint(${params.x}, ${params.y});
  console.log(ipc.sendSync('synchronous-message', identified.className.toString()));
  
      
  `;
  mainWindow.webContents.executeJavaScript(codex);
  //mainWindow.webContents.inspectElement(params.x,params.y)

}

ipcMain.on('synchronous-message', (event, arg) => {
  console.log(arg) // prints class name
  event.returnValue = 'pong'
})

Dom inspector and Jquery are loaded when page finishes loading

  mainWindow.webContents.on('did-finish-load', ()=>{
    let code = `
    let $ = require('jquery')
    const DomInspector = require('dom-inspector');
    const inspector = new DomInspector({
  });
  inspector.enable()
        
    `;
    mainWindow.webContents.executeJavaScript(code);
});

Output

enter image description here

When I turn off node integration it works, but I am not sure how to inject dom-inspector js. Should I try using a <webview> and preload the script, any ideas?

0

There are 0 answers