I am stuck when creating custom window controls like close, min/max and restore with nodeIntegration turned off. I created the buttons in my renderer's local html file
main.js
mainWindow = new BrowserWindow({
x, y, width, height,
frame: false,
show: false,
webPreferences: { devTools: true }
});
mainWindow.loadURL(url.format({
protocol: 'file:',
slashes: true,
pathname: path.join(__dirname, 'assets', 'index.html')
}));
index.html
<div id='minimize' class='noSelect'></div>
<div id='maximize' class='noSelect'></div>
<div id='restore' class='noSelect'></div>
<div id='close' class='noSelect'></div>
<script type='text/javascript' src='../assets/js/index.js'></script>
By default, nodeIntegration is off so index.js
has no access to Node. However, I need to be able to add functionality to the buttons to close, min/max and restore the window.
index.js
const { remote } = require('electron');
const mainWindow = remote.getCurrentWindow();
document.getElementById('close').addEventListener('click', () => {
mainWindow.close();
});
This wouldn't work because of nodeIntegration being disabled. Is it safe to have it enabled in a local page? If not, what is a safe way of doing this?