ngx-electron icon indicating copy to clipboard operation
ngx-electron copied to clipboard

isElectronApp is true but remote is null

Open StationedInTheField opened this issue 5 years ago • 18 comments
trafficstars

I tried the workarounds here: https://github.com/ThorstenHans/ngx-electron/issues/32

With:

  win = new BrowserWindow({ width: 950, height: 555, backgroundColor: "#ffffff",
    acceptFirstMouse: true,
    webPreferences: {
      nodeIntegration: true,
      nodeIntegrationInWorker: true,
      backgroundThrottling: false
    }
  });

Somehow nodeIntegration: true seems to go ignored for me, I'm trying to use the remote module to require fs but remote keeps coming back as null. Spent all day trying all different kinds of workarounds, but nothing worked. I have "@angular-builders/custom-webpack": "^9.2.0" and "electron-builder": "^22.7.0":

const webpack = require('webpack')

module.exports = {
  node: {
      crypto: false,
      path: true,
      os: true,
      stream: true,
      buffer: false
  },
  plugins: [
         new webpack.DefinePlugin({
             'process.env.NODE_ENV': JSON.stringify('production')
         })
     ]

}

I also tried adding:

  target: "node-webkit",

It compiles and packages the app but throws require is not defined before the app gets loaded, I guess this only worked in an older version of webpack.

angular.json has: "builder": "@angular-builders/custom-webpack:browser",

If I try to require('electron').remote or window.require('electron').remote in the console after the unmodified app has loaded (no ngx-electron inside), then I just get require is not defined as well.

StationedInTheField avatar Aug 28 '20 16:08 StationedInTheField

Okay never mind, I fixed it. Not entirely sure how but I had to downgrade my node typings to 12.0.12.

StationedInTheField avatar Aug 28 '20 17:08 StationedInTheField

It seems that ElectronService.remote is null consistently in electron 10+. I had to downgrade electron from 10.1.0 to 9.2.1 to get it to work.

import { Component } from '@angular/core';
import { ElectronService } from 'ngx-electron';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: [ './app.component.scss' ]
})
export class AppComponent {
    get window() {
        return this.electron.remote.getCurrentWindow();
    }

    constructor(private electron: ElectronService) { }

    close() { this.window.close(); }
}

Any reference to this.window errors with a null reference on getCurrentWindow() because remote is null.

calico-crusade avatar Aug 29 '20 05:08 calico-crusade

Try:

webPreferences: {
      nodeIntegration: true,
      nodeIntegrationInWorker: true,
      backgroundThrottling: false,
      enableRemoteModule: true
    }

Among other things that's one thing I changed, you can also keep your eyes on https://github.com/QuestNetwork/quest-messenger-js - I still have a little libp2p pubsub issue (ipfs/js-ipfs issues/3249), but once that's solved and the demo works, I'll commit it and it has remote working now (using it to require 'fs' so that I can store config, message history, etc)

StationedInTheField avatar Aug 29 '20 10:08 StationedInTheField

I am having undefined issues all over the place with Electron 10.0.0 also.

billygerhard avatar Aug 30 '20 02:08 billygerhard

I found a solution. In 10+ enableRemoteModule is set to false by default. In your mainWindow constructor, add it to your web preferences

webPreferences: {
      enableRemoteModule: true,
}

billygerhard avatar Aug 30 '20 02:08 billygerhard

So the last thing I told people to try probably did the trick. Thanks for the info @billygerhard !

StationedInTheField avatar Aug 30 '20 08:08 StationedInTheField

Sometimes it helps to read the release notes! Breaking changes always seem to break stuff!

billygerhard avatar Aug 30 '20 13:08 billygerhard

That's where I got it. Would be great if these things found their way into the readme since a number of people keep running into the same issue =)

StationedInTheField avatar Aug 31 '20 00:08 StationedInTheField

Try:

webPreferences: {
      nodeIntegration: true,
      nodeIntegrationInWorker: true,
      backgroundThrottling: false,
      enableRemoteModule: true
    }

Among other things that's one thing I changed, you can also keep your eyes on https://github.com/QuestNetwork/quest-messenger-js - I still have a little libp2p pubsub issue (ipfs/js-ipfs issues/3249), but once that's solved and the demo works, I'll commit it and it has remote working now (using it to require 'fs' so that I can store config, message history, etc)

This worked for me, thank you. :) electron 10.0.0

Bug-Reaper avatar Jan 23 '21 05:01 Bug-Reaper

What version of angular are you guys on? I'm having a hell of time connecting to anything electron and was hoping this library would help. Now I get the same thing where the it's going in the block because it's true but the sendSync bombs and is NULL

    if (this._electronService.isElectronApp) {
      let pong: string = this._electronService.ipcRenderer.sendSync('ping');
      console.log(pong);
  }

Do I need to downgrade to electron 10.* ? Even adding the web preferences didn't fix it.

