Implement electron-zone

[robwormald]

Electron uses both browser and some node APIs (EventEmitter, etc), and events fired by electron APIs (MenuItem, for example) cause angular to drop out the zone. Ref angular/angular#13363

We should implement an electron zone patch, that combines the browser APIs as well as a subset of the node APIs available to electron.

[JiaLiPassion]

I tried the issue in this repo, but can't reproduce. But I think current zone.js did not patch browser and node.js at the same time, just like #524 maybe the same issue in electron. Could you provide a reproduce step?

[robwormald]

@JiaLiPassion navigate via the menu at the top of the screen:

[JiaLiPassion]

I cleaned up my node_modules, I can reproduce now.

[sittingbool]

any update on this? i can use angular 2 only up to version 2.1 so far with electron

[JiaLiPassion]

For now, you have to do like this

 let pageMenu = new MenuItem({
            label: 'Page',
            submenu: [
                { label: 'Page 1', click: Zone.current.wrap(() => this.router.navigate(['/page1'])) },
                { label: 'Page 2', click: Zone.current.wrap(() => this.router.navigate(['/page2'])) },
            ],
        });

[sittingbool]

I don't only have a problem with the router. I have issues in general like with change detection and such.

[JiaLiPassion]

@sittingbool, could you give an example through some sample code or repository.

[JiaLiPassion]

@sittingbool , if your problem is related with electron menu or something like that, you could use the
method just like

 let pageMenu = new MenuItem({
            label: 'Page',
            submenu: [
                { label: 'Page 1', click: Zone.current.wrap(() => this.router.navigate(['/page1'])) },
                { label: 'Page 2', click: Zone.current.wrap(() => this.router.navigate(['/page2'])) },
            ],
        });

If your problem is related with your application(not electron), you may check the #533 to see whether it is the same problem, if it is , you can check PR #608 to see whether it resolve your problem or not.

[pamtbaau]

Any progress on this issue with electon menus and zone?

[sittingbool]

I really would appreciate that too
I cant really use electron with Angular 2+ so far.

[pamtbaau]

@sittingbool The suggested workarround of wrapping my code with zone.run(...) works fine for me, but I would rather do it without...

This is how my code looks like when invoking an Electron menu item:

private initMenu() {
   const template: Electron.MenuItemConstructorOptions[] = [
      {
          label: 'Set exchange rates',
          click: () => this.zone.run(() => this.showExchangeRateDialog = true),
      },
      {
          label: 'Set stock prices',
          click: () => this.zone.run(() => this.showStockPriceDialog = true),
      },
   ];

   this.menu = Menu.buildFromTemplate(template);
}

ChangeDetector is now picking up any changes of this.showExchangeRateDialog and this.showStockPriceDialog and the dialogs will show accordingly.

[sittingbool]

I don't have this Issue with menu alone. I have a general Issue with the Zone- Implementation in electron. The behavior has been overwritten from the default as far as I could see and Zone.js is reacting allergic to it.