Electron Take Up 100% Of Screen (Not Full Screen)

I've got an electron app, below is the main.js file:

var app = require('electron').app;
var BrowserWindow = require('electron').BrowserWindow;

app.on('ready', function() {
    mainWindow = new BrowserWindow({
        height: 715,
        width: 1200,
        minWidth: 600,
        minHeight: 200,
        center: true
    });

    mainWindow.loadURL('file://' + __dirname + '/index.html');
});

As you can see, the width and height are specified. What I want is for the app to open, but take up all of the available screen (but NOT to be in full screen, such that the dock and tool bar of the OS are hidden).

In simple CSS this is done by using

width:100%;
height:100%;

I want to be able to reproduce this in my electron app, although cannot seem to find any details on how to do it

Note: fullscreen: true is not what I am looking for, as that makes the app open so that the dock and toolbar are hidden

Can anyone help?


use this!

win = new BrowserWindow({show: false});
win.maximize();
win.show();

Call mainWindow.maximize() to maximize the window after you create it.


Use this:

const electron = require('electron')
const { app, BrowserWindow } = electron

let win

app.on('ready', () => {
   const {width, height} = electron.screen.getPrimaryDisplay().workAreaSize
   win = new BrowserWindow({width, height})
   win.loadURL('https://github.com')
})