fix: fix getting value from radio input fp-126

src/libs/enums/control-element-type.enum.js

@@ -5,11 +5,12 @@ const ControlElementType = /** @type {const} */ ({
 	URL: 'url',
 	TEL: 'tel',
 	COLOR: 'color',
-	RADIO: 'radio',
 	HIDDEN: 'hidden',
 
 	EMAIL: 'email',
 
+	RADIO: 'radio',
+
 	NUMBER: 'number',
 	RANGE: 'range',
 

src/libs/helpers/check-is-one-of/check-is-one-of.helper.js

@@ -0,0 +1,11 @@
+/**
+ * @template {unknown} T
+ * @param {unknown} value
+ * @param {...T} validValues
+ * @returns {value is validValues[number]}
+ */
+const checkIsOnOf = (value, ...validValues) => {
+	return validValues.includes(/** @type {T} */ (value));
+};
+
+export { checkIsOnOf };

src/libs/helpers/helpers.js

@@ -0,0 +1 @@
+export { checkIsOnOf } from './check-is-one-of/check-is-one-of.helper.js';

src/packages/get-form-control-payload/get-form-control-payload.js

@@ -10,6 +10,7 @@ import {
 	getFileControlElementValue,
 	getMultiselectControlElementValue,
 	getNumericControlElementValue,
+	getRadioControlElementValue,
 } from './helpers/helpers.js';
 
 /** @typedef {import('../../libs/types/types.js').HTMLFormOperationalControlElement} HTMLFormOperationalControlElement */
@@ -36,7 +37,6 @@ const getFormControlPayload = (controlElement) => {
 		case ControlElementType.URL:
 		case ControlElementType.TEL:
 		case ControlElementType.COLOR:
-		case ControlElementType.RADIO:
 		case ControlElementType.HIDDEN:
 		case ControlElementType.TEXTAREA:
 		case ControlElementType.SELECT_ONE:
@@ -59,6 +59,13 @@ const getFormControlPayload = (controlElement) => {
 				)
 			);
 		}
+		case ControlElementType.RADIO: {
+			return /** @type {T} */ (
+				getRadioControlElementValue(
+					/** @type {HTMLInputElement} */ (controlElement),
+				)
+			);
+		}
 		case ControlElementType.NUMBER:
 		case ControlElementType.RANGE: {
 			return /** @type {T} */ (

src/packages/get-form-control-payload/helpers/get-control-element-value/get-control-element-value.helper.js

@@ -2,7 +2,8 @@
  * @param {HTMLInputElement
  * 	| HTMLOutputElement
  * 	| HTMLTextAreaElement
- * 	| HTMLSelectElement} element
+ * 	| HTMLSelectElement
+ * 	| RadioNodeList} element
  * @returns {string}
  */
 const getControlElementValue = (element) => {

src/packages/get-form-control-payload/helpers/get-email-control-element-value/get-email-control-element-value.helper.js

@@ -1,6 +1,6 @@
 import { getControlElementValue } from '../get-control-element-value/get-control-element-value.helper.js';
 
-const EMAIL_SEPARATOR = ',';
+const EMAIL_SEPARATOR = /** @type {const} */ (',');
 
 /**
  * @param {HTMLInputElement} element

src/packages/get-form-control-payload/helpers/get-fieldset-control-element-value/get-fieldset-control-element-value.helper.js

@@ -2,7 +2,6 @@ import { VALUE_AS_ARRAY_IDENTIFIER } from '../../../../libs/constants/constants.
 import { getFormControlElementsPayload } from '../get-form-control-elements-payload/get-form-control-elements-payload.js';
 
 /** @typedef {import('../../../../libs/types/types.js').HTMLFormOperationalControlElement} HTMLFormOperationalControlElement */
-/** @typedef {import('../../../../libs/types/types.js').HTMLFormControlElement} HTMLFormControlElement */
 
 /**
  * @template {Record<string, unknown>} T
@@ -16,10 +15,9 @@ const getFieldsetControlElementValue = (
 	getFormControlElementPayloadCallback,
 	element,
 ) => {
-	const elements = [.../** @type {HTMLFieldSetElement} */ (element).elements];
 	const fieldsetValue = getFormControlElementsPayload(
 		getFormControlElementPayloadCallback,
-		.../** @type {HTMLFormControlElement[]} */ (elements),
+		element.elements,
 	);
 
 	const hasArrayValue = element.name.endsWith(VALUE_AS_ARRAY_IDENTIFIER);

src/packages/get-form-control-payload/helpers/get-form-control-elements-payload/get-form-control-elements-payload.js

@@ -1,5 +1,8 @@
+import { ControlElementType } from '../../../../libs/enums/enums.js';
+import { checkIsOnOf } from '../../../../libs/helpers/helpers.js';
 import { checkHasValueAsArray } from '../check-has-value-as-array/check-has-value-as-array.helper.js';
 import { checkIsReferToAnotherElement } from '../check-is-refer-to-another-element/check-is-refer-to-another-element.helper.js';
+import { getControlElementValue } from '../get-control-element-value/get-control-element-value.helper.js';
 import { getOperationalControlElements } from '../get-operational-control-elements/get-operational-control-elements.helper.js';
 import { normalizeValueAsArrayControlElementName } from '../normalize-value-as-array-control-element-name/normalize-value-as-array-control-element-name.helper.js';
 
@@ -11,13 +14,17 @@ import { normalizeValueAsArrayControlElementName } from '../normalize-value-as-a
  * @param {<T extends unknown>(
  * 	element: HTMLFormOperationalControlElement,
  * ) => T} getFormControlElementPayloadCallback
- * @param {...HTMLFormControlElement} controlElements
+ * @param {HTMLFormControlsCollection} elements
  * @returns {T}
  */
 const getFormControlElementsPayload = (
 	getFormControlElementPayloadCallback,
-	...controlElements
+	elements,
 ) => {
+	const controlElements = /** @type {HTMLFormControlElement[]} */ ([
+		...elements,
+	]);
+
 	const operationalControlElements =
 		getOperationalControlElements(controlElements);
 
@@ -33,6 +40,34 @@ const getFormControlElementsPayload = (
 			continue;
 		}
 
+		const isRadioNodeList = checkIsOnOf(
+			operationalControlElement.type,
+			ControlElementType.RADIO,
+		);
+
+		if (isRadioNodeList) {
+			const hasValue = Boolean(
+				elementsValues[operationalControlElement.name],
+			);
+
+			if (!hasValue) {
+				const key = /** @type {keyof T} */ (
+					operationalControlElement.name
+				);
+				const value = /** @type {T[keyof T]} */ (
+					getControlElementValue(
+						/** @type {RadioNodeList} */ (
+							elements.namedItem(operationalControlElement.name)
+						),
+					)
+				);
+
+				elementsValues[key] = value;
+			}
+
+			continue;
+		}
+
 		const hasValueAsArray = checkHasValueAsArray(operationalControlElement);
 
 		if (hasValueAsArray) {

src/packages/get-form-control-payload/helpers/get-operational-control-elements/get-operational-control-elements.helper.js

@@ -7,11 +7,11 @@ import {
 /** @typedef {import('../../../../libs/types/types.js').HTMLFormControlElement} HTMLFormControlElement */
 /** @typedef {import('../../../../libs/types/types.js').HTMLFormOperationalControlElement} HTMLFormOperationalControlElement */
 
-const OPERATIONAL_CONTROL_ELEMENT_CHECKERS = [
+const OPERATIONAL_CONTROL_ELEMENT_CHECKERS = /** @type {const} */ ([
 	checkHasControlElementName,
 	checkIsAllowedControlElement,
 	checkIsAllowedControlElementType,
-];
+]);
 
 /**
  * @param {HTMLFormControlElement[]} elements

src/packages/get-form-control-payload/helpers/get-radio-control-element-value/get-radio-control-element-value.helper.js

@@ -0,0 +1,13 @@
+const UNCHECKED_RADIO_CONTROL_ELEMENT_VALUE = /** @type {const} */ ('');
+
+/**
+ * @param {HTMLInputElement} element
+ * @returns {string}
+ */
+const getRadioControlElementValue = (element) => {
+	return element.checked
+		? element.value
+		: UNCHECKED_RADIO_CONTROL_ELEMENT_VALUE;
+};
+
+export { getRadioControlElementValue };

src/packages/get-form-payload/get-form-payload.js

@@ -3,19 +3,16 @@ import {
 	getFormControlPayload,
 } from '../get-form-control-payload/get-form-control-payload.js';
 
-/** @typedef {import('../../libs/types/types.js').HTMLFormControlElement} HTMLFormControlElement */
-
 /**
  * @template {Record<string, unknown>} T
  * @param {HTMLFormElement} formElement
  * @returns {T}
  */
 const getFormPayload = (formElement) => {
-	const elements = /** @type {HTMLFormControlElement[]} */ ([
-		...formElement.elements,
-	]);
-
-	return getFormControlElementsPayload(getFormControlPayload, ...elements);
+	return getFormControlElementsPayload(
+		getFormControlPayload,
+		formElement.elements,
+	);
 };
 
 export { getFormPayload };