I can send string and object from one BrowserWindow to another BrowserWindow using ipcRenderer and ipcMain in electronJS
the code: mainProcess.js:
function createWindow1 () {
window1 = new BrowserWindow({width: 800,height: 600})
window1.loadURL(`file://${__dirname}/window1.html`)
window1.webContents.openDevTools()
window1.on('closed', function () {
window1 = null
})
return window1
}
function createWindow2 () {
window2 = new BrowserWindow({width: 1000, height: 600})
window2.loadURL(`file://${__dirname}/window2.html`)
window2.webContents.openDevTools()
window2.on('closed', function () {
window2 = null
})
return window2
}
app.on('ready', () => {
window1 = createWindow1();
window2 = createWindow2();
ipcMain.on('nameMsg', (event, arg) => {
console.log("name inside main process is: ", arg); // this comes form within window 1 -> and into the mainProcess
event.sender.send('nameReply', { not_right: false }) // sends back/replies to window 1 - "event" is a reference to this chanel.
window2.webContents.send( 'forWin2', arg ); // sends the stuff from Window1 to Window2.
});
window1.html:
<body>
<input type="text" id="name" value="" placeholder="Enter your name">
<button type="button" id="sendName" >Send the name! </button>
</body>
<script>
// You can also require other files to run in this process
require('./window1.js')
</script>
window1.js:
const ipcRenderer = require('electron').ipcRenderer
let name = document.getElementById('name');
ButtonSendName = document.getElementById('sendName');
ButtonSendName.addEventListener('click', (event) => {
ipcRenderer.send('nameMsg', name.value);
})
ipcRenderer.on('nameReply', (event, arg) => {
console.log(arg) // why/what is not right..
});
window2.html:
<body>
<p id = "showName"></p>
</body>
<script>
require('./window2.js')
</script>
window2.js:
const { ipcRenderer } = require('electron')
showName = document.getElementById('showName')
ipcRenderer.on('forWin2', function (event, arg){
console.log(arg);
showName.innerHTML = arg;
});
console.log("I'm Window2");
A demo would be better, but I don't know how to build an electron CodeBin app. This image gives you an idea:
This works nicely.
But I am not able to send DOM object (HTML element object) using this approch
ipcRenderer.invoke('slideChange', document.getElementById('selectedSlide'))
I am getting error Uncaught (in promise) Error: An object could not be cloned.
Is there any way to pass HTML element to another BrowserWindow using same machanism?
Unfortunately, using Electron, you can't send DOM objects between processes.
Ref: Electron - Inter-Process Communication - Object serialization.