Not compatible with Angular 13

GoJS
#1

After upgrading to Angular 13, the only module that I cannot acces in my application is the one that references go-js. When I try to lazy-load the module that references go-js, I get this exception :

Error: Uncaught (in promise): TypeError: Cannot use 'in' operator to search for 'Layout' in undefinedTypeError: Cannot use 'in' operator to search for 'Layout' in undefined

If I click on the link, it opens my module minified code and it seems to crash here:
eq=["Layout","GoJSScriptURL"],fq=this;eq[0]in fq

EDIT
bumped into this thread while googling for GoJsScriptURL. Looks like an issue that has occured in the past already and was fixed, but it’s back again :

https://githubmemory.com/repo/NorthwoodsSoftware/GoJS/issues/118

Not sure what to do with that but in any case can you make the wrapper compatible with Angular 13 please ?

And here’s my callstack, as you can see gojs is the first call in the stack :

image
image433×597 9.87 KB

#2

Hmmm. We’ll investigate it.

#3

Hello
any news on this issue ?
It is rather urgent as it is the only reason we cannot upgrade to angular 13.

Just upgrading the basic sample to angular 13 will not be enough (it works fine with angular 13). I think you also need to lazy-load a module that references gojs. At least this is my use-case. It may have to do with the way gojs-angular wrapper was compiled/packaged.

#4

How do you import the GoJS library and gojs-angular in each of your files? Do you import any GoJS extensions?

#5

In my lazy-loaded module file

import * as go from 'gojs';
import { GojsAngularModule } from 'gojs-angular';

@NgModule({
  declarations: [
    ProcessDesignerComponent
  ],
  imports: [
    PROCESS_MANAGEMENT_ROUTES,
    CommonModule,
    FormsModule,
    GojsAngularModule
  ],
})
export class ProcessManagementModule {
  constructor() {
    go.Diagram.licenseKey = environment.goJsLicenseKey;
  }
}
#6

Any news please ?

#7

Sorry, it’s been a busy week. I’ll investigate today

#8

Sorry, I’m having trouble reproducing your problem. I’ve been working on it all day.

Here is a repo I made that lazy loads gojs-angular when the /gojs route is accessed. Please let me know if it works for you, and note the changes between my project and yours

#9

This issue is very annoying because it stops us from upgrading to the latest angular version but it is hard to reproduce indeed.

In your sample, you are not really doing lazy-loading. You should remove GojsModule from the imports in app.module.
Then in home.html :

<a [routerLink]="'/gojs'">load module</a>

Load the app at localhost:4200/home then click on the link. That will lazy-load the gojs module (you can see the chunck file being downloaded)

However, unfortunately, this still works and does not show the exception I see in my app.

It seems it may be related to minification. Does the link I provided above give you any hints ? It’s the exact same error, so it seems related…

#10

I think I have misled you with lazy-loading.

I disabled lazy-loading in my app, and i’m now loading gojs module directly with the main.js content. I still get the same exception :

image
image1253×194 19.2 KB

I don’t see any difference between your sample and my app, other than the fact that my app is way bigger. But no other third-party libs is giving me this error.

#11

I have been debugging the minified code in my app for the version with Angular 12 and the version with Angular 13. I spotted the difference which leads to the exception, but I do not know why this happens.

Angular 13 version
at the end of the line, this is stored in B1. Then the statement O0 in B1 just below raises the exception.
This is because this is undefined.

image
image1246×41 6.84 KB

Angular 12 version.
same code but this time, this is not null and it refers to the current window

image
image692×48 2.78 KB

image
image1231×44 7.29 KB

A0[0]in E1 returns false but it does not raise any exception and my app works just fine.

any idea ?

#12

Which version of GoJS are you using? Can you check again with the latest, 2.1.56, if you are not using that? We actually made a change to the global object. It’s not necessarily relevant, but it might be.

#13

Finally, this is it !

My versions were :
“gojs”: “^2.1.30”,
“gojs-angular”: “2.0.4”,

I upgraded to :
“gojs”: “^2.1.56”,
“gojs-angular”: “2.0.4”,

And I can now load my module. What an annoying issue that was…
Thanks !

#14

Ah I see. We fixed some issues with the shadow DOM since 2.1.30, which was possibly the cause.