Rewrites Components For Accessibility

Makes major changes to the structuring of checkboxes, and ranges to be
more accessible to all users.

Signed-off-by: Hassan Abouelela <[email protected]>

1 files changed, 4 insertions, 7 deletions

diff --git a/src/components/Question.tsx b/src/components/Question.tsx
index 54074f3..e1472e4 100644
--- a/src/components/Question.tsx
+++ b/src/components/Question.tsx
@@ -46,12 +46,13 @@ class RenderedQuestion extends React.Component<QuestionProp> {
         let value: string | boolean;
 
         switch (event.target.type) {
-        case QuestionType.Checkbox:
-            target = this.props.question.id;
+        case "checkbox":
+            target = event.target.name;
             value = event.target.checked;
             break;
 
-        case QuestionType.Radio:
+        case "radio":
+            // This handles radios and ranges, as they are both based on the same fundamental input type
             target = "value";
             if (event.target.parentElement) {
                 value = event.target.parentElement.innerText.trimEnd();
@@ -60,10 +61,6 @@ class RenderedQuestion extends React.Component<QuestionProp> {
             }
             break;
 
-        case QuestionType.Select:
-            // Handled by component
-            return;
-
         default:
             target = "value";
             value = event.target.value;