Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Angular 13 Custom Elements + APP_INITIALIZER = ERROR TypeError: Object.defineProperty called on non-object

See original GitHub issue

Which @angular/* package(s) are the source of the bug?

elements, Don’t known / other

Is this a regression?

Description

Angular 13 custom elements + APP_INITIALIZER gives the following error. ERROR TypeError: Object.defineProperty called on non-object. Its was working fine in Angular 11. After migrating to angular 13, it stopped working. Any help is massively appreciated.

app.module.ts


export function startupServiceFactory(elementsStartupService: ElementsStartupService) {
  return () => elementsStartupService.init();
}

@NgModule({
  imports: [
   . . .
  ],
  providers: [
    . . ., 
    {
      provide: APP_INITIALIZER,
      useFactory: startupServiceFactory,
      deps: [ElementsStartupService],
      multi: true
    }
  ]
})
export class AppModule {
  constructor(private injector: Injector) {}
 ngDoBootstrap() {
    customElements.define(
      'site-notice',
      createCustomElement(SiteNoticeComponent, {injector: this.injector}));
 }
  
}

In pollyfills.ts

import 'zone.js'; // Included with Angular CLI.

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

TypeError: Object.defineProperty called on non-object
    at Function.n (polyfill-1651189218.js:1:2523)
    at mr (cjs.js:7:1)
    at v (cjs.js:12:1)
    at elements.mjs:450:49
    at dL (elements.mjs:450:49)
    at t.value (app.module.ts:55:7)
    at t.value (core.mjs:26222:32)
    at core.mjs:26189:26
    at y.value (zone.js:372:26)
    at Object.onInvoke (core.mjs:25608:33)



### Please provide the environment you discovered this bug in (run `ng version`)

```true
Angular CLI: 13.3.8
Node: 14.19.3
Package Manager: npm 8.9.0
OS: linux x64

Angular: 13.3.11
... animations, common, compiler, compiler-cli, core, elements
... forms, language-service, platform-browser
... platform-browser-dynamic, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.1303.8
@angular-devkit/build-angular      13.3.8
@angular-devkit/core               13.3.8
@angular-devkit/schematics         13.3.8
@angular/cdk                       13.3.9
@angular/cli                       13.3.8
@angular/flex-layout               13.0.0-beta.38
@angular/material                  13.3.9
@angular/material-moment-adapter   13.3.9
@schematics/angular                13.3.8
rxjs                               6.6.7
typescript                         4.6.4