noc back button fix and qm qualifying question style fix (#4167)

* noc back button fix and qm qualifying question style fix * Update yarn.lock * Update yarn.lock * toolkit version updated --------- Co-authored-by: RiteshHMCTS <[email protected]> Co-authored-by: Ritesh Dsouza <[email protected]>
hmcts · Feb 5, 2025 · de2fdad · de2fdad
1 parent f1a433c
commit de2fdad
Show file tree

Hide file tree

Showing 4 changed files with 59 additions and 13 deletions.
diff --git a/package.json b/package.json
@@ -87,7 +87,7 @@
     "@cucumber/cucumber": "^10.8.0",
     "@edium/fsm": "^2.1.2",
     "@faker-js/faker": "^9.2.0",
-    "@hmcts/ccd-case-ui-toolkit": "7.1.32",
+    "@hmcts/ccd-case-ui-toolkit": "7.1.34",
     "@hmcts/ccpay-web-component": "6.2.1",
     "@hmcts/frontend": "0.0.50-alpha",
     "@hmcts/media-viewer": "4.0.10",

diff --git a/src/noc/containers/noc-home/noc-home.component.spec.ts b/src/noc/containers/noc-home/noc-home.component.spec.ts
@@ -2,6 +2,7 @@ import { NO_ERRORS_SCHEMA, Pipe, PipeTransform } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ReactiveFormsModule } from '@angular/forms';
 import { Router } from '@angular/router';
+import { Location } from '@angular/common';
 import { RouterTestingModule } from '@angular/router/testing';
 import { Store } from '@ngrx/store';
 import { provideMockStore } from '@ngrx/store/testing';
