How to detect if running in electron?

[xiamx]

How do I detect in JavaScript whether the App is running inside an electron frame work not?

[anaisbetts]

window && window.process && window.process.type

[zcbenz]

There is also process.versions['electron'].

[carlosperate]

What if we are running the process without node integration? I think so far I've been relaying on the navigator.userAgent , is there a better way to do it?

[Pysis868]

Seems this has been merged, but I noticed this project gives a nice function for it, instead of using the conditional clauses directly in the code: https://github.com/cheton/is-electron

[richjeffery]

I've always been a little unhappy with using window && window.process && window.process.type as a way of detecting whether we're running in Electron, as it's very vague and could easily be used by something that isn't Electron.

As electron is revealed in the user agent I would suggest doing the following (tested working in 1.7.5):

var userAgent = navigator.userAgent.toLowerCase();
if (userAgent.indexOf(' electron/') > -1) {
   // Electron-specific code
}

Also, your App name is revealed in the user agent string, which is helpful if you have code for different variants of your app.

[monsieurnebo]

For information:

The first two methods arn't working for me, but @richjeffery's method is working fine. Things have probably changed since 2015.

[davidhariri]

It is not advisable to use window.process. Reasoning below.

1. It is not available in <webview>
2. It is not available in <iframe>
3. It will not be available if the node process is disabled.

IMO we should all use @richjeffery's solution or the Electron team should make a global property available to all contexts for non-spoofable detection.

[BobbyBabes]

These 3 work for me after @zcbenz suggestion :

if (process.versions.hasOwnProperty('electron')) {
  // Electron specific code
}else{
}

if (typeof (process.versions.electron) === 'string') {
  // Electron specific code
}else{
}

var WHY = (process.versions.hasOwnProperty('electron')) ? /*expression for Electron*/ : /*other expression*/;`

But I can see the advantage over this, of navigator.userAgent combined with the Electron app name proposed by @richjeffery.

[cstringer]

Just to clarify things for those just finding this: the above discussions do not mention if the approach applies to main or renderer scripts.

• For main scripts, they're running as a Node process, so use process.versions.hasOwnProperty('electron') or equivalent

• For renderer scripts, they're running in the browser, so use /electron/i.test(navigator.userAgent) or equivalent

[sarimabbas]

Assuming that I'm responsible for writing the main process code, I've used a preload script in which I have a context bridge

import { contextBridge } from "electron";

contextBridge.exposeInMainWorld("electron", {
  hello: "hello",
});

And then i check for the existence of globalThis.electron in my renderer process. Just wanted to put it out there in case this is a useful solution for anyone else, or if someone has feedback. Thanks!

[KerimG]

@sarimabbas
Good solution, because the window.process property isn't exposed when using contextIsolation

[fortinmike]

Somehow the userAgent was " " for me so I couldn't use that to detect Electron while keeping nodeIntegration disabled.

My solution was to define a property on window using a renderer process preload script:

When creating the window:

const window = new BrowserWindow({
  webPreferences: {
    preload: "window-preload.js", // Appropriate path to the file in your own project
  },
});

In window-preload.js:

// In the app, if window.isElectron is defined and true, we know we're running in Electron
Object.defineProperty(window, "isElectron", { get: () => true });

In the app:

console.log("Running in Electron?", window.isElectron);

[DaveFlashNL]

I hear the application name I give one of my projects is also exposed through the userAgent? if so how do I check agains it, i now have a function that sets a true or false flag if the page is loaded by electron, but i only check the one user agent string, which is i think a recipe for disaster at some point, and i would need more proof in my code to know it's the electron version of my application which is opened by the user,

this is my code thus far:

export const isDesktopApp = () => {
    if (navigator.userAgent.indexOf('Electron') >= 0) {
        //console.log(navigator.userAgent.toString());
        return true;
    } else {
       //console.log(navigator.userAgent.toString());
        return false;
    }
};

and console.log is commented, it's there for debug ofc.

[raquibmca]

Hi I, got solution

// main process
new BrowserWindow({
webPreferences: {
preload: "preload.js",
},
});

// preload.js
// you don't need to use contextBridge if contextIsolation is false
// but it's true by default in Electron 12
const { contextBridge } = require("electron");
contextBridge.exposeInMainWorld("IN_DESKTOP_ENV", true);

// renderer process (your React world)
if (window.IN_DESKTOP_ENV) {
// do something...
}