Merge branch 'develop' into feat/cxspa-8662

SAP · Oct 23, 2024 · 822fad9 · 822fad9
2 parents 3f855f9 + 40dc598
commit 822fad9
Show file tree

Hide file tree

Showing 6 changed files with 29 additions and 20 deletions.
diff --git a/...ypes/multi-selection-image/configurator-attribute-multi-selection-image.component.spec.ts b/...ypes/multi-selection-image/configurator-attribute-multi-selection-image.component.spec.ts
@@ -241,6 +241,7 @@ describe('ConfiguratorAttributeMultiSelectionImageComponent', () => {
     expect(description.nativeElement.innerText).toBe(
       (component.attribute.values ?? [{ description: '' }])[1]?.description
     );
+    infoButton.click(); // hide popover after test again
   });
 
   it('should mark two values as selected', () => {

diff --git a/...es/single-selection-image/configurator-attribute-single-selection-image.component.spec.ts b/...es/single-selection-image/configurator-attribute-single-selection-image.component.spec.ts
@@ -222,6 +222,7 @@ describe('ConfiguratorAttributeSingleSelectionImageComponent', () => {
     expect(description.nativeElement.innerText).toBe(
       (component.attribute.values ?? [{}])[1].description
     );
+    infoButton.click(); // hide popover after test again
   });
 
   it('should init with val3', () => {

diff --git a/...e-libs/product-configurator/rulebased/components/form/configurator-form.component.spec.ts b/...e-libs/product-configurator/rulebased/components/form/configurator-form.component.spec.ts
@@ -31,6 +31,7 @@ import { productConfiguration } from '../../testing/configurator-test-data';
 import { ConfiguratorTestUtils } from '../../testing/configurator-test-utils';
 import { ConfiguratorAttributeHeaderComponent } from '../attribute/header/configurator-attribute-header.component';
 import { ConfiguratorFormComponent } from './configurator-form.component';
+import { KeyboardFocusService } from '@spartacus/storefront';
 
 @Component({
   selector: 'cx-configurator-group',
@@ -258,6 +259,7 @@ let component: ConfiguratorFormComponent;
 let htmlElem: HTMLElement;
 let configExpertModeService: ConfiguratorExpertModeService;
 let hasConfigurationConflictsObservable: Observable<boolean> = EMPTY;
+let keyboardFocusService: KeyboardFocusService;
 
 describe('ConfigurationFormComponent', () => {
   beforeEach(waitForAsync(() => {
@@ -347,6 +349,10 @@ describe('ConfigurationFormComponent', () => {
       LaunchDialogService as Type<LaunchDialogService>
     );
     spyOn(launchDialogService, 'openDialogAndSubscribe').and.callThrough();
+    keyboardFocusService = TestBed.inject(
+      KeyboardFocusService as Type<KeyboardFocusService>
+    );
+    spyOn(keyboardFocusService, 'clear').and.callThrough();
   });
 
   describe('resolve issues navigation', () => {
@@ -421,6 +427,14 @@ describe('ConfigurationFormComponent', () => {
     });
   });
 
+  it('should reset persisted focus when UI is opened without resolve issue mode', () => {
+    routerStateObservable = mockRouterStateWithQueryParams({
+      resolveIssues: 'false',
+    });
+    createComponentWithData();
+    expect(keyboardFocusService.clear).toHaveBeenCalledTimes(1);
+  });
+
   describe('Rendering', () => {
     it('should render ghost view if no data is present', () => {
       createComponentWithoutData();

diff --git a/feature-libs/product-configurator/rulebased/components/form/configurator-form.component.ts b/feature-libs/product-configurator/rulebased/components/form/configurator-form.component.ts
@@ -9,13 +9,18 @@ import {
   Component,
   OnDestroy,
   OnInit,
+  inject,
 } from '@angular/core';
 import { GlobalMessageService, GlobalMessageType } from '@spartacus/core';
 import {
   ConfiguratorRouter,
   ConfiguratorRouterExtractorService,
 } from '@spartacus/product-configurator/common';
-import { LAUNCH_CALLER, LaunchDialogService } from '@spartacus/storefront';
+import {
+  LAUNCH_CALLER,
+  LaunchDialogService,
+  KeyboardFocusService,
+} from '@spartacus/storefront';
 import { Observable, Subscription } from 'rxjs';
 import {
   delay,
@@ -38,6 +43,7 @@ import { ConfiguratorExpertModeService } from '../../core/services/configurator-
 export class ConfiguratorFormComponent implements OnInit, OnDestroy {
   protected subscription = new Subscription();
 
+  protected keyboardFocusService = inject(KeyboardFocusService);
   routerData$: Observable<ConfiguratorRouter.Data> =
     this.configRouterExtractorService.extractRouterData();
 
@@ -157,6 +163,9 @@ export class ConfiguratorFormComponent implements OnInit, OnDestroy {
               );
             }
           });
+      } else {
+        // Clear persisted focus before entering the configurator UI
+        this.keyboardFocusService.clear();
       }
 
       if (routingData.expMode) {

diff --git a/...figurator/rulebased/components/overview-menu/configurator-overview-menu.component.spec.ts b/...figurator/rulebased/components/overview-menu/configurator-overview-menu.component.spec.ts
@@ -124,10 +124,6 @@ describe('ConfigurationOverviewMenuComponent', () => {
     }).compileComponents();
   }));
 
-  afterEach(() => {
-    document.body.removeChild(htmlElem);
-  });
-
   it('should create component', () => {
     initialize();
     expect(component).toBeDefined();
@@ -417,12 +413,6 @@ describe('ConfigurationOverviewMenuComponent', () => {
       initialize();
     });
 
-    afterEach(() => {
-      groups?.forEach((group: any) => {
-        ConfiguratorTestUtils.remove(group);
-      });
-    });
-
     it('should not get menu item to highlight because getElements method return undefined', () => {
       spyOn(configuratorStorefrontUtilsService, 'getElements').and.returnValue(
         undefined
@@ -435,10 +425,7 @@ describe('ConfigurationOverviewMenuComponent', () => {
     it('should not get menu item to highlight because getScrollY method return undefined', () => {
       groups = createElements('div');
 
-      document.querySelectorAll = jasmine
-        .createSpy('div.cx-group')
-        .and.returnValue(groups);
-
+      spyOn(document, 'querySelectorAll').and.returnValue(groups);
       spyOn(configuratorStorefrontUtilsService, 'getElements').and.returnValue(
         groups
       );
@@ -456,10 +443,7 @@ describe('ConfigurationOverviewMenuComponent', () => {
     it('should get menu item to highlight', () => {
       groups = createElements('div');
 
-      document.querySelectorAll = jasmine
-        .createSpy('div.cx-group')
-        .and.returnValue(groups);
-
+      spyOn(document, 'querySelectorAll').and.returnValue(groups);
       spyOn(configuratorStorefrontUtilsService, 'getElements').and.returnValue(
         groups
       );

diff --git a/...t-configurator/rulebased/components/service/configurator-storefront-utils.service.spec.ts b/...t-configurator/rulebased/components/service/configurator-storefront-utils.service.spec.ts
@@ -609,7 +609,7 @@ describe('ConfiguratorStorefrontUtilsService', () => {
       spyOn(windowRef, 'isBrowser').and.returnValue(true);
       const elements: Array<HTMLElement> = createElements('section', 10);
 
-      asSpy(windowRef.document.querySelectorAll).and.returnValue(<any>elements);
+      spyOn(document, 'querySelectorAll').and.returnValue(<any>elements);
 
       const htmlElements = classUnderTest.getElements('section');