bug: nextjs 15 throws error message but renders correclty

[danielleroux]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Stencil Version

4.22.3

Stencil Framework Output Target

React

Stencil Framework Output Target Version

latest (main clone)

Current Behavior

Nextjs throws the following error message:

 ✓ Ready in 2.4s
 ○ Compiling / ...
 ✓ Compiled / in 2.1s (673 modules)
[react-output-target] Failed to serialize light DOM for <my-radio-group name="myRadioGroup" value="two" suppressHydrationWarning="true" />: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, props, _owner, _store}). If you meant to render a collection of children, use an array instead. - this may impact the hydration of the component
 ⨯ [Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead.] {
  digest: '2182580047'
}
 ⨯ [Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead.] {
  digest: '2943176308'
}
 ⨯ [Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead.] {
  digest: '2943176308'
}
[react-output-target] Failed to serialize light DOM for <my-button href="#" suppressHydrationWarning="true" />: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, props, _owner, _store}). If you meant to render a collection of children, use an array instead. - this may impact the hydration of the component
 GET / 500 in 2837ms
 ✓ Compiled in 244ms (324 modules)

But the components are rendered correctly during serve dev.

Expected Behavior

Should work with latest nextjs version.

Steps to Reproduce

1. Clone https://github.com/ionic-team/stencil-ds-output-targets
2. pnpm install
3. pnpm build
4. Navigate to example-projects/nextjs-app
5. Install latest nextjs "next": "15.1.0",
6. pnpm start

Code Reproduction URL

https://github.com/ionic-team/stencil-ds-output-targets

Additional Information

No response

[ionitron-bot]

Thanks for the issue!

This project is currently maintained for the purposes of supporting Ionic Framework. At this time, only new issues & pull requests that support Ionic Framework will be prioritized. For the latest updates regarding the maintenance status of this project, please see this section of the project's README

[NSpehler]

@danielleroux This is the same issue as described here: ionic-team/stencil#6059

Apparently a fix should be under way and released today 🤞

[danielleroux]

Absolutely correct, my fault I close this one here.