From f9172f1d7805a0deeee04eb70cdafb114e819233 Mon Sep 17 00:00:00 2001
From: Petar Markov <petarmarkov9449@gmail.com>
Date: Fri, 10 Jan 2025 12:33:15 +0100
Subject: [PATCH] fix convey input field errors on repeat navigation

---
 .../asm-create-customer-form.component.html   |  9 +++++
 .../csagent-login-form.component.html         |  6 +++
 .../customer-selection.component.html         |  3 ++
 .../cart-coupon/cart-coupon.component.html    |  3 ++
 ...port-to-new-saved-cart-form.component.html |  7 +++-
 .../saved-cart-form-dialog.component.html     |  6 +++
 ...eckout-billing-address-form.component.html | 15 ++++++++
 .../checkout-login.component.html             |  6 +++
 .../checkout-payment-form.component.html      | 24 ++++++++++++
 ...omer-ticketing-close-dialog.component.html |  7 +++-
 ...mer-ticketing-reopen-dialog.component.html |  7 +++-
 ...mer-ticketing-create-dialog.component.html | 14 ++++++-
 .../order-guest-register-form.component.html  |  6 +++
 ...unt-summary-document-filter.component.html |  9 +++++
 .../budget/form/budget-form.component.html    |  9 +++++
 .../form/cost-center-form.component.html      |  6 +++
 .../form/permission-form.component.html       |  6 +++
 .../unit/form/unit-form.component.html        |  6 +++
 .../form/unit-address-form.component.html     | 15 ++++++++
 .../form/user-group-form.component.html       |  6 +++
 .../user-change-password-form.component.html  |  6 +++
 .../user/form/user-form.component.html        |  9 +++++
 .../order-approval-detail-form.component.html |  3 ++
 .../user-registration-form.component.html     | 38 ++++++++++++++++++-
 .../login-form/login-form.component.html      |  6 +++
 .../otp-login-form.component.html             | 14 ++++++-
 .../address-form/address-form.component.html  | 15 ++++++++
 .../forgot-password.component.html            |  3 ++
 .../register/register.component.html          | 15 ++++++++
 .../reset-password.component.html             |  6 +++
 .../my-account-v2-email.component.html        |  9 +++++
 .../update-email/update-email.component.html  |  9 +++++
 .../my-account-v2-password.component.html     |  6 +++
 .../update-password.component.html            |  9 +++++
 .../my-account-v2-profile.component.html      |  9 +++++
 .../update-profile.component.html             |  9 +++++
 .../claim-dialog/claim-dialog.component.html  |  3 ++
 .../product-reviews.component.html            |  9 +++++
 .../date-picker/date-picker.component.html    |  3 ++
 39 files changed, 342 insertions(+), 9 deletions(-)

diff --git a/feature-libs/asm/components/asm-create-customer-form/asm-create-customer-form.component.html b/feature-libs/asm/components/asm-create-customer-form/asm-create-customer-form.component.html
index 80a3a9f3b21..0e7c14a6698 100644
--- a/feature-libs/asm/components/asm-create-customer-form/asm-create-customer-form.component.html
+++ b/feature-libs/asm/components/asm-create-customer-form/asm-create-customer-form.component.html
@@ -49,10 +49,13 @@ <h2 id="asm-create-customer-form-title" class="title modal-title">
                   placeholder="{{
                     'asm.createCustomerForm.firstName.placeholder' | cxTranslate
                   }}"
+                  [attr.aria-describedby]="'firstNameError'"
                   formControlName="firstName"
                   name="text"
                 />
                 <cx-form-errors
+                  id="firstNameError"
+                  aria-live="off"
                   [control]="registerForm.get('firstName')"
                 ></cx-form-errors>
               </label>
@@ -69,10 +72,13 @@ <h2 id="asm-create-customer-form-title" class="title modal-title">
                   placeholder="{{
                     'asm.createCustomerForm.lastName.placeholder' | cxTranslate
                   }}"
+                  [attr.aria-describedby]="'lastNameError'"
                   name="text"
                   formControlName="lastName"
                 />
                 <cx-form-errors
+                  id="lastNameError"
+                  aria-live="off"
                   [control]="registerForm.get('lastName')"
                 ></cx-form-errors>
               </label>
@@ -90,10 +96,13 @@ <h2 id="asm-create-customer-form-title" class="title modal-title">
                     'asm.createCustomerForm.emailAddress.placeholder'
                       | cxTranslate
                   }}"
+                  [attr.aria-describedby]="'emailError'"
                   name="email"
                   formControlName="email"
                 />
                 <cx-form-errors
+                  id="emailError"
+                  aria-live="off"
                   [control]="registerForm.get('email')"
                 ></cx-form-errors>
               </label>
diff --git a/feature-libs/asm/components/csagent-login-form/csagent-login-form.component.html b/feature-libs/asm/components/csagent-login-form/csagent-login-form.component.html
index 91b8238c42d..1c5cea09fde 100644
--- a/feature-libs/asm/components/csagent-login-form/csagent-login-form.component.html
+++ b/feature-libs/asm/components/csagent-login-form/csagent-login-form.component.html
@@ -12,11 +12,14 @@
       type="text"
       formControlName="userId"
       [attr.aria-label]="'asm.loginForm.userId.label' | cxTranslate"
+      [attr.aria-describedby]="'userIdError'"
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="userIdError"
+      aria-live="off"
       [translationParams]="{
         label: 'asm.loginForm.userId.label' | cxTranslate,
       }"
@@ -38,12 +41,15 @@
       type="password"
       formControlName="password"
       [attr.aria-label]="'asm.loginForm.password.label' | cxTranslate"
+      [attr.aria-describedby]="'passwordError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="passwordError"
+      aria-live="off"
       [translationParams]="{
         label: 'asm.loginForm.password.label' | cxTranslate,
       }"
diff --git a/feature-libs/asm/components/customer-selection/customer-selection.component.html b/feature-libs/asm/components/customer-selection/customer-selection.component.html
index 138e9f043db..185dea88af4 100644
--- a/feature-libs/asm/components/customer-selection/customer-selection.component.html
+++ b/feature-libs/asm/components/customer-selection/customer-selection.component.html
@@ -175,6 +175,7 @@
         type="text"
         formControlName="searchTerm"
         [attr.aria-label]="'asm.customerSearch.searchTerm.label' | cxTranslate"
+        [attr.aria-describedby]="'searchTermError'"
         placeholder="{{ 'asm.customerSearch.searchTerm.label' | cxTranslate }}"
         (keydown.arrowdown)="focusFirstItem($event)"
         (keydown.end)="setSelectionEnd($event)"
@@ -183,6 +184,8 @@
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="searchTermError"
+        aria-live="off"
         [translationParams]="{
           label: 'asm.customerSearch.searchTerm.label' | cxTranslate,
         }"
diff --git a/feature-libs/cart/base/components/cart-coupon/cart-coupon.component.html b/feature-libs/cart/base/components/cart-coupon/cart-coupon.component.html
index ee44fbb38f7..9e2e48606b5 100644
--- a/feature-libs/cart/base/components/cart-coupon/cart-coupon.component.html
+++ b/feature-libs/cart/base/components/cart-coupon/cart-coupon.component.html
@@ -64,6 +64,7 @@
           <!-- TODO: (CXSPA-7479) Remove feature flags next major -->
           <input
             [attr.aria-labelledby]="'card-coupon-input-label'"
+            [attr.aria-describedby]="'couponCodeError'"
             required="true"
             type="text"
             class="form-control input-coupon-code"
@@ -81,6 +82,8 @@
           <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
           <cx-form-errors
             *cxFeature="'formErrorsDescriptiveMessages'"
+            id="couponCodeError"
+            aria-live="off"
             [translationParams]="{
               label: 'voucher.placeholder' | cxTranslate,
             }"
