From 0eb2d5ce587ece5d3573cad7534bcbb8df5c6ed4 Mon Sep 17 00:00:00 2001
From: andreaNeki <root@TI-03.OHB.LOCAL>
Date: Tue, 27 Aug 2024 17:02:12 -0300
Subject: [PATCH] Improving accessibility on the new user registration page

---
 .../register-email-form.component.html                   | 9 ++++++---
 src/assets/i18n/en.json5                                 | 2 ++
 src/assets/i18n/es.json5                                 | 3 +++
 src/assets/i18n/pt-BR.json5                              | 3 +++
 4 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/src/app/register-email-form/register-email-form.component.html b/src/app/register-email-form/register-email-form.component.html
index a38c4a81c0..740018392c 100644
--- a/src/app/register-email-form/register-email-form.component.html
+++ b/src/app/register-email-form/register-email-form.component.html
@@ -14,13 +14,16 @@
                     <label class="font-weight-bold"
                            for="email">{{MESSAGE_PREFIX + '.email' | translate}}</label>
                     <input [className]="(email.invalid) && (email.dirty || email.touched) ? 'form-control is-invalid' :'form-control'"
-                           type="text" id="email" formControlName="email"/>
+                           type="text" id="email" formControlName="email"
+                           [attr.aria-label]="'register-email.aria.label'|translate"
+                           aria-describedby="email-errors-required email-error-not-valid"
+                           [attr.aria-invalid]="form.get('email')?.invalid"/>
                     <div *ngIf="email.invalid && (email.dirty || email.touched)"
                          class="invalid-feedback show-feedback">
-                    <span *ngIf="email.errors && email.errors.required">
+                    <span *ngIf="email.errors && email.errors.required" id="email-errors-required">
                         {{ MESSAGE_PREFIX + '.email.error.required' | translate }}
                     </span>
-                    <span *ngIf="email.errors && ((email.errors.pattern && this.typeRequest === TYPE_REQUEST_REGISTER) || email.errors.email)">
+                    <span *ngIf="email.errors && ((email.errors.pattern && this.typeRequest === TYPE_REQUEST_REGISTER) || email.errors.email)" id="email-error-not-valid">
                         {{ MESSAGE_PREFIX + '.email.error.not-email-form' | translate }}
                         <ng-container *ngIf="validMailDomains.length > 0">
                           {{ MESSAGE_PREFIX + '.email.error.not-valid-domain' | translate: { domains: validMailDomains.join(', ') } }}
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 8f20c657f9..020b4d7616 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -6739,4 +6739,6 @@
   "item.page.cc.license.disclaimer": "Except where otherwised noted, this item's license is described as",
 
   "browse.search-form.placeholder": "Search the repository",
+
+  "register-email.aria.label": "Enter your e-mail address",
 }
diff --git a/src/assets/i18n/es.json5 b/src/assets/i18n/es.json5
index 55962d25b5..0306c5a9bb 100644
--- a/src/assets/i18n/es.json5
+++ b/src/assets/i18n/es.json5
@@ -8152,5 +8152,8 @@
   //"browse.search-form.placeholder": "Search the repository",
   "browse.search-form.placeholder": "Buscar en el repositorio",
 
+  // "register-email.aria.label": "Enter your e-mail address",
+  "register-email.aria.label": "Introduzca su dirección de correo electrónico",
+
 
 }
diff --git a/src/assets/i18n/pt-BR.json5 b/src/assets/i18n/pt-BR.json5
index c3b26a09d2..6f4f94d464 100644
--- a/src/assets/i18n/pt-BR.json5
+++ b/src/assets/i18n/pt-BR.json5
@@ -10249,4 +10249,7 @@
 
   //"browse.search-form.placeholder": "Search the repository",
   "browse.search-form.placeholder": "Buscar no repositório",
+
+  // "register-email.aria.label": "Enter your e-mail address",
+  "register-email.aria.label": "Digite seu e-mail",
 }