refactor auto submit button js utility

static/css/utils/form.scss

@@ -17,7 +17,7 @@ fieldset {
   }
 }
 
-[data-autosubmit][type="submit"] {
+[uw-auto-submit-button][type="submit"] {
   animation: fade-in 500ms ease-in-out backwards;
   animation-delay: 500ms;
 }

static/js/utils/form.js

@@ -265,19 +265,46 @@
     setup: interactiveFieldsetUtil,
   });
 
+  /**
+   *
+   * Auto Submit Button Utility
+   *  Hides submit buttons in forms that are submitted programmatically
+   *  We hide the button using JavaScript so no-js users will still be able to submit the form
+   *
+   * Attribute: uw-auto-submit-button
+   *
+   * Example usage:
+   *  <button type="submit" uw-auto-submit-button>Submit
+   */
 
-  window.utils.autoSubmit = function(form, options) {
+  var AUTO_SUBMIT_BUTTON_UTIL_NAME = 'autoSubmitButton';
-    var button = form.querySelector(AUTOSUBMIT_BUTTON_SELECTOR);
+  var AUTO_SUBMIT_BUTTON_UTIL_SELECTOR = '[uw-auto-submit-button]';
-    if (button) {
+
-      button.classList.add('hidden');
+  var AUTO_SUBMIT_BUTTON_INITIALIZED_CLASS = 'auto-submit-button--initialized';
+  var AUTO_SUBMIT_BUTTON_HIDDEN_CLASS = 'hidden';
+
+  var autoSubmitButtonUtil = function(element) {
+    if (!element) {
+      throw new Error('Auto Submit Button utility needs to be passed an element!');
     }
 
+    // hide and mark initialized
+    element.classList.add(AUTO_SUBMIT_BUTTON_HIDDEN_CLASS, AUTO_SUBMIT_BUTTON_INITIALIZED_CLASS);
+
     return {
-      scope: form,
+      name: AUTO_SUBMIT_BUTTON_UTIL_NAME,
+      element: element,
       destroy: function() {},
     };
   };
 
+  formUtilities.push({
+    name: AUTO_SUBMIT_BUTTON_UTIL_NAME,
+    selector: AUTO_SUBMIT_BUTTON_UTIL_SELECTOR,
+    setup: autoSubmitButtonUtil,
+  });
+
+
   // listens for focus events and removes any errors on an input
   window.utils.errorRemover = function(formGroup, options) {
 

templates/widgets/form/form.hamlet

@@ -15,5 +15,5 @@ $# Wrapper for all kinds of forms
         ^{submitButtonView}
       $of FormAutoSubmit
         ^{formWidget}
-        <button type=submit data-autosubmit>
+        <button type=submit uw-auto-submit-button>
           ^{btnLabel BtnSubmit}