diff --git a/feature-libs/cart/import-export/components/import-to-cart/import-entries-dialog/import-to-new-saved-cart-form/import-to-new-saved-cart-form.component.html b/feature-libs/cart/import-export/components/import-to-cart/import-entries-dialog/import-to-new-saved-cart-form/import-to-new-saved-cart-form.component.html
index b8e8e34e0a5..711f004a6e0 100644
--- a/feature-libs/cart/import-export/components/import-to-cart/import-entries-dialog/import-to-new-saved-cart-form/import-to-new-saved-cart-form.component.html
+++ b/feature-libs/cart/import-export/components/import-to-cart/import-entries-dialog/import-to-new-saved-cart-form/import-to-new-saved-cart-form.component.html
@@ -49,8 +49,13 @@
         formControlName="name"
         required
         type="text"
+        [attr.aria-describedby]="'nameError'"
       />
-      <cx-form-errors [control]="form.get('name')"></cx-form-errors>
+      <cx-form-errors
+        id="nameError"
+        aria-live="off"
+        [control]="form.get('name')"
+      ></cx-form-errors>
     </label>
   </div>
 
diff --git a/feature-libs/cart/saved-cart/components/saved-cart-form-dialog/saved-cart-form-dialog.component.html b/feature-libs/cart/saved-cart/components/saved-cart-form-dialog/saved-cart-form-dialog.component.html
index 1936e7f93f4..d2e90b698d9 100644
--- a/feature-libs/cart/saved-cart/components/saved-cart-form-dialog/saved-cart-form-dialog.component.html
+++ b/feature-libs/cart/saved-cart/components/saved-cart-form-dialog/saved-cart-form-dialog.component.html
@@ -236,6 +236,7 @@
                   required="true"
                   [maxLength]="nameMaxLength"
                   class="form-control"
+                  [attr.aria-describedby]="'nameError'"
                   formControlName="name"
                   required
                   type="text"
@@ -244,6 +245,8 @@
                 <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
                 <cx-form-errors
                   *cxFeature="'formErrorsDescriptiveMessages'"
+                  id="nameError"
+                  aria-live="off"
                   [translationParams]="{
                     label: 'savedCartDialog.savedCartName' | cxTranslate,
                   }"
@@ -269,6 +272,7 @@
               <textarea
                 [maxLength]="descriptionMaxLength"
                 class="form-control"
+                [attr.aria-describedby]="'descriptionError'"
                 formControlName="description"
                 rows="5"
               ></textarea>
@@ -276,6 +280,8 @@
               <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
               <cx-form-errors
                 *cxFeature="'formErrorsDescriptiveMessages'"
+                id="descriptionError"
+                aria-live="off"
                 [translationParams]="{
                   label: 'savedCartDialog.savedCartDescription' | cxTranslate,
                 }"
diff --git a/feature-libs/checkout/base/components/checkout-billing-address/checkout-billing-address-form.component.html b/feature-libs/checkout/base/components/checkout-billing-address/checkout-billing-address-form.component.html
index 02bfc18934a..41e4da72bf1 100644
--- a/feature-libs/checkout/base/components/checkout-billing-address/checkout-billing-address-form.component.html
+++ b/feature-libs/checkout/base/components/checkout-billing-address/checkout-billing-address-form.component.html
@@ -89,8 +89,11 @@
               'addressForm.firstName.placeholder' | cxTranslate
             }}"
             formControlName="firstName"
+            [attr.aria-describedby]="'firstNameError'"
           />
           <cx-form-errors
+            id="firstNameError"
+            aria-live="off"
             [control]="billingAddressForm.get('firstName')"
           ></cx-form-errors>
         </label>
@@ -107,8 +110,11 @@
             class="form-control"
             placeholder="{{ 'addressForm.lastName.placeholder' | cxTranslate }}"
             formControlName="lastName"
+            [attr.aria-describedby]="'lastNameError'"
           />
           <cx-form-errors
+            id="lastNameError"
+            aria-live="off"
             [control]="billingAddressForm.get('lastName')"
           ></cx-form-errors>
         </label>
@@ -125,8 +131,11 @@
             class="form-control"
             placeholder="{{ 'addressForm.streetAddress' | cxTranslate }}"
             formControlName="line1"
+            [attr.aria-describedby]="'line1Error'"
           />
           <cx-form-errors
+            id="line1Error"
+            aria-live="off"
             [control]="billingAddressForm.get('line1')"
           ></cx-form-errors>
         </label>
@@ -157,8 +166,11 @@
               class="form-control"
               placeholder="{{ 'addressForm.city.placeholder' | cxTranslate }}"
               formControlName="town"
+              [attr.aria-describedby]="'townError'"
             />
             <cx-form-errors
+              id="townError"
+              aria-live="off"
               [control]="billingAddressForm.get('town')"
             ></cx-form-errors>
           </label>
@@ -177,8 +189,11 @@
                 'addressForm.zipCode.placeholder' | cxTranslate
               }}"
               formControlName="postalCode"
+              [attr.aria-describedby]="'postalCodeError'"
             />
             <cx-form-errors
+              id="postalCodeError"
+              aria-live="off"
               [control]="billingAddressForm.get('postalCode')"
             ></cx-form-errors>
           </label>
diff --git a/feature-libs/checkout/base/components/checkout-login/checkout-login.component.html b/feature-libs/checkout/base/components/checkout-login/checkout-login.component.html
index 1cad8005f2a..83cb8889fdc 100644
--- a/feature-libs/checkout/base/components/checkout-login/checkout-login.component.html
+++ b/feature-libs/checkout/base/components/checkout-login/checkout-login.component.html
@@ -17,11 +17,14 @@
         placeholder="{{
           'checkoutLogin.emailAddress.placeholder' | cxTranslate
         }}"
+        [attr.aria-describedby]="'emailError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="emailError"
+        aria-live="off"
         [translationParams]="{
           label: 'checkoutLogin.emailAddress.label' | cxTranslate,
         }"
@@ -50,11 +53,14 @@
         placeholder="{{
           'checkoutLogin.confirmEmail.placeholder' | cxTranslate
         }}"
+        [attr.aria-describedby]="'emailConfirmationError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="emailConfirmationError"
+        aria-live="off"
         [translationParams]="{
           label: 'checkoutLogin.confirmEmail.label' | cxTranslate,
         }"
diff --git a/feature-libs/checkout/base/components/checkout-payment-method/checkout-payment-form/checkout-payment-form.component.html b/feature-libs/checkout/base/components/checkout-payment-method/checkout-payment-form/checkout-payment-form.component.html
index d16e3fcd095..7f4f7dcb58c 100644
--- a/feature-libs/checkout/base/components/checkout-payment-method/checkout-payment-form/checkout-payment-form.component.html
+++ b/feature-libs/checkout/base/components/checkout-payment-method/checkout-payment-form/checkout-payment-form.component.html
@@ -70,11 +70,14 @@
                 'paymentForm.accountHolderName.placeholder' | cxTranslate
               }}"
               formControlName="accountHolderName"
+              [attr.aria-describedby]="'accountHolderNameError'"
             />
 
             <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
             <cx-form-errors
               *cxFeature="'formErrorsDescriptiveMessages'"
+              id="accountHolderNameError"
+              aria-live="off"
               [translationParams]="{
                 label: 'paymentForm.accountHolderName.label' | cxTranslate,
               }"
@@ -99,11 +102,14 @@
               type="text"
               class="form-control"
               formControlName="cardNumber"
+              [attr.aria-describedby]="'cardNumberError'"
             />
 
             <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
             <cx-form-errors
               *cxFeature="'formErrorsDescriptiveMessages'"
+              id="cardNumberError"
+              aria-live="off"
               [translationParams]="{
                 label: 'paymentForm.cardNumber' | cxTranslate,
               }"
@@ -217,11 +223,14 @@
                 class="form-control"
                 id="cVVNumber"
                 formControlName="cvn"
+                [attr.aria-describedby]="'cvnError'"
               />
 
               <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
               <cx-form-errors
                 *cxFeature="'formErrorsDescriptiveMessages'"