EDIT: Currently on "electron": "^12.0.1",

eddyizm avatar Mar 17 '21 01:03 eddyizm

What version of angular are you guys on? I'm having a hell of time connecting to anything electron and was hoping this library would help. Now I get the same thing where the it's going in the block because it's true but the sendSync bombs and is NULL

    if (this._electronService.isElectronApp) {
      let pong: string = this._electronService.ipcRenderer.sendSync('ping');
      console.log(pong);
  }

Do I need to downgrade to electron 10.* ? Even adding the web preferences didn't fix it.

EDIT: Currently on "electron": "^12.0.1",

I have exactly the same problem with Electron 12.0.1 and ngx-electron 2.2.0 ipcRenderer stays null. So my send / on functions are all broken!

Jay031 avatar Mar 17 '21 15:03 Jay031

Its because of the new security options they add as electron gets updated more, my current webPreferences for my main window I know you need on electron 12 are

webPreferences: {
      enableRemoteModule: true,
      contextIsolation: false,
}

billygerhard avatar Mar 17 '21 15:03 billygerhard

@billygerhard That totally worked! It looks like I was missing the contextIsolation: false I was ready to pack my bags and use another boiler plate template even when I really didn't want to. Thanks a bunch!

@Jay031 see above.

eddyizm avatar Mar 18 '21 00:03 eddyizm

Love the quick replies, thanks guys! I also missed the contextIsolation: false

Jay031 avatar Mar 18 '21 09:03 Jay031

Have struggled with that error for few days too. In case you can't/don't want to disable contextIsolation here is guide on how to use preload.js nicely.

Basically you can get same behavior and expose only those things you really want to

CatbirdBasil avatar Apr 26 '21 16:04 CatbirdBasil

So I have tried this with electron v12 - I need to do 3 things: nodeIntegration: true, enableRemoteModule: true, contextIsolation: false As a consequence I am able to access electronService.remote.fs etc etc. however, when i set contextIsolations as false, it breaks my giving other errors in the angular code: ReferenceError: $ is not defined My jquery etc, which was normally preloaded earlier does not load any more. Why is this happening

venomoustoad avatar Jul 21 '21 13:07 venomoustoad

With this package.json run find but if try update electron to latest version and not compile. may be the package is too old.

{ "name": "generator", "productName": "Nestjs Generator", "version": "0.0.28", "author": "Luis Alejandro Figueredo Casadei", "description": "Generator for Nestjs", "main": "main.js", "icon": "dist/generador/assets/icons/win/icon.ico", "build": { "appId": "generador", "files": [ "dist/generador//*", "node_modules//*", "package.json", "main.js" ], "win": { "icon": "dist/generador/assets/icons/win/icon.ico", "target": [ "msi", "nsis" ] } }, "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "start:electron": "ng build --base-href ./ && electron . ", "start:electronserv": "ng build --base-href ./ && electron . --serve", "pack": "electron-builder --dir", "dist": "electron-builder" }, "private": true, "dependencies": { "@angular/animations": "~12.2.3", "@angular/cdk": "^12.2.3", "@angular/common": "~12.2.3", "@angular/compiler": "~12.2.3", "@angular/core": "~12.2.3", "@angular/flex-layout": "^12.0.0-beta.34", "@angular/forms": "~12.2.3", "@angular/material": "^12.2.3", "@angular/platform-browser": "~12.2.3", "@angular/platform-browser-dynamic": "~12.2.3", "@angular/router": "~12.2.3", "@nestjs/cli": "^7.6.0", "electron-builder-squirrel-windows": "^22.10.5", "electron-reload": "^1.5.0", "ngx-electron": "^2.2.0", "prettier": "^2.3.2", "rxjs": "~6.5.4", "tslib": "^2.0.0", "zone.js": "~0.11.4" }, "devDependencies": { "@angular-devkit/build-angular": "~12.2.3", "@angular/cli": "~12.2.3", "@angular/compiler-cli": "~12.2.3", "@angular/language-service": "~12.2.3", "@types/electron": "^1.6.10", "@types/jasmine": "~3.6.0", "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "electron": "^8.2.2", "electron-builder": "^22.10.5", "jasmine-core": "~3.6.0", "jasmine-spec-reporter": "~5.0.0", "karma": "~6.3.4", "karma-chrome-launcher": "~3.1.0", "karma-coverage-istanbul-reporter": "~3.0.2", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "^1.5.0", "protractor": "~7.0.0", "ts-node": "~8.3.0", "tslint": "~6.1.0", "typescript": "^4.2.3" } }

luisalejandrofigueredo avatar Sep 01 '21 04:09 luisalejandrofigueredo

Remote has been deprecated v12 and removed in v14: https://www.electronjs.org/docs/latest/breaking-changes#removed-remote-module

TheColorRed avatar Oct 19 '21 23:10 TheColorRed