switch to a deactivate method

mozilla · Dec 14, 2023 · fb76ca0 · fb76ca0
1 parent 6c2174f
commit fb76ca0
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 5 deletions.
diff --git a/kitsune/sumo/static/sumo/js/form-wizard-sign-in-step.js b/kitsune/sumo/static/sumo/js/form-wizard-sign-in-step.js
@@ -69,7 +69,7 @@ export class SignInStep extends BaseFormStep {
     this.#formEl.addEventListener("submit", this);
     this.#emailEl.addEventListener("blur", this);
     this.#emailEl.addEventListener("input", this);
-    this.activate();
+    this.#emailEl.focus();
   }
 
   disconnectedCallback() {
@@ -79,9 +79,11 @@ export class SignInStep extends BaseFormStep {
     this.#emailEl.removeEventListener("input", this);
   }
 
-  activate() {
-    this.#emailErrorEl.classList.remove("visible");
-    this.#emailEl.focus();
+  deactivate() {
+    if (this.shadowRoot.activeElement == this.#emailEl) {
+      this.#emailEl.blur();
+      this.#emailErrorEl.classList.remove("visible");
+    }
   }
 
   handleEvent(event) {

diff --git a/kitsune/sumo/static/sumo/js/form-wizard.js b/kitsune/sumo/static/sumo/js/form-wizard.js
@@ -302,9 +302,9 @@ export class FormWizard extends HTMLElement {
       let name = step.getAttribute("name");
       if (name === activeStep) {
         step.slot = "active";
-        step.activate && step.activate();
       } else {
         step.slot = "";
+        step.deactivate && step.deactivate();
       }
     }
   }
@@ -425,6 +425,14 @@ export class BaseFormStep extends HTMLElement {
     this.render(prevState, this.#state);
   }
 
+  /**
+   * Method that can be implemented to handle any clean up needed when a form
+   * step is no longer active e.g. clearing error states.
+   */
+  deactivate() {
+    // NOOP
+  }
+
   /**
    * Method that gets run whenever the element's state changes. Can be used to
    * specify how the DOM should update in response to state changes. `prevState`