+                id="cvnError"
+                aria-live="off"
                 [translationParams]="{
                   label: 'paymentForm.securityCode' | cxTranslate,
                 }"
@@ -363,11 +372,14 @@
                       'addressForm.firstName.placeholder' | cxTranslate
                     }}"
                     formControlName="firstName"
+                    [attr.aria-describedby]="'firstNameError'"
                   />
 
                   <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
                   <cx-form-errors
                     *cxFeature="'formErrorsDescriptiveMessages'"
+                    id="firstNameError"
+                    aria-live="off"
                     [translationParams]="{
                       label: 'addressForm.firstName.label' | cxTranslate,
                     }"
@@ -396,11 +408,14 @@
                       'addressForm.lastName.placeholder' | cxTranslate
                     }}"
                     formControlName="lastName"
+                    [attr.aria-describedby]="'lastNameError'"
                   />
 
                   <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
                   <cx-form-errors
                     *cxFeature="'formErrorsDescriptiveMessages'"
+                    id="lastNameError"
+                    aria-live="off"
                     [translationParams]="{
                       label: 'addressForm.lastName.label' | cxTranslate,
                     }"
@@ -429,11 +444,14 @@
                       'addressForm.streetAddress' | cxTranslate
                     }}"
                     formControlName="line1"
+                    [attr.aria-describedby]="'line1Error'"
                   />
 
                   <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
                   <cx-form-errors
                     *cxFeature="'formErrorsDescriptiveMessages'"
+                    id="line1Error"
+                    aria-live="off"
                     [translationParams]="{
                       label: 'addressForm.address1' | cxTranslate,
                     }"
@@ -476,11 +494,14 @@
                         'addressForm.city.placeholder' | cxTranslate
                       }}"
                       formControlName="town"
+                      [attr.aria-describedby]="'townError'"
                     />
 
                     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
                     <cx-form-errors
                       *cxFeature="'formErrorsDescriptiveMessages'"
+                      id="townError"
+                      aria-live="off"
                       [translationParams]="{
                         label: 'addressForm.city.label' | cxTranslate,
                       }"
@@ -509,11 +530,14 @@
                         'addressForm.zipCode.placeholder' | cxTranslate
                       }}"
                       formControlName="postalCode"
+                      [attr.aria-describedby]="'postalCodeError'"
                     />
 
                     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
                     <cx-form-errors
                       *cxFeature="'formErrorsDescriptiveMessages'"
+                      id="postalCodeError"
+                      aria-live="off"
                       [translationParams]="{
                         label: 'addressForm.zipCode.label' | cxTranslate,
                       }"
diff --git a/feature-libs/customer-ticketing/components/details/customer-ticketing-close/customer-ticketing-close-dialog/customer-ticketing-close-dialog.component.html b/feature-libs/customer-ticketing/components/details/customer-ticketing-close/customer-ticketing-close-dialog/customer-ticketing-close-dialog.component.html
index 3f54ad75a94..2a7185f7f5e 100644
--- a/feature-libs/customer-ticketing/components/details/customer-ticketing-close/customer-ticketing-close-dialog/customer-ticketing-close-dialog.component.html
+++ b/feature-libs/customer-ticketing/components/details/customer-ticketing-close/customer-ticketing-close-dialog/customer-ticketing-close-dialog.component.html
@@ -34,10 +34,15 @@
             [maxLength]="inputCharactersLimit"
             class="form-control"
             formControlName="message"
+            [attr.aria-describedby]="'messageError'"
             rows="5"
           ></textarea>
 
-          <cx-form-errors [control]="form.get('message')"></cx-form-errors>
+          <cx-form-errors
+            id="messageError"
+            aria-live="off"
+            [control]="form.get('message')"
+          ></cx-form-errors>
 
           <p class="cx-customer-ticket-input-hint">
             {{
diff --git a/feature-libs/customer-ticketing/components/details/customer-ticketing-reopen/customer-ticketing-reopen-dialog/customer-ticketing-reopen-dialog.component.html b/feature-libs/customer-ticketing/components/details/customer-ticketing-reopen/customer-ticketing-reopen-dialog/customer-ticketing-reopen-dialog.component.html
index 9207b6db8e7..01c41cc2df4 100644
--- a/feature-libs/customer-ticketing/components/details/customer-ticketing-reopen/customer-ticketing-reopen-dialog/customer-ticketing-reopen-dialog.component.html
+++ b/feature-libs/customer-ticketing/components/details/customer-ticketing-reopen/customer-ticketing-reopen-dialog/customer-ticketing-reopen-dialog.component.html
@@ -34,9 +34,14 @@
             class="form-control"
             formControlName="message"
             rows="5"
+            [attr.aria-describedby]="'messageError'"
           ></textarea>
 
-          <cx-form-errors [control]="form.get('message')"></cx-form-errors>
+          <cx-form-errors
+            id="messageError"
+            aria-live="off"
+            [control]="form.get('message')"
+          ></cx-form-errors>
 
           <p class="cx-customer-ticket-input-hint">
             {{
diff --git a/feature-libs/customer-ticketing/components/list/customer-ticketing-create/customer-ticketing-create-dialog/customer-ticketing-create-dialog.component.html b/feature-libs/customer-ticketing/components/list/customer-ticketing-create/customer-ticketing-create-dialog/customer-ticketing-create-dialog.component.html
index 56179763eef..2bae1dd4e51 100644
--- a/feature-libs/customer-ticketing/components/list/customer-ticketing-create/customer-ticketing-create-dialog/customer-ticketing-create-dialog.component.html
+++ b/feature-libs/customer-ticketing/components/list/customer-ticketing-create/customer-ticketing-create-dialog/customer-ticketing-create-dialog.component.html
@@ -38,9 +38,14 @@
             class="form-control"
             formControlName="subject"
             rows="1"
+            [attr.aria-describedby]="'subjectError'"
           ></textarea>
 
-          <cx-form-errors [control]="form.get('subject')"></cx-form-errors>
+          <cx-form-errors
+            id="subjectError"
+            aria-live="off"
+            [control]="form.get('subject')"
+          ></cx-form-errors>
           <p class="cx-customer-ticket-input-hint">
             {{
               'customerTicketing.charactersLeft'
@@ -110,9 +115,14 @@
             class="form-control"
             formControlName="message"
             rows="5"
+            [attr.aria-describedby]="'messageError'"
           ></textarea>
 
-          <cx-form-errors [control]="form.get('message')"></cx-form-errors>
+          <cx-form-errors
+            id="messageError"
+            aria-live="off"
+            [control]="form.get('message')"
+          ></cx-form-errors>
 
           <p class="cx-customer-ticket-input-hint">
             {{
diff --git a/feature-libs/order/components/order-confirmation/order-guest-register-form/order-guest-register-form.component.html b/feature-libs/order/components/order-confirmation/order-guest-register-form/order-guest-register-form.component.html
index 5fce3dc6482..098b33d3e2c 100644
--- a/feature-libs/order/components/order-confirmation/order-guest-register-form/order-guest-register-form.component.html
+++ b/feature-libs/order/components/order-confirmation/order-guest-register-form/order-guest-register-form.component.html
@@ -26,12 +26,15 @@ <h3>{{ 'checkoutOrderConfirmation.createAccount' | cxTranslate }}</h3>
             placeholder="{{ 'register.password.placeholder' | cxTranslate }}"
             formControlName="password"
             [attr.aria-label]="'register.password.placeholder' | cxTranslate"
+            [attr.aria-describedby]="'passwordError'"
             cxPasswordVisibilitySwitch
           />
 
           <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
           <cx-form-errors
             *cxFeature="'formErrorsDescriptiveMessages'"
+            id="passwordError"
+            aria-live="off"
             [translationParams]="{
               label: 'register.password.label' | cxTranslate,
             }"
@@ -63,12 +66,15 @@ <h3>{{ 'checkoutOrderConfirmation.createAccount' | cxTranslate }}</h3>
             [attr.aria-label]="
               'register.confirmPassword.placeholder' | cxTranslate
             "
+            [attr.aria-describedby]="'passwordconfError'"
             cxPasswordVisibilitySwitch
           />
 
           <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
           <cx-form-errors
             *cxFeature="'formErrorsDescriptiveMessages'"
+            id="passwordconfError"
+            aria-live="off"
             [translationParams]="{
               label: 'register.confirmPassword.label' | cxTranslate,
             }"
diff --git a/feature-libs/organization/account-summary/components/details/document/filter/account-summary-document-filter.component.html b/feature-libs/organization/account-summary/components/details/document/filter/account-summary-document-filter.component.html
index 5a22499e841..30df147a8fe 100644
--- a/feature-libs/organization/account-summary/components/details/document/filter/account-summary-document-filter.component.html
+++ b/feature-libs/organization/account-summary/components/details/document/filter/account-summary-document-filter.component.html
@@ -20,11 +20,14 @@
           class="cx-account-summary-document-filter-form-input"
           [type]="type"
           formControlName="from"
+          [attr.aria-describedby]="'fromError'"
         />
 
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="fromError"
+          aria-live="off"
           [translationParams]="{
             label: 'orgAccountSummary.filter.startRange' | cxTranslate,
           }"
@@ -58,11 +61,14 @@
           class="cx-account-summary-document-filter-form-input"
           [type]="type"
           formControlName="to"
+          [attr.aria-describedby]="'toError'"
         />
 
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="toError"
+          aria-live="off"
           [translationParams]="{
             label: 'orgAccountSummary.filter.endRange' | cxTranslate,
           }"
@@ -187,11 +193,14 @@
       <input
         class="cx-account-summary-document-filter-form-input"
         formControlName="documentNumber"
+        [attr.aria-describedby]="'documentNumberError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="documentNumberError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgAccountSummary.filter.documentNumber' | cxTranslate,
         }"
diff --git a/feature-libs/organization/administration/components/budget/form/budget-form.component.html b/feature-libs/organization/administration/components/budget/form/budget-form.component.html
index 4ac5e6a0097..7813707e62f 100644
--- a/feature-libs/organization/administration/components/budget/form/budget-form.component.html
+++ b/feature-libs/organization/administration/components/budget/form/budget-form.component.html
@@ -15,11 +15,14 @@
         placeholder="{{ 'orgBudget.name' | cxTranslate }}"
         formControlName="name"
         (blur)="createCodeWithName(form.get('name'), form.get('code'))"
+        [attr.aria-describedby]="'nameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="nameError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgBudget.name' | cxTranslate,
         }"
@@ -43,11 +46,14 @@
         required
         placeholder="{{ 'orgBudget.code' | cxTranslate }}"
         formControlName="code"
+        [attr.aria-describedby]="'codeError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="codeError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgBudget.code' | cxTranslate,
         }"
@@ -143,11 +149,14 @@
         placeholder="{{ 'orgBudget.amount' | cxTranslate }}"
         formControlName="budget"
         min="0"
+        [attr.aria-describedby]="'budgetError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="budgetError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgBudget.amount' | cxTranslate,
         }"
