@expressen/tallahassee - npm Package Compare versions

Comparing version 13.1.1 to 13.2.0

CHANGELOG.md

@@ -6,2 +6,8 @@ Changelog
 
+## 13.2.0
+
+- implement HTMLInputElement willValidate property
+- implement checkbox validation
+- as well as radio input, where only one input may be required
+
 ## 13.1.1
@@ -8,0 +14,0 @@

lib/HTMLFormElement.js

@@ -30,3 +30,3 @@ "use strict";
 
-        if ($namedElement.eq(0).attr("type") === "radio") return new RadioNodeList(element, `[name="${prop}"]`);
+        if ($namedElement.eq(0).attr("type") === "radio") return new RadioNodeList(element, prop);
         return document._getElement($namedElement);
@@ -33,0 +33,0 @@ }

lib/HTMLInputElement.js

@@ -21,15 +21,24 @@ "use strict";
   set checked(value) {
-    const type = this.getAttribute("type");
-    if (type === "checkbox") this.$elm.prop("checked", value);
-    if (type !== "radio") return;
-
-    const name = this.getAttribute("name");
-    const $form = this.$elm.closest("form");
-    if ($form && $form.length) {
-      $form.find(`input[type="radio"][name="${name}"]`).removeAttr("checked");
-    } else {
-      this.ownerDocument.$(`input[type="radio"][name="${name}"]`).removeAttr("checked");
+    const checked = this.$elm.prop("checked");
+    switch (this.type) {
+      case "checkbox":
+        break;
+      case "radio": {
+        const name = this.name;
+        const $form = this.$elm.closest("form");
+        if ($form && $form.length) {
+          $form.find(`input[type="radio"][name="${name}"]`).prop("checked", false);
+        } else {
+          this.ownerDocument.$(`input[type="radio"][name="${name}"]`).prop("checked", false);
+        }
+        break;
+      }
+      default:
+        return value;
     }
 
-    this.setAttribute("checked", value);
+    this.$elm.prop("checked", !!value);
+    if (checked === !!value) this.dispatchEvent(new InputEvent("input"));
+
+    return value;
   }
@@ -73,7 +82,17 @@ get disabled() {
       this.setAttribute("value", val);
-
-      const event = ["text", "email", "tel", "number"].includes(this.type) ?
-        new InputEvent("input") :
-        new Event("input");
-      this.dispatchEvent(event);
+      switch (this.type) {
+        case "checkbox":
+        case "radio":
+          break;
+        case "text":
+        case "email":
+        case "tel":
+        case "number":
+        case "url":
+          this.dispatchEvent(new InputEvent("input"));
+          break;
+        default:
+          this.dispatchEvent(new Event("input"));
+          break;
+      }
     }
@@ -83,2 +102,7 @@
   }
+  get willValidate() {
+    if (this.readOnly) return false;
+    if (this.disabled) return false;
+    return this.type !== "hidden";
+  }
   click() {
@@ -85,0 +109,0 @@ if (this.disabled) return;

lib/NodeList.js

@@ -94,2 +94,5 @@ "use strict";
   }
+  [Symbol.iterator]() {
+    return this[kLiveList][Symbol.iterator]();
+  }
 };

lib/RadioNodeList.js

@@ -6,12 +6,14 @@ "use strict";
 module.exports = class RadioNodeList extends NodeList {
-  constructor(parentElement, selector) {
+  constructor(parentElement, name) {
+    const selector = `input[type=radio][name="${name}"]`;
     super(parentElement, selector, { attributes: true });
+  }
+  get value() {
+    for (const option of Array.from(this)) {
+      if (option.disabled || !option.checked) continue;
+      return option.value;
+    }
 
-    Object.defineProperty(this, "value", {
-      enumerable: true,
-      get() {
-        return parentElement.$elm.find("input:checked").attr("value");
-      }
-    });
+    return "";
   }
 };

lib/ValidityState.js

@@ -10,3 +10,2 @@ "use strict";
     this.type = element.type || "text";
-    this.value = element.value;
     this.attributes = element.$elm[0]?.attribs || {};
@@ -39,7 +38,25 @@ }
   get required() {
-    return this.element.required;
+    const element = this.element;
+    if (this.type === "radio") {
+      if (!element.name) return element.required;
+
+      const nodeList = element.form[element.name];
+      for (const el of nodeList) {
+        if (el.required) return true;
+      }
+      return false;
+    }
+
+    return element.required;
   }
+  get value() {
+    const element = this.element;
+    if (this.type === "radio") {
+      if (!element.name) return element.value;
+      return element.form[element.name].value;
+    }
+    return element.value;
+  }
   ineligble() {
-    if (this.element.disabled) return true;
-    if (this.element.type === "hidden") return true;
+    if (!this.element.willValidate) return true;
     return this.value === "";
@@ -51,4 +68,3 @@ }
   validate() {
-    if (this.element.disabled) return false;
-    if (this.element.type === "hidden") return false;
+    if (!this.element.willValidate) return false;
     return !!this.element.validationMessage?.length;
@@ -60,5 +76,5 @@ }
   validate() {
+    if (this.ineligble()) return false;
     const pattern = this.pattern;
     if (!pattern) return false;
-    if (this.ineligble()) return false;
     return !pattern.test(this.value);
@@ -92,2 +108,9 @@ }
         return !emailPattern.test(this.value);
+      case "url": {
+        try {
+          return !new URL(this.value);
+        } catch {
+          return true;
+        }
+      }
     }
@@ -100,5 +123,10 @@ return false;
   validate() {
-    if (this.element.disabled) return false;
-    if (this.element.type === "hidden") return false;
-    return this.required && this.value === "";
+    if (!this.element.willValidate) return false;
+    if (!this.required) return false;
+    switch (this.type) {
+      case "checkbox":
+        return !this.element.checked;
+      default:
+        return this.value === "";
+    }
   }
@@ -203,2 +231,3 @@ }
   get valid() {
+    if (!this[kParent].willValidate) return true;
     return ![
@@ -205,0 +234,0 @@ "valueMissing",

package.json

 {
   "name": "@expressen/tallahassee",
-  "version": "13.1.1",
+  "version": "13.2.0",
   "description": "Lightweight client testing framework",
@@ -5,0 +5,0 @@ "main": "index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

125248

increased by1.11%

Lines of code

3564

increased by1.63%

No dependency changes