add aria-label to buttons and text fields with no label #2710

interface/src/components/inputs/LanguageSelector.tsx

@@ -44,7 +44,7 @@ const LANGUAGE_OPTIONS: LanguageOption[] = [
 ];
 
 const LanguageSelector = () => {
-  const { setLocale, locale } = useContext(I18nContext);
+  const { setLocale, locale, LL } = useContext(I18nContext);
 
   const onLocaleSelected: ChangeEventHandler<HTMLInputElement> = useCallback(
     async ({ target }) => {
@@ -72,6 +72,7 @@ const LanguageSelector = () => {
     <TextField
       name="locale"
       variant="outlined"
+      aria-label={LL.LANGUAGE()}
       value={locale}
       onChange={onLocaleSelected}
       size="small"

interface/src/components/inputs/ValidatedPasswordField.tsx

@@ -25,7 +25,11 @@ const ValidatedPasswordField: FC<ValidatedPasswordFieldProps> = ({ ...props }) =
         input: {
           endAdornment: (
             <InputAdornment position="end">
-              <IconButton onClick={togglePasswordVisibility} edge="end">
+              <IconButton
+                onClick={togglePasswordVisibility}
+                edge="end"
+                aria-label="Password visibility"
+              >
                 {showPassword ? <VisibilityIcon /> : <VisibilityOffIcon />}
               </IconButton>
             </InputAdornment>

interface/src/components/inputs/ValidatedTextField.tsx

@@ -21,7 +21,7 @@ const ValidatedTextField: FC<ValidatedTextFieldProps> = ({
 
   return (
     <>
-      <TextField error={!!errors} {...rest} />
+      <TextField error={!!errors} {...rest} aria-label="Error" />
       {errors?.map((e) => (
         <FormHelperText key={e.message}>{e.message}</FormHelperText>
       ))}