diff --git a/feature-libs/organization/administration/components/cost-center/form/cost-center-form.component.html b/feature-libs/organization/administration/components/cost-center/form/cost-center-form.component.html
index 630a01d552f..e29d6f2853f 100644
--- a/feature-libs/organization/administration/components/cost-center/form/cost-center-form.component.html
+++ b/feature-libs/organization/administration/components/cost-center/form/cost-center-form.component.html
@@ -15,11 +15,14 @@
         placeholder="{{ 'orgCostCenter.name' | cxTranslate }}"
         formControlName="name"
         (blur)="createCodeWithName(form.get('name'), form.get('code'))"
+        [attr.aria-describedby]="'nameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="nameError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgCostCenter.name' | cxTranslate,
         }"
@@ -43,11 +46,14 @@
         required
         placeholder="{{ 'orgCostCenter.code' | cxTranslate }}"
         formControlName="code"
+        [attr.aria-describedby]="'codeError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="codeError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgCostCenter.code' | cxTranslate,
         }"
diff --git a/feature-libs/organization/administration/components/permission/form/permission-form.component.html b/feature-libs/organization/administration/components/permission/form/permission-form.component.html
index 5107835c57d..8c1fa4a1fd5 100644
--- a/feature-libs/organization/administration/components/permission/form/permission-form.component.html
+++ b/feature-libs/organization/administration/components/permission/form/permission-form.component.html
@@ -14,11 +14,14 @@
         required
         placeholder="{{ 'orgPurchaseLimit.code' | cxTranslate }}"
         formControlName="code"
+        [attr.aria-describedby]="'codeError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="codeError"
+        aria-live="off"
         [translationParams]="{ label: 'orgPurchaseLimit.code' | cxTranslate }"
         [control]="form.get('code')"
       ></cx-form-errors>
@@ -146,11 +149,14 @@
         required
         placeholder="{{ 'orgPurchaseLimit.threshold' | cxTranslate }}"
         formControlName="threshold"
+        [attr.aria-describedby]="'thresholdError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="thresholdError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgPurchaseLimit.threshold' | cxTranslate,
         }"
diff --git a/feature-libs/organization/administration/components/unit/form/unit-form.component.html b/feature-libs/organization/administration/components/unit/form/unit-form.component.html
index 27226913a22..74707c78fec 100644
--- a/feature-libs/organization/administration/components/unit/form/unit-form.component.html
+++ b/feature-libs/organization/administration/components/unit/form/unit-form.component.html
@@ -15,10 +15,13 @@
         placeholder="{{ 'orgUnit.name' | cxTranslate }}"
         formControlName="name"
         (blur)="createUidWithName(form.get('name'), form.get('uid'))"
+        [attr.aria-describedby]="'nameError'"
       />
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="nameError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgUnit.name' | cxTranslate,
         }"
@@ -42,11 +45,14 @@
         required
         placeholder="{{ 'orgUnit.uid' | cxTranslate }}"
         formControlName="uid"
+        [attr.aria-describedby]="'uidError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="uidError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgUnit.uid' | cxTranslate,
         }"
diff --git a/feature-libs/organization/administration/components/unit/links/addresses/form/unit-address-form.component.html b/feature-libs/organization/administration/components/unit/links/addresses/form/unit-address-form.component.html
index 18edbd8ebbb..c2fd28d53e0 100644
--- a/feature-libs/organization/administration/components/unit/links/addresses/form/unit-address-form.component.html
+++ b/feature-libs/organization/administration/components/unit/links/addresses/form/unit-address-form.component.html
@@ -69,11 +69,14 @@
         type="text"
         placeholder="{{ 'orgUnitAddress.firstName' | cxTranslate }}"
         formControlName="firstName"
+        [attr.aria-describedby]="'firstNameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="firstNameError"
+        aria-live="off"
         [translationParams]="{
           label: 'orgUnitAddress.firstName' | cxTranslate,
         }"
@@ -96,11 +99,14 @@
         class="form-control"
         placeholder="{{ 'orgUnitAddress.lastName' | cxTranslate }}"
         formControlName="lastName"
+        [attr.aria-describedby]="'lastNameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="lastNameError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUnitAddress.lastName' | cxTranslate }"
         [control]="form.get('lastName')"
       ></cx-form-errors>
@@ -122,11 +128,14 @@
         class="form-control"
         placeholder="{{ 'orgUnitAddress.streetAddress' | cxTranslate }}"
         formControlName="line1"
+        [attr.aria-describedby]="'line1Error'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="line1Error"
+        aria-live="off"
         [translationParams]="{ label: 'orgUnitAddress.address1' | cxTranslate }"
         [control]="form.get('line1')"
       ></cx-form-errors>
@@ -172,11 +181,14 @@
         class="form-control"
         placeholder="{{ 'orgUnitAddress.city' | cxTranslate }}"
         formControlName="town"
