diff --git a/src/LiveComponent/CHANGELOG.md b/src/LiveComponent/CHANGELOG.md index a43e9518ee..7ba0351676 100644 --- a/src/LiveComponent/CHANGELOG.md +++ b/src/LiveComponent/CHANGELOG.md @@ -3,6 +3,7 @@ ## 2.23.0 - Allow configuring the secret used to compute fingerprints and checksums. +- Prevent `__component` property to be serialized when called `JSON.stringify()` ## 2.22.0 diff --git a/src/LiveComponent/assets/dist/live_controller.js b/src/LiveComponent/assets/dist/live_controller.js index 375a5b15bd..41177512fd 100644 --- a/src/LiveComponent/assets/dist/live_controller.js +++ b/src/LiveComponent/assets/dist/live_controller.js @@ -3059,7 +3059,10 @@ class LiveControllerDefault extends Controller { const id = this.element.id || null; this.component = new Component(this.element, this.nameValue, this.propsValue, this.listenersValue, id, LiveControllerDefault.backendFactory(this), new StimulusElementDriver(this)); this.proxiedComponent = proxifyComponent(this.component); - this.element.__component = this.proxiedComponent; + Object.defineProperty(this.element, '__component', { + value: this.proxiedComponent, + writable: true, + }); if (this.hasDebounceValue) { this.component.defaultDebounce = this.debounceValue; } diff --git a/src/LiveComponent/assets/src/live_controller.ts b/src/LiveComponent/assets/src/live_controller.ts index 278915e0b0..a9ea7f115e 100644 --- a/src/LiveComponent/assets/src/live_controller.ts +++ b/src/LiveComponent/assets/src/live_controller.ts @@ -285,8 +285,10 @@ export default class LiveControllerDefault extends Controller imple ); this.proxiedComponent = proxifyComponent(this.component); - // @ts-ignore Adding the dynamic property - this.element.__component = this.proxiedComponent; + Object.defineProperty(this.element, '__component', { + value: this.proxiedComponent, + writable: true, + }); if (this.hasDebounceValue) { this.component.defaultDebounce = this.debounceValue;