[FIX] web_editor, website_form: speed up and robustify form editing

STEPS:
* open website page with a form (e.g. /contactus)
* click edit
* slow down connection speed
* click fast between form input lines or change order of the lines

BEFORE:
* 7 svg files are requested every click
* get_authorized_fields is called every click
* random error "'classList' of undefined" in SelectUserValueWidget::close
* random similar errors when a method is called before initialization

AFTER:
* svg and get_authorized_fields are requested once
* random errors are no reproduced or it's hard to do it
* performance of switching between inputs doesn't depend on connection
speed (though, still not instant)

WHY:
* about changing in SelectUserValueWidget::close: posible reason why
this.menuTogglerEl may be undefined is because method start is async
* the other updates just implement caching

---

opw-2368928

closes odoo/odoo#61598

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

1 files changed, 16 insertions, 5 deletions

diff --git a/addons/website_form/static/src/snippets/s_website_form/options.js b/addons/website_form/static/src/snippets/s_website_form/options.js
index 0c202314ec2..ef542a7004a 100644
--- a/addons/website_form/static/src/snippets/s_website_form/options.js
+++ b/addons/website_form/static/src/snippets/s_website_form/options.js
@@ -714,6 +714,8 @@ options.registry.WebsiteFormEditor = FormEditor.extend({
     },
 });
 
+const authorizedFieldsCache = {};
+
 options.registry.WebsiteFieldEditor = FieldEditor.extend({
     events: _.extend({}, FieldEditor.prototype.events, {
         'click we-button.o_we_select_remove_option': '_onRemoveItemClick',
@@ -736,11 +738,20 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({
     willStart: async function () {
         const _super = this._super.bind(this);
         // Get the authorized existing fields for the form model
-        this.existingFields = await this._rpc({
-            model: "ir.model",
-            method: "get_authorized_fields",
-            args: [this.formEl.dataset.model_name],
-        }).then(fields => {
+        const model = this.formEl.dataset.model_name;
+        let getFields;
+        if (model in authorizedFieldsCache) {
+            getFields = authorizedFieldsCache[model];
+        } else {
+            getFields = this._rpc({
+                model: "ir.model",
+                method: "get_authorized_fields",
+                args: [model],
+            });
+            authorizedFieldsCache[model] = getFields;
+        }
+
+        this.existingFields = await getFields.then(fields => {
             this.fields = _.each(fields, function (field, fieldName) {
                 field.name = fieldName;
                 field.domain = field.domain || [];