+        [attr.aria-describedby]="'townError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="townError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUnitAddress.city' | cxTranslate }"
         [control]="form.get('town')"
       ></cx-form-errors>
@@ -198,11 +210,14 @@
         class="form-control"
         placeholder="{{ 'orgUnitAddress.zipCode' | cxTranslate }}"
         formControlName="postalCode"
+        [attr.aria-describedby]="'postalCodeError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="postalCodeError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUnitAddress.zipCode' | cxTranslate }"
         [control]="form.get('postalCode')"
       ></cx-form-errors>
diff --git a/feature-libs/organization/administration/components/user-group/form/user-group-form.component.html b/feature-libs/organization/administration/components/user-group/form/user-group-form.component.html
index bfee5c884e5..9519c223b37 100644
--- a/feature-libs/organization/administration/components/user-group/form/user-group-form.component.html
+++ b/feature-libs/organization/administration/components/user-group/form/user-group-form.component.html
@@ -15,11 +15,14 @@
         placeholder="{{ 'orgUserGroup.name' | cxTranslate }}"
         formControlName="name"
         (blur)="createUidWithName(form.get('name'), form.get('uid'))"
+        [attr.aria-describedby]="'nameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="nameError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUserGroup.name' | cxTranslate }"
         [control]="form.get('name')"
       ></cx-form-errors>
@@ -41,11 +44,14 @@
         required
         placeholder="{{ 'orgUserGroup.uid' | cxTranslate }}"
         formControlName="uid"
+        [attr.aria-describedby]="'uidError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="uidError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUserGroup.uid' | cxTranslate }"
         [control]="form.get('uid')"
       ></cx-form-errors>
diff --git a/feature-libs/organization/administration/components/user/change-password-form/user-change-password-form.component.html b/feature-libs/organization/administration/components/user/change-password-form/user-change-password-form.component.html
index a5083e394aa..911244d3d9d 100644
--- a/feature-libs/organization/administration/components/user/change-password-form/user-change-password-form.component.html
+++ b/feature-libs/organization/administration/components/user/change-password-form/user-change-password-form.component.html
@@ -29,11 +29,14 @@
           formControlName="password"
           [attr.aria-label]="'orgUser.password.newPassword' | cxTranslate"
           cxPasswordVisibilitySwitch
+          [attr.aria-describedby]="'passwordError'"
         />
 
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="passwordError"
+          aria-live="off"
           [translationParams]="{
             label: 'orgUser.password.newPassword' | cxTranslate,
           }"
@@ -57,12 +60,15 @@
           placeholder="{{ 'orgUser.password.confirmPassword' | cxTranslate }}"
           formControlName="confirmPassword"
           [attr.aria-label]="'orgUser.password.confirmPassword' | cxTranslate"
+          [attr.aria-describedby]="'confirmPasswordError'"
           cxPasswordVisibilitySwitch
         />
 
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="confirmPasswordError"
+          aria-live="off"
           [translationParams]="{
             label: 'orgUser.password.confirmPassword' | cxTranslate,
           }"
diff --git a/feature-libs/organization/administration/components/user/form/user-form.component.html b/feature-libs/organization/administration/components/user/form/user-form.component.html
index 7e670ca5362..2f8a28c3e4c 100644
--- a/feature-libs/organization/administration/components/user/form/user-form.component.html
+++ b/feature-libs/organization/administration/components/user/form/user-form.component.html
@@ -42,11 +42,14 @@
         required
         placeholder="{{ 'orgUser.firstName' | cxTranslate }}"
         formControlName="firstName"
+        [attr.aria-describedby]="'firstNameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="firstNameError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUser.firstName' | cxTranslate }"
         [control]="form.get('firstName')"
       ></cx-form-errors>
@@ -68,11 +71,14 @@
         required
         placeholder="{{ 'orgUser.lastName' | cxTranslate }}"
         formControlName="lastName"
+        [attr.aria-describedby]="'lastNameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="lastNameError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUser.lastName' | cxTranslate }"
         [control]="form.get('lastName')"
       ></cx-form-errors>
@@ -94,11 +100,14 @@
         required
         placeholder="{{ 'orgUser.email' | cxTranslate }}"
         formControlName="email"
+        [attr.aria-describedby]="'emailError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="emailError"
+        aria-live="off"
         [translationParams]="{ label: 'orgUser.email' | cxTranslate }"
         [control]="form.get('email')"
       ></cx-form-errors>
diff --git a/feature-libs/organization/order-approval/components/details/order-approval-detail-form/order-approval-detail-form.component.html b/feature-libs/organization/order-approval/components/details/order-approval-detail-form/order-approval-detail-form.component.html
index 42d9e17fb27..d92ecb71ef3 100644
--- a/feature-libs/organization/order-approval/components/details/order-approval-detail-form/order-approval-detail-form.component.html
+++ b/feature-libs/organization/order-approval/components/details/order-approval-detail-form/order-approval-detail-form.component.html
@@ -41,11 +41,14 @@
             rows="3"
             formControlName="comment"
             maxlength="255"
+            [attr.aria-describedby]="'commentError'"
           ></textarea>
 
           <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
           <cx-form-errors
             *cxFeature="'formErrorsDescriptiveMessages'"
+            id="commentError"
+            aria-live="off"
             [translationParams]="{
               label:
                 'orderApprovalDetails.form.comment_' +
diff --git a/feature-libs/organization/user-registration/components/form/user-registration-form.component.html b/feature-libs/organization/user-registration/components/form/user-registration-form.component.html
index 1da2edd7079..204ea8afa6a 100644
--- a/feature-libs/organization/user-registration/components/form/user-registration-form.component.html
+++ b/feature-libs/organization/user-registration/components/form/user-registration-form.component.html
@@ -46,11 +46,14 @@
           'userRegistrationForm.fields.firstName.placeholder' | cxTranslate
         }}"
         formControlName="firstName"
+        [attr.aria-describedby]="'firstNameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="firstNameError"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.firstName.label' | cxTranslate,
         }"
@@ -77,11 +80,14 @@
           'userRegistrationForm.fields.lastName.placeholder' | cxTranslate
         }}"
         formControlName="lastName"
+        [attr.aria-describedby]="'lastNameError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="lastNameError"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.lastName.label' | cxTranslate,
         }"
@@ -108,9 +114,12 @@
           'userRegistrationForm.fields.companyName.placeholder' | cxTranslate
         }}"
         formControlName="companyName"
+        [attr.aria-describedby]="'companyNameError'"
       />
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="companyNameError"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.companyName.label' | cxTranslate,
         }"
@@ -136,11 +145,14 @@
           'userRegistrationForm.fields.email.placeholder' | cxTranslate
         }}"
         formControlName="email"
+        [attr.aria-describedby]="'emailError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="emailError"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.email.label' | cxTranslate,
         }"
@@ -207,11 +219,14 @@
           'userRegistrationForm.fields.addressLine.placeholder' | cxTranslate
         }}"
         formControlName="line1"
+        [attr.aria-describedby]="'line1Error'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="line1Error"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.addressLine.label' | cxTranslate,
         }"
@@ -236,8 +251,13 @@
             | cxTranslate
         }}"
         formControlName="line2"
+        [attr.aria-describedby]="'line2Error'"
       />
-      <cx-form-errors [control]="registerForm.get('line2')"></cx-form-errors>
+      <cx-form-errors
+        id="line2Error"
+        aria-live="off"
+        [control]="registerForm.get('line2')"
+      ></cx-form-errors>
     </label>
 
     <label>
@@ -251,8 +271,13 @@
           'userRegistrationForm.fields.city.label' | cxTranslate
         }}"
         formControlName="town"
+        [attr.aria-describedby]="'townError'"
       />
-      <cx-form-errors [control]="registerForm.get('town')"></cx-form-errors>
+      <cx-form-errors
+        id="townError"
+        aria-live="off"
+        [control]="registerForm.get('town')"
+      ></cx-form-errors>
     </label>
 
     <label>
@@ -266,11 +291,14 @@
           'userRegistrationForm.fields.postalCode.placeholder' | cxTranslate
         }}"
         formControlName="postalCode"
