fix(runtime): replace innerHTML with textContent for CSS injection

[TheodoreGC]

This commit addresses security and performance concerns associated with using innerHTML for injecting CSS into <style> elements in bootstrap-lazy.ts.

By switching to textContent, the risk of executing malicious scripts is mitigated and performance is improved due to the avoidance of HTML parsing. This change enhances the security and efficiency of Stencil's component initialisation process, particularly in environments with strict security policies like browser extensions, without impacting functionality in standard web applications.

fixes: #5206

[github-actions]

--strictNullChecks error report

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

That's the same number of errors on main, so at least we're not creating new ones!

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/testing/puppeteer/puppeteer-element.ts	22
src/runtime/client-hydrate.ts	20
src/screenshot/connector-base.ts	19
src/runtime/vdom/vdom-render.ts	17
src/compiler/config/test/validate-paths.spec.ts	16
src/dev-server/request-handler.ts	15
src/compiler/prerender/prerender-optimize.ts	14
src/compiler/sys/stencil-sys.ts	14
src/compiler/transpile/transpile-module.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/connected-callback.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	Count
TS2345	364
TS2322	361
TS18048	201
TS18047	91
TS2722	37
TS2532	26
TS2531	22
TS2454	14
TS2790	11
TS2352	10
TS2769	8
TS2538	8
TS2344	6
TS2416	6
TS2493	3
TS18046	2
TS2684	1
TS2430	1

Unused exports report

There are 14 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	21	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	269	normalize
src/utils/index.ts	7	escapeRegExpSpecialCharacters
src/compiler/app-core/app-data.ts	25	BUILD
src/compiler/app-core/app-data.ts	115	Env
src/compiler/app-core/app-data.ts	117	NAMESPACE
src/compiler/fs-watch/fs-watch-rebuild.ts	123	updateCacheFromRebuild
src/compiler/types/validate-primary-package-output-target.ts	61	satisfies
src/compiler/types/validate-primary-package-output-target.ts	61	Record
src/testing/puppeteer/puppeteer-declarations.ts	485	WaitForEventOptions
src/compiler/sys/fetch/write-fetch-success.ts	7	writeFetchSuccessSync

[rwaskiewicz]

👋

I'm marking this as 'Awaiting Reply' for now, while we work on getting a reproduction case + a few additional questions answered in the issue associated with this PR.

[TheodoreGC]

Hey 👋,

Thanks for letting me know! I've updated the issue related to this PR with the bug reproduction project and all the requested information.

Let me know if there's anything else you need or if further details are required.

Thanks!

[alicewriteswrongs]

Just tested this out in the supplied repro case, and it looks good to me! I'm going to get this rebased and merge it in. Thanks for this contribution!

[github-actions]

PR built and packed!

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

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

npm install ~/Downloads/stencil-core-4.12.2-dev.1707774823.102fa79.tgz

[christian-bromann]

This fix has been published in v4.12.3.