feat: changing focus when a new elements is created for better accessibility

js/accessibleUI/modules/operations/operations.js

@@ -96,6 +96,9 @@ export function insertVariableAfterOperationKind (kindSelect, operation) {
     document.getElementById(`operation${operation.hash}Operator${operator.hash}VariableSelect`).addEventListener('change', ev => {
         updateOperationOperator(ev.target.getAttribute('operation-id'), ev.target.getAttribute('operator-id'), ev.target.value)
     });
+
+    // Changing focus to the variable select after select for screen readers
+    document.getElementById(`operation${operation.hash}Operator${operator.hash}VariableSelect`).focus();
 }
 
 // Insert value after operator kind select
@@ -117,6 +120,9 @@ export function insertValueAfterOperationKind (kindSelect, operation) {
     document.getElementById(`operation${operation.hash}Operator${operator.hash}ValueInput`).addEventListener('change', ev => {
         updateOperationOperator(ev.target.getAttribute('operation-id'), ev.target.getAttribute('operator-id'), ev.target.value)
     });
+
+    // Changing focus to the input value after select for screen readers
+    document.getElementById(`operation${operation.hash}Operator${operator.hash}ValueInput`).focus();
 }
 
 // Add final operation typt end of the operation

js/accessibleUI/modules/variables/variables.js

@@ -50,6 +50,9 @@ export function createVariable () {
 
         deleteVariable(variableHash);
     });
+
+    // Changing focus to the variable type after creation for screen readers
+    document.getElementById(`variable${variable.hash}Type`).focus();
 }
 
 // *********************************************************************************