+        [attr.aria-describedby]="'postalCodeError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="postalCodeError"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.postalCode.label' | cxTranslate,
         }"
@@ -333,11 +361,14 @@
           'userRegistrationForm.fields.phoneNumber.placeholder' | cxTranslate
         }}"
         formControlName="phoneNumber"
+        [attr.aria-describedby]="'phoneNumberError'"
       />
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="phoneNumberError"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.phoneNumber.label' | cxTranslate,
         }"
@@ -361,11 +392,14 @@
           'userRegistrationForm.fields.message.placeholder' | cxTranslate
         }}"
         rows="5"
+        [attr.aria-describedby]="'messageError'"
       ></textarea>
 
       <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="messageError"
+        aria-live="off"
         [translationParams]="{
           label: 'userRegistrationForm.fields.message.label' | cxTranslate,
         }"
diff --git a/feature-libs/user/account/components/login-form/login-form.component.html b/feature-libs/user/account/components/login-form/login-form.component.html
index 0a3c7f0efc5..92dec8de479 100644
--- a/feature-libs/user/account/components/login-form/login-form.component.html
+++ b/feature-libs/user/account/components/login-form/login-form.component.html
@@ -15,12 +15,15 @@
       type="email"
       class="form-control"
       formControlName="userId"
+      [attr.aria-describedby]="'userIdError'"
       placeholder="{{ 'loginForm.emailAddress.placeholder' | cxTranslate }}"
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="userIdError"
+      aria-live="off"
       [translationParams]="{
         label: 'loginForm.emailAddress.label' | cxTranslate,
       }"
@@ -45,12 +48,15 @@
       placeholder="{{ 'loginForm.password.placeholder' | cxTranslate }}"
       formControlName="password"
       [attr.aria-label]="'loginForm.password.placeholder' | cxTranslate"
+      [attr.aria-describedby]="'passwordError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="passwordError"
+      aria-live="off"
       [translationParams]="{
         label: 'loginForm.password.label' | cxTranslate,
       }"
diff --git a/feature-libs/user/account/components/otp-login-form/otp-login-form.component.html b/feature-libs/user/account/components/otp-login-form/otp-login-form.component.html
index 16f326deb86..f55f615ae07 100644
--- a/feature-libs/user/account/components/otp-login-form/otp-login-form.component.html
+++ b/feature-libs/user/account/components/otp-login-form/otp-login-form.component.html
@@ -16,8 +16,13 @@
       class="form-control"
       formControlName="userId"
       placeholder="{{ 'loginForm.emailAddress.placeholder' | cxTranslate }}"
+      [attr.aria-describedby]="'userIdError'"
     />
-    <cx-form-errors [control]="form.get('userId')"></cx-form-errors>
+    <cx-form-errors
+      id="userIdError"
+      aria-live="off"
+      [control]="form.get('userId')"
+    ></cx-form-errors>
   </label>
 
   <label>
@@ -32,9 +37,14 @@
       placeholder="{{ 'loginForm.password.placeholder' | cxTranslate }}"
       formControlName="password"
       [attr.aria-label]="'loginForm.password.placeholder' | cxTranslate"
+      [attr.aria-describedby]="'passwordError'"
       cxPasswordVisibilitySwitch
     />
-    <cx-form-errors [control]="form.get('password')"></cx-form-errors>
+    <cx-form-errors
+      id="passwordError"
+      aria-live="off"
+      [control]="form.get('password')"
+    ></cx-form-errors>
   </label>
 
   <a [routerLink]="{ cxRoute: 'forgotPassword' } | cxUrl" class="btn-link">
diff --git a/feature-libs/user/profile/components/address-book/address-form/address-form.component.html b/feature-libs/user/profile/components/address-book/address-form/address-form.component.html
index 39b63cc2f42..410fd3c9f32 100644
--- a/feature-libs/user/profile/components/address-book/address-form/address-form.component.html
+++ b/feature-libs/user/profile/components/address-book/address-form/address-form.component.html
@@ -80,9 +80,12 @@
         type="text"
         placeholder="{{ 'addressForm.firstName.placeholder' | cxTranslate }}"
         formControlName="firstName"
+        [attr.aria-describedby]="'firstNameError'"
       />
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="firstNameError"
+        aria-live="off"
         [translationParams]="{
           label: 'addressForm.firstName.label' | cxTranslate,
         }"
@@ -106,9 +109,12 @@
         class="form-control"
         placeholder="{{ 'addressForm.lastName.placeholder' | cxTranslate }}"
         formControlName="lastName"
+        [attr.aria-describedby]="'lastNameError'"
       />
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="lastNameError"
+        aria-live="off"
         [translationParams]="{
           label: 'addressForm.lastName.label' | cxTranslate,
         }"
@@ -132,9 +138,12 @@
         class="form-control"
         placeholder="{{ 'addressForm.streetAddress' | cxTranslate }}"
         formControlName="line1"
+        [attr.aria-describedby]="'line1Error'"
       />
       <cx-form-errors
         *cxFeature="'formErrorsDescriptiveMessages'"
+        id="line1Error"
+        aria-live="off"
         [translationParams]="{
           label: 'addressForm.address1' | cxTranslate,
         }"
@@ -172,9 +181,12 @@
           class="form-control"
           placeholder="{{ 'addressForm.city.placeholder' | cxTranslate }}"
           formControlName="town"
+          [attr.aria-describedby]="'townError'"
         />
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="townError"
+          aria-live="off"
           [translationParams]="{
             label: 'addressForm.city.label' | cxTranslate,
           }"
@@ -198,9 +210,12 @@
           class="form-control"
           placeholder="{{ 'addressForm.zipCode.placeholder' | cxTranslate }}"
           formControlName="postalCode"
+          [attr.aria-describedby]="'postalCodeError'"
         />
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="postalCodeError"
+          aria-live="off"
           [translationParams]="{
             label: 'addressForm.zipCode.label' | cxTranslate,
           }"
diff --git a/feature-libs/user/profile/components/forgot-password/forgot-password.component.html b/feature-libs/user/profile/components/forgot-password/forgot-password.component.html
index 397f5774949..7da903f168a 100644
--- a/feature-libs/user/profile/components/forgot-password/forgot-password.component.html
+++ b/feature-libs/user/profile/components/forgot-password/forgot-password.component.html
@@ -23,11 +23,14 @@
         'forgottenPassword.emailAddress.placeholder' | cxTranslate
       }}"
       formControlName="userEmail"
+      [attr.aria-describedby]="'userEmailError'"
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="userEmailError"
+      aria-live="off"
       [translationParams]="{
         label: 'forgottenPassword.emailAddress.label' | cxTranslate,
       }"
diff --git a/feature-libs/user/profile/components/register/register.component.html b/feature-libs/user/profile/components/register/register.component.html
index e931a943f37..5a5fb60fa1b 100644
--- a/feature-libs/user/profile/components/register/register.component.html
+++ b/feature-libs/user/profile/components/register/register.component.html
@@ -50,11 +50,14 @@
                   'register.firstName.placeholder' | cxTranslate
                 }}"
                 formControlName="firstName"
+                [attr.aria-describedby]="'firstNameError'"
               />
 
               <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
               <cx-form-errors
                 *cxFeature="'formErrorsDescriptiveMessages'"
+                id="firstNameError"
+                aria-live="off"
                 [translationParams]="{
                   label: 'register.firstName.label' | cxTranslate,
                 }"
@@ -83,11 +86,14 @@
                   'register.lastName.placeholder' | cxTranslate
                 }}"
                 formControlName="lastName"
+                [attr.aria-describedby]="'lastNameError'"
               />
 
               <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
               <cx-form-errors
                 *cxFeature="'formErrorsDescriptiveMessages'"
+                id="lastNameError"
+                aria-live="off"
                 [translationParams]="{
                   label: 'register.lastName.label' | cxTranslate,
                 }"
