@brightspot/ui 6.3.2 → 6.3.3-pr.315.1

package/src/legacy/tool-ui/src/Toggleable/index.ts

@@ -37,6 +37,16 @@ export default class Toggleable extends EventEmitterMixin(
     this._handleChange()
   }
 
+  /*
+    Re-applies the current selection's show/hide + enable/disable state.
+    Called by an ancestor Toggleable after its enable pass, which would
+    otherwise leave this toggleable's toggled-off branch inputs enabled
+    and submitting stale values (BSP-19758).
+  */
+  refresh() {
+    this._handleChange()
+  }
+
   constructor() {
     super()
     this._forms = []
@@ -177,8 +187,8 @@ export default class Toggleable extends EventEmitterMixin(
                 body: data,
               })
 
-              form.element.innerHTML = await response.text()
               if (response.ok) {
+                form.element.innerHTML = await response.text()
                 delete form.element.dataset.formFieldsUrl
                 delete form.element.dataset.formFieldsData
 
@@ -187,6 +197,11 @@ export default class Toggleable extends EventEmitterMixin(
                 )
                 form.element.dispatchEvent(new Event('load'))
                 form.element.dispatchEvent(new UIEvent('resize'))
+
+                // The selection may have changed while the request was in
+                // flight; re-apply it so content that arrived for a branch
+                // that is no longer selected doesn't come back enabled.
+                this._handleChange()
               } else {
                 form.element.dispatchEvent(
                   new CustomEvent('error', {
@@ -229,6 +244,27 @@ export default class Toggleable extends EventEmitterMixin(
       inputs.forEach((input) => {
         input.toggleAttribute('disabled', disable)
       })
+
+      if (!disable) {
+        // The enable pass above walks the whole subtree, so it also enabled
+        // inputs in nested toggleables' toggled-off branches (BSP-19758:
+        // duplicate typeId params flip a polymorphic record to the wrong
+        // type on save). Re-apply each nested toggleable's own state, after
+        // the enable pass, to disable those branches again. Document order
+        // guarantees an outer nested toggleable is refreshed before any
+        // toggleable inside its branches.
+        divsToToggle.forEach((el) => {
+          el.querySelectorAll<Toggleable>('btu-toggleable').forEach(
+            (nested) => {
+              // A not-yet-upgraded element applies its own state when it
+              // connects, so it can safely be skipped here.
+              if (nested !== this && nested instanceof Toggleable) {
+                nested.refresh()
+              }
+            },
+          )
+        })
+      }
     }
   }