同一页面中的多个 web 组件在 chrome 中出现错误，例如无法读取 Angular 中未定义（读取创建）的属性

Question

Created two web components: web-comp-1, web-comp-2

When I tried to add in HTML page, I am getting console error like below

Uncaught TypeError: Cannot read properties of undefined (reading 'create')
at new m.<computed> (web-comp-1.js:3:2706)
at new t (web-comp-1.js:3:12616)

When I checked the line, the code is,

(o = (u = F && 1 === a.create.length)? Reflect.construct

Generated web component using below versions and angular elements: "@angular/animations": "14.2.7", "@angular/cdk": "14.2.5", "@angular/common": "14.2.7", "@angular/compiler": "14.2.7", "@angular/core": "14.2.7", "@angular/elements": "14.2.7",

Stackblitz link:https://stackblitz.com/edit/web-platform-bkqbag?file=index.html

If you run in stack blitz, you wont see any error, you need to download the project and open in only "Chrome". This issue happening only in chrome, not in mozilla

Answer 1

Upgraded document-register-element package from 1.7.2 to 1.14.10 in package json, the error gone away. Thank you @Abolfazl Almas, your link triggered me an idea