@@ -33,6 +34,8 @@ describe('NocHomeComponent', () => {
 
   const loggerServiceMock = jasmine.createSpyObj('loggerService', ['error']);
 
+  const locationMock = jasmine.createSpyObj('Location', ['back']);
+
   beforeEach(() => {
     TestBed.configureTestingModule({
       imports: [
@@ -50,7 +53,8 @@ describe('NocHomeComponent', () => {
       providers: [
         provideMockStore(),
         { provide: Router, useValue: routerMock },
-        { provide: LoggerService, useValue: loggerServiceMock }
+        { provide: LoggerService, useValue: loggerServiceMock },
+        { provide: Location, useValue: locationMock }
       ]
     }).compileComponents();
 
@@ -89,11 +93,46 @@ describe('NocHomeComponent', () => {
       expect(expected).toBeFalsy();
     });
 
-    it('should navigate to home page when click back button if on start page', () => {
-      routerMock.navigateByUrl.and.returnValue(Promise.resolve(true));
+    it('should navigate back on BACK event and START state', () => {
+      component.navigationHandler(NocNavigationEvent.BACK);
+      component.nocNavigationCurrentState = NocState.START;
+
+      expect(locationMock.back).toHaveBeenCalled();
+      expect(loggerServiceMock.error).not.toHaveBeenCalled();
+      expect(routerMock.navigateByUrl).not.toHaveBeenCalled();
+    });
+
+    it('should navigate to fallback route if Location back fails', () => {
       component.nocNavigationCurrentState = NocState.START;
+      locationMock.back.and.throwError('Back navigation failed');
+      routerMock.navigateByUrl.and.returnValue(Promise.resolve(true));
+
       component.navigationHandler(NocNavigationEvent.BACK);
-      expect(routerMock.navigateByUrl).toHaveBeenCalled();
+
+      expect(locationMock.back).toHaveBeenCalled();
+      expect(loggerServiceMock.error).toHaveBeenCalledWith(
+        'Error navigating back, trying fallback route.',
+        jasmine.any(Error)
+      );
+      expect(routerMock.navigateByUrl).toHaveBeenCalledWith('');
+    });
+
+    it('should log an error if fallback route navigation fails', async () => {
+      component.nocNavigationCurrentState = NocState.START;
+      locationMock.back.and.throwError('Back navigation failed');
+      routerMock.navigateByUrl.and.returnValue(Promise.reject('Navigation failed'));
+
+      await component.navigationHandler(NocNavigationEvent.BACK);
+
+      expect(locationMock.back).toHaveBeenCalled();
+      expect(loggerServiceMock.error).toHaveBeenCalledWith(
+        'Error navigating back, trying fallback route.',
+        jasmine.any(Error)
+      );
+      expect(loggerServiceMock.error).toHaveBeenCalledWith(
+        'Error navigating to \'\' ',
+        'Navigation failed'
+      );
     });
 
     it('should navigate to case ref page when click back button if on question page', () => {

diff --git a/src/noc/containers/noc-home/noc-home.component.ts b/src/noc/containers/noc-home/noc-home.component.ts
@@ -1,5 +1,6 @@
 import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core';
 import { Router } from '@angular/router';
+import { Location } from '@angular/common';
 import { select, Store } from '@ngrx/store';
 import { Subscription } from 'rxjs';
 import { caseRefVisibilityStates, checkAnswerVisibilityStates, nocErrorVisibilityStates, nocSubmitSuccessStates, qAndAVisibilityStates } from '../../constants';
@@ -40,6 +41,7 @@ export class NocHomeComponent implements OnInit, OnDestroy {
   constructor(
     private readonly store: Store<fromFeature.State>,
     private readonly router: Router,
+    private readonly location: Location,
     private readonly loggerService: LoggerService,
   ) {}
 
@@ -65,9 +67,14 @@ export class NocHomeComponent implements OnInit, OnDestroy {
         switch (this.nocNavigationCurrentState) {
           case NocState.START:
           case NocState.CASE_REF_VALIDATION_FAILURE:
-            this.router.navigateByUrl('').catch((err) => {
-              this.loggerService.error('Error navigating to \'\' ', err);
-            });
+            try {
+              this.location.back();
+            } catch (err) {
+              this.loggerService.error('Error navigating back, trying fallback route.', err);
+              this.router.navigateByUrl('').catch((err) => {
+                this.loggerService.error('Error navigating to \'\' ', err);
+              });
+            }
             break;
           case NocState.QUESTION:
           case NocState.CASE_REF_SUBMISSION_FAILURE:

diff --git a/yarn.lock b/yarn.lock
@@ -3455,12 +3455,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@hmcts/ccd-case-ui-toolkit@npm:7.1.32":
-  version: 7.1.32
-  resolution: "@hmcts/ccd-case-ui-toolkit@npm:7.1.32"
+"@hmcts/ccd-case-ui-toolkit@npm:7.1.34":
+  version: 7.1.34
+  resolution: "@hmcts/ccd-case-ui-toolkit@npm:7.1.34"
   dependencies:
     tslib: "npm:^2.3.0"
-  checksum: 10/14449020dca2e95758fd9f742f4d8151be50388c65ea5df66b7664423421f019ffe8dd151232c0fce7cb68a23096bec6e5e11370c33fe2e85d8ebd38ff479270
+  checksum: 10/64802c3f4821e01feacdfa245a8e807c107ac224d048c639ce1926fc47c993427a945c4f0c89d90015b809de8086a4710d116dc96095ae5957588820d3a8dad2
   languageName: node
   linkType: hard
 
@@ -22345,7 +22345,7 @@ __metadata:
     "@cucumber/cucumber": "npm:^10.8.0"
     "@edium/fsm": "npm:^2.1.2"
     "@faker-js/faker": "npm:^9.2.0"
-    "@hmcts/ccd-case-ui-toolkit": "npm:7.1.32"
+    "@hmcts/ccd-case-ui-toolkit": "npm:7.1.34"
     "@hmcts/ccpay-web-component": "npm:6.2.1"
     "@hmcts/frontend": "npm:0.0.50-alpha"
     "@hmcts/media-viewer": "npm:4.0.10"