@@ -116,11 +122,14 @@
                   'register.emailAddress.placeholder' | cxTranslate
                 }}"
                 formControlName="email"
+                [attr.aria-describedby]="'emailError'"
               />
 
               <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
               <cx-form-errors
                 *cxFeature="'formErrorsDescriptiveMessages'"
+                id="emailError"
+                aria-live="off"
                 [translationParams]="{
                   label: 'register.emailAddress.label' | cxTranslate,
                 }"
@@ -193,12 +202,15 @@
                 [attr.aria-label]="
                   'register.confirmPassword.placeholder' | cxTranslate
                 "
+                [attr.aria-describedby]="'passwordconfError'"
                 cxPasswordVisibilitySwitch
               />
 
               <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
               <cx-form-errors
                 *cxFeature="'formErrorsDescriptiveMessages'"
+                id="passwordconfError"
+                aria-live="off"
                 [translationParams]="{
                   label: 'register.confirmPassword.label' | cxTranslate,
                 }"
@@ -264,6 +276,7 @@
                   type="checkbox"
                   name="termsandconditions"
                   formControlName="termsandconditions"
+                  [attr.aria-describedby]="'termsandconditionsError'"
                 />
                 <span class="form-check-label">
                   {{ 'register.confirmThatRead' | cxTranslate }}
@@ -282,6 +295,8 @@
                 <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
                 <cx-form-errors
                   *cxFeature="'formErrorsDescriptiveMessages'"
+                  id="termsandconditionsError"
+                  aria-live="off"
                   [translationParams]="{
                     label: 'register.termsAndConditions' | cxTranslate,
                   }"
diff --git a/feature-libs/user/profile/components/reset-password/reset-password.component.html b/feature-libs/user/profile/components/reset-password/reset-password.component.html
index cffd8d1ed7b..591951901cd 100644
--- a/feature-libs/user/profile/components/reset-password/reset-password.component.html
+++ b/feature-libs/user/profile/components/reset-password/reset-password.component.html
@@ -20,12 +20,15 @@
       placeholder="{{ 'register.password.placeholder' | cxTranslate }}"
       formControlName="password"
       [attr.aria-label]="'register.password.placeholder' | cxTranslate"
+      [attr.aria-describedby]="'passwordError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="passwordError"
+      aria-live="off"
       [translationParams]="{
         label: 'register.newPassword' | cxTranslate,
       }"
@@ -50,12 +53,15 @@
       placeholder="{{ 'register.confirmPassword.placeholder' | cxTranslate }}"
       formControlName="passwordConfirm"
       [attr.aria-label]="'register.confirmPassword.placeholder' | cxTranslate"
+      [attr.aria-describedby]="'passwordConfirmError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="passwordConfirmError"
+      aria-live="off"
       [translationParams]="{
         label: 'register.passwordMinRequirements' | cxTranslate,
       }"
diff --git a/feature-libs/user/profile/components/update-email/my-account-v2-email.component.html b/feature-libs/user/profile/components/update-email/my-account-v2-email.component.html
index 0a0c6f3ee3b..a90a9ca4f28 100644
--- a/feature-libs/user/profile/components/update-email/my-account-v2-email.component.html
+++ b/feature-libs/user/profile/components/update-email/my-account-v2-email.component.html
@@ -55,11 +55,14 @@
           formControlName="email"
           placeholder="{{ 'myAccountV2Email.emailPlaceHolder' | cxTranslate }}"
           class="form-control"
+          [attr.aria-describedby]="'emailError'"
         />
 
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="emailError"
+          aria-live="off"
           [translationParams]="{
             label: 'updateEmailForm.newEmailAddress.label' | cxTranslate,
           }"
@@ -83,11 +86,14 @@
           formControlName="confirmEmail"
           placeholder="{{ 'myAccountV2Email.emailPlaceHolder' | cxTranslate }}"
           class="form-control"
+          [attr.aria-describedby]="'confirmEmailError'"
         />
 
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="confirmEmailError"
+          aria-live="off"
           [translationParams]="{
             label: 'updateEmailForm.confirmNewEmailAddress.label' | cxTranslate,
           }"
@@ -117,12 +123,15 @@
           [attr.aria-label]="
             'myAccountV2Email.passwordPlaceHolder' | cxTranslate
           "
+          [attr.aria-describedby]="'passwordError'"
           cxPasswordVisibilitySwitch
         />
 
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="passwordError"
+          aria-live="off"
           [translationParams]="{
             label: 'updateEmailForm.password.label' | cxTranslate,
           }"
diff --git a/feature-libs/user/profile/components/update-email/update-email.component.html b/feature-libs/user/profile/components/update-email/update-email.component.html
index 8c4ce199424..c05b3e47b11 100644
--- a/feature-libs/user/profile/components/update-email/update-email.component.html
+++ b/feature-libs/user/profile/components/update-email/update-email.component.html
@@ -17,12 +17,15 @@
       placeholder="{{
         'updateEmailForm.newEmailAddress.placeholder' | cxTranslate
       }}"
+      [attr.aria-describedby]="'emailError'"
       class="form-control"
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="emailError"
+      aria-live="off"
       [translationParams]="{
         label: 'updateEmailForm.newEmailAddress.label' | cxTranslate,
       }"
@@ -48,12 +51,15 @@
       placeholder="{{
         'updateEmailForm.confirmNewEmailAddress.placeholder' | cxTranslate
       }}"
+      [attr.aria-describedby]="'confirmEmailError'"
       class="form-control"
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="confirmEmailError"
+      aria-live="off"
       [translationParams]="{
         label: 'updateEmailForm.confirmNewEmailAddress.label' | cxTranslate,
       }"
@@ -80,12 +86,15 @@
       class="form-control"
       autocomplete="new-password"
       [attr.aria-label]="'updateEmailForm.password.placeholder' | cxTranslate"
+      [attr.aria-describedby]="'passwordError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="passwordError"
+      aria-live="off"
       [translationParams]="{
         label: 'updateEmailForm.password.label' | cxTranslate,
       }"
diff --git a/feature-libs/user/profile/components/update-password/my-account-v2-password.component.html b/feature-libs/user/profile/components/update-password/my-account-v2-password.component.html
index cb456940bb5..039fc6cfeda 100644
--- a/feature-libs/user/profile/components/update-password/my-account-v2-password.component.html
+++ b/feature-libs/user/profile/components/update-password/my-account-v2-password.component.html
@@ -30,11 +30,14 @@
       [attr.aria-label]="
         'myAccountV2PasswordForm.oldPassword.placeholder' | cxTranslate
       "
+      [attr.aria-describedby]="'oldPasswordError'"
       cxPasswordVisibilitySwitch
     />
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="oldPasswordError"
+      aria-live="off"
       [translationParams]="{
         label: 'updatePasswordForm.oldPassword.label' | cxTranslate,
       }"
@@ -64,12 +67,15 @@
       [attr.aria-label]="
         'myAccountV2PasswordForm.newPassword.placeholder' | cxTranslate
       "
+      [attr.aria-describedby]="'newPasswordError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="newPasswordError"
+      aria-live="off"
       [translationParams]="{
         label: 'updatePasswordForm.newPassword.label' | cxTranslate,
       }"
diff --git a/feature-libs/user/profile/components/update-password/update-password.component.html b/feature-libs/user/profile/components/update-password/update-password.component.html
index 6feebaea536..66d57b80510 100644
--- a/feature-libs/user/profile/components/update-password/update-password.component.html
+++ b/feature-libs/user/profile/components/update-password/update-password.component.html
@@ -21,12 +21,15 @@
       [attr.aria-label]="
         'updatePasswordForm.oldPassword.placeholder' | cxTranslate
       "
+      [attr.aria-describedby]="'oldPasswordError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="oldPasswordError"
+      aria-live="off"
       [translationParams]="{
         label: 'updatePasswordForm.oldPassword.label' | cxTranslate,
       }"
