[LiveComponent] Fix form elements unsynced on load

Let's try to fix #1958

Author: smnandre

src/LiveComponent/assets/dist/live_controller.js

@@ -2671,7 +2671,11 @@ class SetValueOntoModelFieldsPlugin {
         });
     }
     synchronizeValueOfModelFields(component) {
-        component.element.querySelectorAll('[data-model]').forEach((element) => {
+        const modelFields = [
+            ...Array.from(component.element.querySelectorAll('[data-model]')),
+            ...Array.from(component.element.querySelectorAll('form,input,select,textarea')),
+        ];
+        modelFields.forEach((element) => {
             if (!(element instanceof HTMLElement)) {
                 throw new Error('Invalid element using data-model.');
             }

src/LiveComponent/assets/src/Component/plugins/SetValueOntoModelFieldsPlugin.ts

@@ -30,7 +30,12 @@ export default class implements PluginInterface {
      * the "firstName" model.
      */
     private synchronizeValueOfModelFields(component: Component): void {
-        component.element.querySelectorAll('[data-model]').forEach((element: Element) => {
+        const modelFields = [
+            ...Array.from(component.element.querySelectorAll('[data-model]')),
+            ...Array.from(component.element.querySelectorAll('form,input,select,textarea')),
+        ];
+
+        modelFields.forEach((element: Element) => {
             if (!(element instanceof HTMLElement)) {
                 throw new Error('Invalid element using data-model.');
             }