fix: improve handling of radio inputs and select elements in setValue function

Author: frankpagan

src/getValue.js

@@ -56,7 +56,10 @@ const getValue = (element, valueType) => {
 		case "radio":
 			const key = element.getAttribute("key");
 			// Handles radio inputs by selecting the checked radio's value in the group with the same key
-			value = document.querySelector(`input[key="${key}"]:checked`).value;
+			let el = document.querySelector(`input[key="${key}"]:checked`);
+			if (el) {
+				value = el.value;
+			}
 			break;
 
 		case "number":

src/operators.js

@@ -8,6 +8,8 @@ const customOperators = new Map(
 		$clientId: () => localStorage.getItem("clientId"),
 		$session_id: () => localStorage.getItem("session_id"),
 		$value: (element) => element.getValue() || "",
+		// TODO: get length of value
+		// $length: (element) => {element.getValue() || ""},
 		$innerWidth: () => window.innerWidth,
 		$innerHeight: () => window.innerHeight,
 		$href: () => window.location.href.replace(/\/$/, ""),
@@ -34,7 +36,19 @@ const customOperators = new Map(
 			return path === "/" ? "" : path;
 		},
 		$param: (element, args) => args,
-		$setValue: (element, args) => element.setValue(...args) || ""
+		$setValue: (element, args) => element.setValue(...args) || "",
+		$true: () => true,
+		$false: () => false,
+		// TODO: Handle uuid generation
+		// $uid: () => uid.generate(6),
+		$parse: (element, args) => {
+			let value = args || "";
+			try {
+				return JSON.parse(value);
+			} catch (e) {
+				return value;
+			}
+		}
 	})
 );
 
@@ -49,7 +63,8 @@ const propertyOperators = new Set([
 	"$className",
 	"$textContent",
 	"$innerHTML",
-	"$getValue"
+	"$getValue",
+	"$reset"
 ]);
 
 // Combine all known operator keys for the main parsing regex

src/setValue.js

@@ -52,7 +52,7 @@ const setValue = (el, value, dispatch) => {
 	if (
 		el.tagName == "INPUT" ||
 		el.tagName == "TEXTAREA" ||
-		(el.tagName == "SELECT" && el.options.length)
+		el.tagName == "SELECT"
 	) {
 		// TODO: attribute config undefined when used with onload-value
 		let isCrdt = el.getAttribute("crdt");
@@ -71,9 +71,11 @@ const setValue = (el, value, dispatch) => {
 				if (inputs[i].value) {
 					if (value === true || value === false)
 						inputs[i].checked = value;
-					else if (value.includes(inputValue))
+					else if (value.includes(inputValue) || value === "on") {
 						inputs[i].checked = true;
-					else inputs[i].checked = false;
+					} else {
+						inputs[i].checked = false;
+					}
 				} else {
 					if (
 						value === "true" ||
@@ -88,11 +90,7 @@ const setValue = (el, value, dispatch) => {
 			el.value == value ? (el.checked = true) : (el.checked = false);
 		} else if (el.type === "password") {
 			el.value = __decryptPassword(value);
-		} else if (
-			el.tagName == "SELECT" &&
-			el.hasAttribute("multiple") &&
-			Array.isArray(value)
-		) {
+		} else if (el.tagName == "SELECT") {
 			let options = el.options;
 			for (let i = 0; i < options.length; i++) {
 				if (value.includes && value.includes(options[i].value)) {