Merge branch 'develop' into develop-next-major

SAP · Jan 17, 2025 · de9e362 · de9e362
2 parents 5b8e16c + c25a38c
commit de9e362
Show file tree

Hide file tree

Showing 264 changed files with 4,578 additions and 1,047 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -225,7 +225,7 @@ jobs:
     steps:
       - uses: actions/checkout@v4
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
       - name: Cache node_modules
@@ -277,7 +277,7 @@ jobs:
       - name: Notify the slack channel of when build conclusion failed
         env:
           SLACK_BOT_TOKEN: ${{ secrets.SLACK_TOKEN }}
-        uses: slackapi/slack-github-action@v1.27.0
+        uses: slackapi/slack-github-action@v1.27.1
         with:
           channel-id: ${{ secrets.SLACK_NOTIFICATION_CHANNEL }}
           payload: |

diff --git a/core-libs/setup/package.json b/core-libs/setup/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@spartacus/setup",
-  "version": "2211.32.0-1",
+  "version": "2211.32.0",
   "description": "Includes features that makes Spartacus and it's setup easier and streamlined.",
   "keywords": [
     "spartacus",
@@ -16,15 +16,15 @@
     "test": "../../node_modules/.bin/jest --config ./jest.config.js"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.8.1"
   },
   "peerDependencies": {
     "@angular/core": "^18.2.9",
     "@angular/ssr": "^18.2.9",
-    "@spartacus/cart": "2211.32.0-1",
-    "@spartacus/core": "2211.32.0-1",
-    "@spartacus/order": "2211.32.0-1",
-    "@spartacus/user": "2211.32.0-1"
+    "@spartacus/cart": "2211.32.0",
+    "@spartacus/core": "2211.32.0",
+    "@spartacus/order": "2211.32.0",
+    "@spartacus/user": "2211.32.0"
   },
   "optionalDependencies": {
     "@angular/platform-server": "^18.2.9",

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
@@ -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
@@ -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/csagent-login-form/csagent-login-form.component.ts b/feature-libs/asm/components/csagent-login-form/csagent-login-form.component.ts
@@ -26,7 +26,7 @@ export class CSAgentLoginFormComponent implements OnInit {
   submitEvent = new EventEmitter<{ userId: string; password: string }>();
 
   constructor(protected fb: UntypedFormBuilder) {
-    useFeatureStyles('a11yPasswordVisibilityBtnValueOverflow');
+    useFeatureStyles('a11yPasswordVisibliltyBtnValueOverflow');
     useFeatureStyles('a11yTextSpacingAdjustments');
   }
 

diff --git 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/asm/package.json b/feature-libs/asm/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@spartacus/asm",
-  "version": "2211.32.0-1",
+  "version": "2211.32.0",
   "description": "ASM feature library for Spartacus",
   "keywords": [
     "spartacus",
@@ -22,7 +22,7 @@
     "test:schematics": "npm --prefix ../../projects/schematics/ run clean && npm run clean:schematics && ../../node_modules/.bin/jest --config ./jest.schematics.config.js"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.8.1"
   },
   "peerDependencies": {
     "@angular-devkit/schematics": "^18.2.9",
@@ -32,14 +32,14 @@
     "@ng-select/ng-select": "^13.9.1",
     "@ngrx/effects": "^18.1.1",
     "@ngrx/store": "^18.1.1",
-    "@spartacus/cart": "2211.32.0-1",
-    "@spartacus/core": "2211.32.0-1",
-    "@spartacus/order": "2211.32.0-1",
-    "@spartacus/schematics": "2211.32.0-1",
-    "@spartacus/storefinder": "2211.32.0-1",
-    "@spartacus/storefront": "2211.32.0-1",
-    "@spartacus/styles": "2211.32.0-1",
-    "@spartacus/user": "2211.32.0-1",
+    "@spartacus/cart": "2211.32.0",
+    "@spartacus/core": "2211.32.0",
+    "@spartacus/order": "2211.32.0",
+    "@spartacus/schematics": "2211.32.0",
+    "@spartacus/storefinder": "2211.32.0",
+    "@spartacus/storefront": "2211.32.0",
+    "@spartacus/styles": "2211.32.0",
+    "@spartacus/user": "2211.32.0",
     "rxjs": "^7.8.0"
   },
   "publishConfig": {

diff --git a/feature-libs/cart/base/components/add-to-cart/add-to-cart.component.html b/feature-libs/cart/base/components/add-to-cart/add-to-cart.component.html
@@ -43,6 +43,7 @@
     "
     type="submit"
     [disabled]="disabled || quantity <= 0 || quantity > maxQuantity"
+    [attr.aria-describedby]="productCode + '_header'"
   >
     <span
       *ngIf="

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
@@ -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/base/components/mini-cart/mini-cart.component.ts b/feature-libs/cart/base/components/mini-cart/mini-cart.component.ts
@@ -6,6 +6,7 @@
 
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { ICON_TYPE } from '@spartacus/storefront';
+import { useFeatureStyles } from '@spartacus/core';
 import { Observable } from 'rxjs';
 import { MiniCartComponentService } from './mini-cart-component.service';
 
@@ -21,5 +22,7 @@ export class MiniCartComponent {
 
   total$: Observable<string> = this.miniCartComponentService.getTotalPrice();
 
-  constructor(protected miniCartComponentService: MiniCartComponentService) {}
+  constructor(protected miniCartComponentService: MiniCartComponentService) {
+    useFeatureStyles('a11yMiniCartFocusOnMobile');
+  }
 }
diff --git a/feature-libs/cart/base/styles/components/_mini-cart.scss b/feature-libs/cart/base/styles/components/_mini-cart.scss
@@ -51,27 +51,21 @@
     }
   }
 
-  @mixin native-high-contrast-fix {
-    @media (forced-colors: active) {
+  @include forFeature('a11yMiniCartFocusOnMobile') {
+    @include media-breakpoint-down(md) {
       a {
-        forced-color-adjust: none;
-        background: LinkText;
-        color: Canvas;
-
-        &:hover {
-          background: LinkText;
-          color: Canvas;
+        &:focus {
+          outline-offset: -4px;
+          outline-color: var(--cx-color-inverse);
+          box-shadow: 0 0 0 2px var(--cx-color-visual-focus) inset;
         }
       }
     }
   }
 
-  @include native-high-contrast-fix;
-
   @include cx-highContrastTheme {
     a {
       color: var(--cx-color-medium);
     }
-    @include native-high-contrast-fix;
   }
 }
diff --git a/...entries-dialog/import-to-new-saved-cart-form/import-to-new-saved-cart-form.component.html b/...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/package.json b/feature-libs/cart/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@spartacus/cart",
-  "version": "2211.32.0-1",
+  "version": "2211.32.0",
   "description": "",
   "keywords": [
     "spartacus",
@@ -26,7 +26,7 @@
     "test:schematics": "npm --prefix ../../projects/schematics/ run clean && npm run clean:schematics && ../../node_modules/.bin/jest --config ./jest.schematics.config.js"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.8.1"
   },
   "peerDependencies": {
     "@angular-devkit/schematics": "^18.2.9",
@@ -37,11 +37,11 @@
     "@ng-select/ng-select": "^13.9.1",
     "@ngrx/effects": "^18.1.1",
     "@ngrx/store": "^18.1.1",
-    "@spartacus/core": "2211.32.0-1",
-    "@spartacus/schematics": "2211.32.0-1",
-    "@spartacus/storefront": "2211.32.0-1",
-    "@spartacus/styles": "2211.32.0-1",
-    "@spartacus/user": "2211.32.0-1",
+    "@spartacus/core": "2211.32.0",
+    "@spartacus/schematics": "2211.32.0",
+    "@spartacus/storefront": "2211.32.0",
+    "@spartacus/styles": "2211.32.0",
+    "@spartacus/user": "2211.32.0",
     "bootstrap": "^4.6.2",
     "rxjs": "^7.8.0"
   },

diff --git a/feature-libs/cart/quick-order/components/quick-order/form/quick-order-form.component.html b/feature-libs/cart/quick-order/components/quick-order/form/quick-order-form.component.html
@@ -71,6 +71,7 @@
         class="quick-order-results-product-container"
       >
         <button
+          *cxFeature="'!a11yQuickOrderSearchListKeyboardNavigation'"
           (blur)="onBlur($event)"
           (mousedown)="add(product, $event)"
           (keydown.arrowdown)="focusNextChild($event)"
@@ -103,6 +104,42 @@
           </span>
           <span class="price">{{ product.price?.formattedValue }}</span>
         </button>
+        <button
+          *cxFeature="'a11yQuickOrderSearchListKeyboardNavigation'"
+          (blur)="onBlur($event)"
+          (mousedown)="add(product, $event)"
+          (keydown.arrowdown)="focusNextChild($event)"
+          (keydown.arrowup)="focusPreviousChild($event)"
+          (keydown.enter)="add(product, $event)"
+          (keydown.escape)="clear($event)"
+          (keydown.tab)="close()"
+          (keydown.shift.tab)="close()"
+          [class.has-media]="
+            config?.quickOrder?.searchForm?.displayProductImages
+          "
+          class="quick-order-results-product"
+          role="option"
+        >
+          <cx-media
+            *ngIf="config?.quickOrder?.searchForm?.displayProductImages"
+            [alt]="product.name"
+            [container]="product.images?.PRIMARY"
+            class="media"
+            format="thumbnail"
+            role="presentation"
+          ></cx-media>
+          <div class="name" [innerHTML]="product.name"></div>
+          <span class="id">
+            {{
+              'quickOrderForm.id'
+                | cxTranslate
+                  : {
+                      id: product.code,
+                    }
+            }}
+          </span>
+          <span class="price">{{ product.price?.formattedValue }}</span>
+        </button>
       </li>
     </ul>
-Original file line number
+Diff line change
@@ Expand Up / @@ -43,6 +43,7 @@ @@
         "
         type="submit"
         [disabled]="disabled || quantity <= 0 || quantity > maxQuantity"
+        [attr.aria-describedby]="productCode + '_header'"
       >
         <span
           *ngIf="
@@ Expand Down @@