search

ionic-team / stencil

A toolchain for building scalable, enterprise-ready component systems on top of TypeScript and Web Component standards. Stencil components can be distributed natively to React, Angular, Vue, and traditional web developers from a single, framework-agnostic codebase.
https://stenciljs.com
Other
12.4k stars 775 forks source link

fix(runtime): don't register listener before connected to DOM #5844

Closed christian-bromann closed 1 week ago

christian-bromann commented 1 week ago

What is the current behavior?

fixes #4067

What is the new behavior?

Remove all addHostEventListeners calls before the element isn't connected to the DOM.

Documentation

Does this introduce a breaking change?

This may be a potential breaking change. However I think this behavior is the desired one and what we had before was basically a bug.

Testing

I may add more e2e tests to ensure this also works in the browser.

Other information

n/a

github-actions[bot] commented 1 week ago

@stencil/core@4.18.3 ts tsc --noEmit --project scripts/tsconfig.json && tsx scripts/tech-debt-burndown-report.ts

--strictNullChecks error report

Typechecking with --strictNullChecks resulted in 1074 errors on this branch.

Unfortunately, it looks like that's an increase of 3 over main 😞.

Violations Not on `main` (may be more than the count above) | Path | Location | Error | Message | | --- | --- | --- | --- | | src/hydrate/platform/hydrate-app.ts | (187, 35) | TS2345 | | src/hydrate/platform/hydrate-app.ts | (191, 15) | TS2722 | | src/hydrate/platform/hydrate-app.ts | (196, 27) | TS18048 | | src/hydrate/platform/hydrate-app.ts | (196, 50) | TS18048 | | src/hydrate/platform/hydrate-app.ts | (218, 11) | TS18048 | | src/hydrate/platform/hydrate-app.ts | (320, 7) | TS2322 | | src/runtime/bootstrap-custom-element.ts | (76, 35) | TS2345 | | src/runtime/bootstrap-custom-element.ts | (125, 9) | TS18048 | | src/runtime/bootstrap-custom-element.ts | (126, 23) | TS18048 | | src/runtime/bootstrap-custom-element.ts | (128, 43) | TS2345 | | src/runtime/bootstrap-custom-element.ts | (129, 52) | TS2538 | | src/runtime/bootstrap-custom-element.ts | (129, 52) | TS2538 | | src/runtime/bootstrap-custom-element.ts | (135, 9) | TS18048 | | src/runtime/bootstrap-custom-element.ts | (135, 9) | TS2322 | | src/runtime/bootstrap-custom-element.ts | (137, 22) | TS2345 | | src/runtime/bootstrap-lazy.ts | (57, 21) | TS2345 | | src/runtime/bootstrap-lazy.ts | (153, 41) | TS2345 | | src/runtime/bootstrap-lazy.ts | (173, 18) | TS2532 | | src/testing/platform/testing-host-ref.ts | (11, 23) | TS2345 | | src/testing/platform/testing-host-ref.ts | (38, 3) | TS18048 | | src/testing/platform/testing-host-ref.ts | (39, 37) | TS2345 |

reports and statistics

Our most error-prone files | Path | Error Count | | --- | --- | | src/dev-server/index.ts | 37 | | src/dev-server/server-process.ts | 32 | | src/compiler/prerender/prerender-main.ts | 22 | | src/runtime/vdom/vdom-render.ts | 22 | | src/runtime/client-hydrate.ts | 20 | | src/runtime/vdom/test/patch.spec.ts | 19 | | src/runtime/vdom/test/util.spec.ts | 19 | | src/screenshot/connector-base.ts | 19 | | src/testing/puppeteer/puppeteer-element.ts | 19 | | src/dev-server/request-handler.ts | 15 | | src/runtime/connected-callback.ts | 15 | | src/compiler/prerender/prerender-optimize.ts | 14 | | src/compiler/sys/stencil-sys.ts | 14 | | src/sys/node/node-sys.ts | 14 | | src/compiler/prerender/prerender-queue.ts | 13 | | src/compiler/sys/in-memory-fs.ts | 13 | | src/runtime/set-value.ts | 13 | | src/compiler/output-targets/output-www.ts | 12 | | src/compiler/transformers/test/parse-vdom.spec.ts | 12 | | src/compiler/transformers/transform-utils.ts | 12 |
Our most common errors | [Typescript Error Code](https://github.com/microsoft/TypeScript/blob/main/src/compiler/diagnosticMessages.json) | Count | | --- | --- | | TS2322 | 337 | | TS2345 | 328 | | TS18048 | 185 | | TS18047 | 99 | | TS2722 | 27 | | TS2532 | 23 | | TS2531 | 19 | | TS2790 | 11 | | TS2454 | 10 | | TS2352 | 9 | | TS2769 | 8 | | TS2416 | 7 | | TS2538 | 4 | | TS2493 | 3 | | TS18046 | 2 | | TS2684 | 1 | | TS2430 | 1 |

Unused exports report

There are 15 unused exports on this PR. That's the same number of errors on main, so at least we're not creating new ones!

Unused exports | File | Line | Identifier | | --- | --- | --- | | src/runtime/bootstrap-lazy.ts | 22 | setNonce | | src/screenshot/screenshot-fs.ts | 18 | readScreenshotData | | src/testing/testing-utils.ts | 198 | withSilentWarn | | src/utils/index.ts | 145 | CUSTOM | | src/utils/index.ts | 245 | NODE_TYPES | | src/utils/index.ts | 269 | normalize | | src/utils/index.ts | 7 | escapeRegExpSpecialCharacters | | src/compiler/app-core/app-data.ts | 25 | BUILD | | src/compiler/app-core/app-data.ts | 116 | Env | | src/compiler/app-core/app-data.ts | 118 | NAMESPACE | | src/compiler/fs-watch/fs-watch-rebuild.ts | 123 | updateCacheFromRebuild | | src/compiler/types/validate-primary-package-output-target.ts | 82 | satisfies | | src/compiler/types/validate-primary-package-output-target.ts | 82 | Record | | src/testing/puppeteer/puppeteer-declarations.ts | 496 | WaitForEventOptions | | src/compiler/sys/fetch/write-fetch-success.ts | 7 | writeFetchSuccessSync |
github-actions[bot] commented 1 week ago

PR built and packed!

Download the tarball here: https://github.com/ionic-team/stencil/actions/runs/9617770624/artifacts/1625806109

If your browser saves files to ~/Downloads you can install it like so:

unzip -d ~/Downloads ~/Downloads/stencil-core-4.18.3-dev.1718992535.ef88224.tgz.zip && npm install ~/Downloads/stencil-core-4.18.3-dev.1718992535.ef88224.tgz