@@ -56,6 +59,7 @@
       [attr.aria-label]="
         'updatePasswordForm.newPassword.placeholder' | cxTranslate
       "
+      [attr.aria-describedby]="'newPasswordError'"
       aria-describedby="password-input-hint"
       cxPasswordVisibilitySwitch
     />
@@ -63,6 +67,8 @@
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="newPasswordError"
+      aria-live="off"
       [translationParams]="{
         label: 'updatePasswordForm.newPassword.label' | cxTranslate,
       }"
@@ -92,12 +98,15 @@
       [attr.aria-label]="
         'updatePasswordForm.confirmPassword.placeholder' | cxTranslate
       "
+      [attr.aria-describedby]="'newPasswordConfirmError'"
       cxPasswordVisibilitySwitch
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="newPasswordConfirmError"
+      aria-live="off"
       [translationParams]="{
         label: 'updatePasswordForm.confirmPassword.label' | cxTranslate,
       }"
diff --git a/feature-libs/user/profile/components/update-profile/my-account-v2-profile.component.html b/feature-libs/user/profile/components/update-profile/my-account-v2-profile.component.html
index 3a4adc5eb58..35c6183ba55 100644
--- a/feature-libs/user/profile/components/update-profile/my-account-v2-profile.component.html
+++ b/feature-libs/user/profile/components/update-profile/my-account-v2-profile.component.html
@@ -69,10 +69,13 @@
           class="form-control"
           name="firstName"
           formControlName="firstName"
+          [attr.aria-describedby]="'firstNameError'"
         />
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="firstNameError"
+          aria-live="off"
           [translationParams]="{
             label: 'updateProfileForm.firstName.label' | cxTranslate,
           }"
@@ -95,10 +98,13 @@
           class="form-control"
           name="lastName"
           formControlName="lastName"
+          [attr.aria-describedby]="'lastNameError'"
         />
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="lastNameError"
+          aria-live="off"
           [translationParams]="{
             label: 'updateProfileForm.lastName.label' | cxTranslate,
           }"
@@ -121,11 +127,14 @@
           class="form-control"
           name="customerId"
           formControlName="customerId"
+          [attr.aria-describedby]="'customerIdError'"
           readonly
         />
         <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
         <cx-form-errors
           *cxFeature="'formErrorsDescriptiveMessages'"
+          id="customerIdError"
+          aria-live="off"
           [translationParams]="{
             label: 'updateProfileForm.customerId' | cxTranslate,
           }"
diff --git a/feature-libs/user/profile/components/update-profile/update-profile.component.html b/feature-libs/user/profile/components/update-profile/update-profile.component.html
index 0e10f5b9b87..e5a2fc3a20f 100644
--- a/feature-libs/user/profile/components/update-profile/update-profile.component.html
+++ b/feature-libs/user/profile/components/update-profile/update-profile.component.html
@@ -36,11 +36,14 @@
         'updateProfileForm.firstName.placeholder' | cxTranslate
       }}"
       formControlName="firstName"
+      [attr.aria-describedby]="'firstNameError'"
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="firstNameError"
+      aria-live="off"
       [translationParams]="{
         label: 'updateProfileForm.firstName.label' | cxTranslate,
       }"
@@ -65,11 +68,14 @@
       name="lastName"
       placeholder="{{ 'updateProfileForm.lastName.placeholder' | cxTranslate }}"
       formControlName="lastName"
+      [attr.aria-describedby]="'lastNameError'"
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="lastNameError"
+      aria-live="off"
       [translationParams]="{
         label: 'updateProfileForm.lastName.label' | cxTranslate,
       }"
@@ -92,12 +98,15 @@
       class="form-control"
       name="customerId"
       formControlName="customerId"
+      [attr.aria-describedby]="'customerIdError'"
       readonly
     />
 
     <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
     <cx-form-errors
       *cxFeature="'formErrorsDescriptiveMessages'"
+      id="customerIdError"
+      aria-live="off"
       [translationParams]="{
         label: 'updateProfileForm.customerId' | cxTranslate,
       }"
diff --git a/projects/storefrontlib/cms-components/myaccount/my-coupons/claim-dialog/claim-dialog.component.html b/projects/storefrontlib/cms-components/myaccount/my-coupons/claim-dialog/claim-dialog.component.html
index 1f89d111417..50f862e20d0 100644
--- a/projects/storefrontlib/cms-components/myaccount/my-coupons/claim-dialog/claim-dialog.component.html
+++ b/projects/storefrontlib/cms-components/myaccount/my-coupons/claim-dialog/claim-dialog.component.html
@@ -41,8 +41,11 @@ <h3 id="dialogTitle" class="cx-dialog-title modal-title">
               'myCoupons.claimCouponCode.placeholder' | cxTranslate
             }}"
             class="form-control"
+            [attr.aria-describedby]="'couponCodeError'"
           />
           <cx-form-errors
+            id="couponCodeError"
+            aria-live="off"
             [translationParams]="{
               label: 'myCoupons.claimCouponCode.label' | cxTranslate,
             }"
diff --git a/projects/storefrontlib/cms-components/product/product-tabs/product-reviews/product-reviews.component.html b/projects/storefrontlib/cms-components/product/product-tabs/product-reviews/product-reviews.component.html
index fd679c23476..1debfa71c06 100644
--- a/projects/storefrontlib/cms-components/product/product-tabs/product-reviews/product-reviews.component.html
+++ b/projects/storefrontlib/cms-components/product/product-tabs/product-reviews/product-reviews.component.html
@@ -94,11 +94,14 @@ <h3>{{ 'productReview.overallRating' | cxTranslate }}</h3>
             type="text"
             class="form-control"
             formControlName="title"
+            [attr.aria-describedby]="'titleError'"
           />
 
           <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
           <cx-form-errors
             *cxFeature="'formErrorsDescriptiveMessages'"
+            id="titleError"
+            aria-live="off"
             [translationParams]="{
               label: 'productReview.reviewTitle' | cxTranslate,
             }"
@@ -122,11 +125,14 @@ <h3>{{ 'productReview.overallRating' | cxTranslate }}</h3>
             class="form-control"
             rows="3"
             formControlName="comment"
+            [attr.aria-describedby]="'commentError'"
           ></textarea>
 
           <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
           <cx-form-errors
             *cxFeature="'formErrorsDescriptiveMessages'"
+            id="commentError"
+            aria-live="off"
             [translationParams]="{
               label: 'productReview.writeYourComments' | cxTranslate,
             }"
@@ -150,6 +156,7 @@ <h3>{{ 'productReview.overallRating' | cxTranslate }}</h3>
             type="number"
             formControlName="rating"
             class="rating-input"
+            [attr.aria-describedby]="'ratingError'"
           />
           <cx-star-rating
             tabindex="0"
@@ -161,6 +168,8 @@ <h3>{{ 'productReview.overallRating' | cxTranslate }}</h3>
           <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
           <cx-form-errors
             *cxFeature="'formErrorsDescriptiveMessages'"
+            id="ratingError"
+            aria-live="off"
             [translationParams]="{
               label: 'productReview.rating' | cxTranslate,
             }"
diff --git a/projects/storefrontlib/shared/components/form/date-picker/date-picker.component.html b/projects/storefrontlib/shared/components/form/date-picker/date-picker.component.html
index 6e64febc82b..132c9e0c384 100644
--- a/projects/storefrontlib/shared/components/form/date-picker/date-picker.component.html
+++ b/projects/storefrontlib/shared/components/form/date-picker/date-picker.component.html
@@ -8,11 +8,14 @@
   (change)="change()"
   [placeholder]="placeholder"
   [pattern]="pattern"
+  [attr.aria-describedby]="'controlError'"
 />
 
 <!-- TODO: (CXSPA-7315) Remove feature toggle in the next major -->
 <cx-form-errors
   *cxFeature="'formErrorsDescriptiveMessages'"
+  id="controlError"
+  aria-live="off"
   [control]="control"
   prefix="formErrors.labeled.date"
   fallbackPrefix="formErrors.date"