Infinite call stack for ngNoHost in prod mode

[pauldraper]

ngNoHost

https://github.com/pauldraper/angular-nohost-stack-error

ng serve

http://localhost:4200/ works.

http://localhost:4200/?prod has the error:

core.js:9110 ERROR RangeError: Maximum call stack size exceeded
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)
    at InterceptingRenderer.renderer.childNodes (angular-contrib-core.js:1574)

Relevant code:

@Component({
  selector: 'stuff',
  host: { ngNoHost: '' },
  template: `
    Example
  `,
})
export class StuffComponent {}

@Component({
  selector: 'util',
  template: `
    <ng-container *ngTemplateOutlet="content"></ng-container>
  `,
})
export class UtilComponent {
  @ContentChild(TemplateRef, { static: false })
  content: TemplateRef<{}>;
}

@Component({
  selector: 'app',
  template: `
    <util>
      <ng-template>
        <stuff></stuff>
      </ng-template>
    </util>
  `,
})
export class AppComponent {
  @ContentChild(TemplateRef, { static: false })
  content: TemplateRef<{}>;
}

[Pedro-vk]

Same error using Angular 9

[pauldraper]

I don't know the consequences of this workaround, but it works for this example and my own uses.

Before app initialization, run:

import { createInterceptingRenderer } from '@angular-contrib/core';

createInterceptingRenderer(undefined, [
  undefined,
]).constructor.prototype.isExtended = true;

It skips this code path: https://github.com/trotyl/angular-contrib/blob/c3f0fd144fdf7e823d3910b8688ef051b9ecd606/projects/core/src/render-intercept/render-intercept.module.ts#L88

[nmagesh84]

I could also replicate this issue once the application is built in prod mode and deployed. Any idea when they will fix it ?

Hi Paul, I tried to add your workaround in APP_INITIALIZER but it did not work, still I get stack trace exception.

[ConnorDY]

I am also experiencing this issue. Is this project no longer maintained?

[pauldraper]

@nmagesh84 try it before boostrapping anything at all, like in main.ts.