Add guard clause to return valid empty form data

javascript/utils.js

@@ -2,58 +2,60 @@
 // https://stackoverflow.com/a/2117523/554903
 
 export const uuidv4 = () => {
-  const crypto = window.crypto || window.msCrypto
+  const crypto = window.crypto || window.msCrypto;
   return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
     (
       c ^
       (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
     ).toString(16)
-  )
-}
+  );
+};
 
 export const serializeForm = (form, options = {}) => {
-  const w = options.w || window
-  const { element } = options
+  if (!form) return "";
+
+  const w = options.w || window;
+  const { element } = options;
 
-  const formData = new w.FormData(form)
-  const data = Array.from(formData, e => e.join('='))
+  const formData = new w.FormData(form);
+  const data = Array.from(formData, e => e.join("="));
 
   if (element && element.name) {
-    data.push(`${element.name}=${element.value}`)
+    data.push(`${element.name}=${element.value}`);
   }
 
-  return Array.from(new Set(data)).join('&')
-}
+  return Array.from(new Set(data)).join("&");
+};
 
 export const camelize = (value, uppercaseFirstLetter = true) => {
-  if (typeof value !== 'string') return ''
+  if (typeof value !== "string") return "";
   value = value
     .replace(/[\s_](.)/g, $1 => $1.toUpperCase())
-    .replace(/[\s_]/g, '')
-    .replace(/^(.)/, $1 => $1.toLowerCase())
+    .replace(/[\s_]/g, "")
+    .replace(/^(.)/, $1 => $1.toLowerCase());
 
   if (uppercaseFirstLetter)
-    value = value.substr(0, 1).toUpperCase() + value.substr(1)
+    value = value.substr(0, 1).toUpperCase() + value.substr(1);
 
-  return value
-}
+  return value;
+};
 
 export const debounce = (callback, delay = 250) => {
-  let timeoutId
+  let timeoutId;
   return (...args) => {
-    clearTimeout(timeoutId)
+    clearTimeout(timeoutId);
     timeoutId = setTimeout(() => {
-      timeoutId = null
-      callback(...args)
-    }, delay)
-  }
-}
+      timeoutId = null;
+      callback(...args);
+    }, delay);
+  };
+};
 
 export const extractReflexName = reflexString => {
-  const match = reflexString.match(/(?:.*->)?(.*?)(?:Reflex)?#/)
+  const match = reflexString.match(/(?:.*->)?(.*?)(?:Reflex)?#/);
 
-  return match ? match[1] : ''
-}
+  return match ? match[1] : "";
+};
 
 export const emitEvent = (event, detail) => {
   document.dispatchEvent(
@@ -62,19 +64,19 @@ export const emitEvent = (event, detail) => {
       cancelable: false,
       detail
     })
-  )
-}
+  );
+};
 
 // construct a valid xPath for an element in the DOM
 const computeXPath = element => {
   if (element.id !== '') return "//*[@id='" + element.id + "']"
   if (element === document.body) return 'body'
 
-  let ix = 0
-  const siblings = element.parentNode.childNodes
+  let ix = 0;
+  const siblings = element.parentNode.childNodes;
 
   for (var i = 0; i < siblings.length; i++) {
-    const sibling = siblings[i]
+    const sibling = siblings[i];
     if (sibling === element) {
       const computedPath = elementToxPath(element.parentNode)
       const tagName = element.tagName.toLowerCase()
@@ -83,10 +85,10 @@ const computeXPath = element => {
     }
 
     if (sibling.nodeType === 1 && sibling.tagName === element.tagName) {
-      ix++
+      ix++;
     }
   }
-}
+};
 
 // if element has an id, pass directly; otherwise, prepend /html/
 export const elementToXPath = element => {
@@ -101,5 +103,5 @@ export const xPathToElement = xpath => {
     null,
     XPathResult.FIRST_ORDERED_NODE_TYPE,
     null
-  ).singleNodeValue
-}
+  ).singleNodeValue;
+};