Fixed snippet to update a field via custom JS

Author: fullstackdeveloperwebapp

src/LiveComponent/assets/test/diff-dom.test.ts

@@ -0,0 +1,33 @@
+import {
+    htmlToElement,
+} from '../src/dom_utils';
+import { DiffDOM } from "diff-dom"
+
+describe('diff-dom', () => {
+    it('Just playing', () => {
+
+
+        const dd = new DiffDOM();
+
+        const from = htmlToElement(`
+        <div>
+            Text at the top
+            <div class="child-element">Child1 text</div>
+            <div>between</div>
+            <div class="child-element">Child2 text<span class="foo">icon</span></div>
+        </div>
+        `)
+
+        const to = htmlToElement(`
+        <div>
+            Text at the top
+            <div class="child-element">Child1 text</div>
+            <div>between</div>
+            <div class="child-element">Child2 text</div>
+        </div>
+        `)
+
+        const diff = dd.diff(from, to)
+        console.log(diff);
+    });
+});

src/LiveComponent/src/Resources/doc/index.rst

@@ -439,7 +439,7 @@ of the change:
     const rootElement = document.getElementById('favorite-food');
     input.value = 'sushi';
 
-    element.dispatchEvent(new Event('change', { bubbles: true }));
+    input.dispatchEvent(new Event('change', { bubbles: true }));
 
 JavaScript Component Hooks
 ~~~~~~~~~~~~~~~~~~~~~~~~~~