From 0831d2c35bc16cdc27640353f141ebb2681cb925 Mon Sep 17 00:00:00 2001 From: John Jenkins Date: Mon, 28 Jul 2025 17:43:19 +0100 Subject: [PATCH 1/4] fix(rollup): proper `warn` handling (#6357) Co-authored-by: John Jenkins --- src/compiler/bundle/bundle-output.ts | 24 ++++++++++++++++++++++-- test/wdio/global.ts | 5 +++++ 2 files changed, 27 insertions(+), 2 deletions(-) diff --git a/src/compiler/bundle/bundle-output.ts b/src/compiler/bundle/bundle-output.ts index 03646f115ef..7686975f0c8 100644 --- a/src/compiler/bundle/bundle-output.ts +++ b/src/compiler/bundle/bundle-output.ts @@ -71,18 +71,38 @@ export const getRollupOptions = ( // Investigate if we can use this to leverage Stencil's in-memory fs }; + // @ts-expect-error - this is required now. + nodeResolvePlugin.warn = (log) => { + const onWarn = createOnWarnFn(buildCtx.diagnostics); + if (typeof log === 'string') { + onWarn({ message: log }); + } else if (typeof log === 'function') { + const result = log(); + if (typeof result === 'string') { + onWarn({ message: result }); + } else { + onWarn(result); + } + } else { + onWarn(log); + } + }; + assertIsObjectHook(nodeResolvePlugin.resolveId); // remove default 'post' order nodeResolvePlugin.resolveId.order = null; const orgNodeResolveId = nodeResolvePlugin.resolveId.handler; + const orgNodeResolveId2 = (nodeResolvePlugin.resolveId.handler = async function (importee: string, importer: string) { const [realImportee, query] = importee.split('?'); const resolved = await orgNodeResolveId.call( nodeResolvePlugin as unknown as PluginContext, realImportee, importer, - // @ts-expect-error - missing required properties but works in practice - {}, + { + attributes: {}, + isEntry: true, + }, ); if (resolved) { if (isString(resolved)) { diff --git a/test/wdio/global.ts b/test/wdio/global.ts index b8c0753ca46..aa50ecd8292 100644 --- a/test/wdio/global.ts +++ b/test/wdio/global.ts @@ -3,6 +3,8 @@ // `stencil-sibling` test suite import '@test-sibling'; import { setMode } from '@stencil/core'; +// @ts-expect-error - tests that rollup warnings don't break the build +import { setAssetPath } from '@stencil/core/internal/client/index'; const globalScript = () => { setMode((elm) => { @@ -10,4 +12,7 @@ const globalScript = () => { }); }; +// this doesn't do anything - just stops rollup removing the import +setAssetPath('/base/path'); + export default globalScript; From 7047196b877f48812783a4d158ac5b3149bcd839 Mon Sep 17 00:00:00 2001 From: Jagget Date: Mon, 28 Jul 2025 17:33:56 -0400 Subject: [PATCH 2/4] fix(runtime): fixed parsing of complex attributes that contains JSON strings (#6359) * fix(runtime): fixed parsing of complex attributes that contains JSON strings * Added test * Prettier styling fix --- src/runtime/test/prop.spec.tsx | 31 +++++++++++++++++++++++++++++++ src/utils/constants.ts | 2 +- 2 files changed, 32 insertions(+), 1 deletion(-) diff --git a/src/runtime/test/prop.spec.tsx b/src/runtime/test/prop.spec.tsx index 5728c17d2b7..62165b10dd6 100644 --- a/src/runtime/test/prop.spec.tsx +++ b/src/runtime/test/prop.spec.tsx @@ -208,4 +208,35 @@ describe('prop', () => { 4 `); }); + + it('should demonstrate JSON parsing for complex object props', async () => { + @Component({ tag: 'simple-demo' }) + class SimpleDemo { + @Prop() message: { text: string } = { text: 'default' }; + @Prop() messageAny: any = { text: 'default' }; + + render() { + return ( +
+
{this.message.text}
+
{this.messageAny.text}
+
+ ); + } + } + + const { root } = await newSpecPage({ + components: [SimpleDemo], + html: ``, + }); + + expect(root).toEqualHtml(` + +
+
Hello World
+
Hello World
+
+
+ `); + }); }); diff --git a/src/utils/constants.ts b/src/utils/constants.ts index 4b749ab27b8..9cdb49a1904 100644 --- a/src/utils/constants.ts +++ b/src/utils/constants.ts @@ -17,7 +17,7 @@ export const enum MEMBER_FLAGS { Setter = 1 << 12, Prop = String | Number | Boolean | Any | Unknown, - HasAttribute = String | Number | Boolean | Any, + HasAttribute = String | Number | Boolean | Any | Unknown, PropLike = Prop | State, } From 6b41e88c7a6c9920b6cecb991247d58890631389 Mon Sep 17 00:00:00 2001 From: jttommy <137304937+jttommy@users.noreply.github.com> Date: Mon, 4 Aug 2025 17:23:07 -0400 Subject: [PATCH 3/4] chore(tests) (#6363) * chore(tests) Uses document tree verification instead of snapshot tests to confirm rendering works for two failing tests. Tests were failing due to some limitations with the testing framework. Specifically that numerous snapshots of the same segment of HTML were not allowed in certain use cases * chore(tests) I've run the formatter and linter. Fixed a linting error in package.json where Windows machines will not run eslint if the targets are wrapped in single quotes --- package.json | 2 +- test/wdio/render/render.test.tsx | 35 +++++++++++------------ test/wdio/text-content-patch/cmp.test.tsx | 6 ++-- 3 files changed, 19 insertions(+), 24 deletions(-) diff --git a/package.json b/package.json index d4d20d02882..290ba984287 100644 --- a/package.json +++ b/package.json @@ -104,7 +104,7 @@ "clean": "rimraf --max-retries=2 build/ cli/ compiler/ dev-server/ internal/ mock-doc/ sys/node/ sys/ testing/ && npm run clean:scripts && npm run clean.screenshots", "clean.screenshots": "rimraf test/end-to-end/screenshot/builds test/end-to-end/screenshot/images", "clean:scripts": "rimraf scripts/build", - "lint": "eslint 'bin/*' 'scripts/*.ts' 'scripts/**/*.ts' 'src/*.ts' 'src/**/*.ts' 'src/**/*.tsx' 'test/wdio/**/*.tsx'", + "lint": "eslint bin/* scripts/*.ts scripts/**/*.ts src/*.ts src/**/*.ts src/**/*.tsx test/wdio/**/*.tsx", "install.jest": "npx tsx ./src/testing/jest/install-dependencies.mts", "prettier": "npm run prettier.base -- --write", "prettier.base": "prettier --cache \"./({bin,scripts,src,test}/**/*.{ts,tsx,js,jsx})|bin/stencil|.github/(**/)?*.(yml|yaml)|*.js\"", diff --git a/test/wdio/render/render.test.tsx b/test/wdio/render/render.test.tsx index 3f40b0788a1..23c13245482 100644 --- a/test/wdio/render/render.test.tsx +++ b/test/wdio/render/render.test.tsx @@ -32,24 +32,21 @@ describe('Render VDOM', () => { ); render(vdom, document.body); - await expect($(document.body).$('div')).toMatchInlineSnapshot(` - "
- - - -
" - `); + + // Use separate assertions instead of inline snapshot to avoid framework issues + const component = await $('complex-properties'); + await expect(component).toExist(); + await expect(component).toHaveElementClass('hydrated'); + + // Verify each prop value is rendered correctly + const listItems = await component.$$('li'); + await expect(listItems[0]).toHaveText('this.foo.bar: 123'); + await expect(listItems[1]).toHaveText('this.foo.loo: 1, 2, 3'); + await expect(listItems[2]).toHaveText('this.foo.qux: symbol'); + await expect(listItems[3]).toHaveText("this.baz.get('foo'): symbol"); + await expect(listItems[4]).toHaveText("this.quux.has('foo'): true"); + await expect(listItems[5]).toHaveText('this.grault: true'); + await expect(listItems[6]).toHaveText('this.waldo: true'); + await expect(listItems[7]).toHaveText('this.kidsNames: John, Jane, Jim'); }); }); diff --git a/test/wdio/text-content-patch/cmp.test.tsx b/test/wdio/text-content-patch/cmp.test.tsx index c15ba03c122..e3c5b31397a 100644 --- a/test/wdio/text-content-patch/cmp.test.tsx +++ b/test/wdio/text-content-patch/cmp.test.tsx @@ -24,9 +24,7 @@ describe('textContent patch', () => { describe('scoped encapsulation', () => { it('should return the content of all slots', async () => { const elm = $('text-content-patch-scoped-with-slot'); - await expect(elm.getText()).toMatchInlineSnapshot(` - "Slot content -Suffix content"`); + await expect(await elm.getText()).toBe('Slot content\nSuffix content'); }); it('should return an empty string if there is no slotted content', async () => { @@ -43,7 +41,7 @@ Suffix content"`); elm as any as HTMLElement, ); - await expect(elm.getText()).toMatchInlineSnapshot(`"New slot content"`); + await expect(await elm.getText()).toBe('New slot content'); }); it('should not insert the text node if there is no default slot', async () => { From 1a20bb5b77b9258c7828d4c83c75c3a2e520edc1 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Wed, 20 Aug 2025 11:54:32 +0100 Subject: [PATCH 4/4] v4.36.3 (#6372) Co-authored-by: johnjenkins <5030133+johnjenkins@users.noreply.github.com> --- CHANGELOG.md | 10 ++++++++++ package-lock.json | 4 ++-- package.json | 2 +- 3 files changed, 13 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 472d58b6aac..0e2bf19eb06 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,13 @@ +## 🐈 [4.36.3](https://github.com/stenciljs/core/compare/v4.36.2...v4.36.3) (2025-08-20) + + +### Bug Fixes + +* **rollup:** proper `warn` handling ([#6357](https://github.com/stenciljs/core/issues/6357)) ([0831d2c](https://github.com/stenciljs/core/commit/0831d2c35bc16cdc27640353f141ebb2681cb925)) +* **runtime:** fixed parsing of complex attributes that contains JSON strings ([#6359](https://github.com/stenciljs/core/issues/6359)) ([7047196](https://github.com/stenciljs/core/commit/7047196b877f48812783a4d158ac5b3149bcd839)) + + + ## 💚 [4.36.2](https://github.com/stenciljs/core/compare/v4.36.1...v4.36.2) (2025-07-28) diff --git a/package-lock.json b/package-lock.json index 1b435f5ca5f..8893cce58b9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@stencil/core", - "version": "4.36.2", + "version": "4.36.3", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@stencil/core", - "version": "4.36.2", + "version": "4.36.3", "license": "MIT", "bin": { "stencil": "bin/stencil" diff --git a/package.json b/package.json index 290ba984287..0592031ef6a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@stencil/core", - "version": "4.36.2", + "version": "4.36.3", "license": "MIT", "main": "./internal/stencil-core/index.cjs", "module": "./internal/stencil-core/index.js",