ERROR in RangeError: Maximum call stack size exceeded

[aaBoustani]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Feature request
[ ] Documentation issue or request

Current behavior

I import the module in app.modules and include it in imports.
When I run ng serve --aot, I get an error ERROR in RangeError: Maximum call stack size exceeded.

Environment

Angular version: 5.1.3
Angular Google place version : 0.0.3
 
For Tooling issues:
- Node version: 9.2.1  
- Platform:  Linux Ubuntu-Gnome 17.04

[alexzuza]

@psykolm22 Hey!

The reason for this is that your library is released with wrong metadata for AngularGooglePlaceDirective symbol:

"AngularGooglePlaceDirective": {
  "__symbolic": "reference",
  "name": "AngularGooglePlaceDirective"
},

The problem is connected with this issue angular/angular#19219. (Seems it is not completely resolved)

In your library you're exporting AngularGooglePlaceDirective like:

export { AngularGooglePlaceDirective} from './directives/angular-google-place.directive';

https://github.com/psykolm22/angular-google-place/blob/master/src/lib/angular-google-place/index.ts#L14

and also importing the same directive from another path:

import { AngularGooglePlaceDirective } from './directives/index';

https://github.com/psykolm22/angular-google-place/blob/master/src/lib/angular-google-place/angular-google-place.module.ts#L2

I know it's hard to understand but Angular MetadataCollector just cuts metadata if it you have an identifier that refers to different paths. For me it looks like a bug

To workaround it just open angular-google-place/src/lib/angular-google-place/index.ts file and change export as follows:

export { AngularGooglePlaceDirective} from './directives/index';

After that you can open angular-google-place.metadata.json file and now metadata for your directive should look like(prettified version of course:)):

"AngularGooglePlaceDirective": {
      "__symbolic": "class",
      "decorators": [
        {
          "__symbolic": "call",
          "expression": {
            "__symbolic": "reference",
            "module": "@angular/core",
            "name": "Directive"
          },
          "arguments": [
            {
              "selector": "[angularGooglePlace]"
            }
          ]
        }
 ],

/cc @ocombe Can you please look at this?

Update: added minimal repro https://github.com/alexzuza/ng-metadata-bug

[lujakob]

@psykolm22 I created a PR for this issue with @alexzuza solution. Please have a look. Would be great if you could update the NPM repo, as it's blocking our production build. Thanks.

[lujakob]

In the meantime I have a built package in a public repository that can be used with the following package import
"angular-google-place": "lujakob/angular-google-place-package",

[ray-kay]

thank you so much @lujakob

[ouatrahim]

@lujakob Thanks for your public repo of angular-google-place! But i don't really get how to add it in my project! It would be awesome if you could give me more informations.

[lujakob]

@ouatrahim You add the package by adding the following line to your package.json "dependencies" part:
"angular-google-place": "lujakob/angular-google-place-package"
The usage is described in the readme of the original package https://github.com/psykolm22/angular-google-place

[ouatrahim]

@lujakob Thanks ! very helpfull!!!

[IRCraziestTaxi]

Is this really still not fixed? I updated all my packages yesterday in my frantic storm of googling and checking ALL of my files for potential recursive calls, imports, etc. until I FINALLY found this comment. I wasted so much time on this.