[LiveComponent] Prevent __component property to be serialized when called JSON.stringify()

Author: Kocal

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
 

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;
         }

src/LiveComponent/assets/src/live_controller.ts

@@ -285,8 +285,10 @@ export default class LiveControllerDefault extends Controller<HTMLElement> 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;