How to get the DOM tree from BrowserWindow in an electronic application?

Question

I would like to receive data from one process to another in an electron, and I cannot figure out how to do this. I have the following code:

// I create a new browser window to load url var win = new BrowserWindow({ width: 800, height: 600, show: false }); win.loadURL('chrome://gpu'); win.webContents.on('dom-ready', function() { console.log("dom is ready"); }); // Here I want to get content of the loaded page and log it. 

I tried ipc but can figure out how to use it. Any help would be appreciated.

Thanks!!!

Answer 1

If you only want to register the contents, you can write them to the main stdout process directly using Electron remote.process directly from Renderer, but if you want to send the contents to the main process, then IPC is probably the best way (you can also use files, sockets, etc.).

Here is a very quick example of how you can do all this from your main.js file (but I would suggest using a separate file for the Renderer code and requesting it using the preload option for the Windows browser, this is just for illustrative purposes).

 var electron = require('electron'); var ipc = electron.ipcMain; var BrowserWindow = electron.BrowserWindow; var win = new BrowserWindow({ width: 800, height: 600, show: false }); win.webContents.on('dom-ready', () => { win.webContents.executeJavaScript(` require('electron').ipcRenderer.send('gpu', document.body.innerHTML); `); }); ipc.on('gpu', (_, gpu) => { console.log(gpu) }) win.loadURL('chrome://gpu'); 

Answer 2

This works for me, try:

 document.getElementsByTagName('input')[0].files[0].path 

In my code:

 document.getElementById("dst-btn").addEventListener("click", function(){ console.log('dst'); console.log(document.getElementsByTagName('input')[0].files[0].path); });