Merge branch 'develop' into feat/CB2-10920

src/app/features/test-records/create/create-test-records-routing.module.ts

@@ -65,6 +65,12 @@ const routes: Routes = [
  },
  ],
  },
+ {
+ path: 'requiredStandard/:requiredStandardIndex',
+ component: RequiredStandardComponent,
+ data: { title: 'Required Standard', roles: Roles.TestResultCreateContingency, isEditing: true },
+ canActivate: [RoleGuard],
+ },
  {
  path: 'selectRequiredStandard',
  component: TestRouterOutletComponent,
@@ -77,7 +83,7 @@ const routes: Routes = [
  canActivate: [RoleGuard],
  },
  {
- path: ':ref',
+ path: ':inspectionType/:ref',
  component: RequiredStandardComponent,
  data: { title: 'Required Standard', roles: Roles.TestResultCreateContingency, isEditing: true },
  canActivate: [RoleGuard],

src/app/forms/components/required-standard-select/required-standard-select.component.html

@@ -38,11 +38,11 @@ <h1 class="govuk-heading-l">Select a required standard</h1>
  <li *ngFor="let rs of selectedSection?.requiredStandards; let i = index">
  <a
  [id]="'rs-list-item-' + i"
- class="browse__link browse__link--inactive"
- [ngClass]="{ 'browse__link--active': rs === selectedRequiredStandard }"
+ class="browse__normal-link browse__normal-link--inactive"
+ [ngClass]="{ 'browse__normal-link--active': rs === selectedRequiredStandard }"
  (click)="handleSelect(rs, types.RequiredStandard)"
  >
- {{ rs.refCalculation }} {{ rs.requiredStandard }} <span [ngClass]="{ 'list__item--more': true }"></span>
+ {{ rs.refCalculation }} {{ rs.requiredStandard }}
  </a>
  </li>
  </ol>

src/app/forms/components/required-standard-select/required-standard-select.component.scss

@@ -61,18 +61,19 @@ a {
 
 .browse__normal-link {
  font-family: 'GDS Transport', arial, sans-serif;
- text-decoration: underline;
- text-underline-offset: 0.1em;
- text-decoration-thickness: max(1px, 0.0925rem);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
- font-weight: 700;
- font-size: 14px;
- font-size: 0.875rem;
- line-height: 1.1428571429;
+ text-decoration: underline;
+ text-decoration-thickness: max(1px, 0.0625rem);
+ text-underline-offset: 0.1em;
+ font-weight: 400;
+ font-size: 16px;
+ font-size: 1rem;
+ line-height: 1.25;
+ position: relative;
  display: block;
- padding: 5px 30px 5px 15px;
- color: $govuk-brand-colour;
+ padding: 15px 25px 20px 15px;
+ color: $govuk-link-colour;
 }
 .browse__normal:hover {
  color: $govuk-link-hover-colour;

src/app/forms/components/required-standard-select/required-standard-select.component.spec.ts

@@ -81,7 +81,7 @@ describe('RequiredStandardSelectComponent', () => {
  component.handleSelect({ refCalculation: '1.2' } as unknown as RequiredStandard, Types.RequiredStandard);
 
  expect(spy).toHaveBeenCalled();
- expect(spy).toHaveBeenCalledWith(['1.2'], expect.anything());
+ expect(spy).toHaveBeenCalledWith(['normal/1.2'], expect.anything());
  expect(component.selectedRequiredStandard).toStrictEqual({ refCalculation: '1.2' });
  });
  it('should error when I try call it with another type', () => {

src/app/forms/components/required-standard-select/required-standard-select.component.ts

@@ -69,7 +69,7 @@ export class RequiredStandardSelectComponent implements OnInit, OnDestroy {
  case Types.RequiredStandard:
  this.selectedRequiredStandard = selected as RequiredStandard;
  if (this.selectedRequiredStandard) {
- void this.router.navigate([this.selectedRequiredStandard.refCalculation], {
+ void this.router.navigate([`${this.selectedInspectionType}/${this.selectedRequiredStandard.refCalculation}`], {
  relativeTo: this.route,
  queryParamsHandling: 'merge',
  });

src/app/forms/custom-sections/required-standard/required-standard.component.html

@@ -1 +1,46 @@
-<h1>I am a required standard</h1>
+<ng-template [ngTemplateOutlet]="isEditing ? editRs : viewRs" [ngTemplateOutletContext]="{ data: form }"></ng-template>
+
+<ng-template #viewRs let-data="data">
+ <h1>View me</h1>
+</ng-template>
+
+<ng-template #editRs let-data="data">
+ <ng-container *ngIf="requiredStandard">
+ <div class="govuk-grid-row govuk-!-margin-bottom-5">
+ <div class="govuk-grid-column-two-thirds">
+ <h1 class="govuk-heading-l">Required Standard Details</h1>
+ <span class="govuk-caption-m">{{ requiredStandard.sectionDescription }}</span>
+ <h2 class="govuk-heading-s">{{ requiredStandard.refCalculation }} - {{ requiredStandard.sectionDescription }}: {{ requiredStandard.requiredStandard }}</h2>
+ <app-tag *ngIf="requiredStandard.prs" id="prs-display" [type]="'blue'">PRS</app-tag>
+ </div>
+ </div>
+ <div class="govuk-grid-row">
+ <div class="govuk-grid-column-full">
+ <ng-container [formGroup]="form">
+ <app-text-area name="additionalNotes" label="Additional Notes" formControlName="additionalNotes"></app-text-area>
+
+ <div class="govuk-form-group">
+ <div class="govuk-checkboxes" data-module="govuk-checkboxes">
+ <div class="govuk-checkboxes__item">
+ <input class="govuk-checkboxes__input" id="prs" type="checkbox" [checked]="requiredStandard.prs" (change)="toggleRsPrsField()" />
+ <label class="govuk-label govuk-checkboxes__label" for="prs"> Defect repaired during test</label>
+ </div>
+ </div>
+ </div>
+
+ <div class="govuk-grid-row">
+ <div class="govuk-grid-column-two-thirds">
+ <app-button-group>
+ <app-button id="confirm-requierdStandard" (clicked)="handleSubmit()">Confirm</app-button>
+ <app-button *ngIf="index || index === 0" id="remove-requiredStandard" design="warning" (clicked)="handleRemove()"
+ >Remove Required Standard</app-button
+ >
+ <app-button id="remove-nav-back" design="link" (clicked)="navigateBack()">Cancel</app-button>
+ </app-button-group>
+ </div>
+ </div>
+ </ng-container>
+ </div>
+ </div>
+ </ng-container>
+</ng-template>

src/app/forms/custom-sections/required-standard/required-standard.component.spec.ts

@@ -0,0 +1,188 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { Router } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import { DynamicFormService } from '@forms/services/dynamic-form.service';
+import { CustomFormGroup, FormNodeTypes } from '@forms/services/dynamic-form.types';
+import { mockTestResult } from '@mocks/mock-test-result';
+import { INSPECTION_TYPE, TestResultRequiredStandard } from '@models/test-results/test-result-required-standard.model';
+import { MockStore, provideMockStore } from '@ngrx/store/testing';
+import { ResultOfTestService } from '@services/result-of-test/result-of-test.service';
+import { State, initialAppState } from '@store/index';
+import { getRequiredStandardFromTypeAndRef } from '@store/required-standards/selectors/required-standards.selector';
+import { selectRouteParams } from '@store/router/selectors/router.selectors';
+import { testResultInEdit } from '@store/test-records';
+import { RequiredStandardComponent } from './required-standard.component';
+
+describe('RequiredStandardComponent', () => {
+ let component: RequiredStandardComponent;
+ let fixture: ComponentFixture<RequiredStandardComponent>;
+ let router: Router;
+ let store: MockStore<State>;
+ let resultService: ResultOfTestService;
+ let dfs: DynamicFormService;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [FormsModule, ReactiveFormsModule, RouterTestingModule, HttpClientTestingModule],
+ declarations: [RequiredStandardComponent],
+ providers: [DynamicFormService, provideMockStore({ initialState: initialAppState })],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(RequiredStandardComponent);
+ router = TestBed.inject(Router);
+ store = TestBed.inject(MockStore);
+ resultService = TestBed.inject(ResultOfTestService);
+ dfs = TestBed.inject(DynamicFormService);
+ component = fixture.componentInstance;
+ jest.clearAllMocks();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+
+ describe('ngOnInit', () => {
+ it('should init and navigate back if no test result', () => {
+ component.isEditing = true;
+ store.overrideSelector(testResultInEdit, undefined);
+ const spy = jest.spyOn(component, 'navigateBack');
+
+ component.ngOnInit();
+
+ expect(spy).toHaveBeenCalledTimes(1);
+ });
+
+ it('should init and use index to amend the required standard', () => {
+ component.isEditing = true;
+ store.overrideSelector(
+ testResultInEdit,
+ mockTestResult(),
+ );
+ store.overrideSelector(selectRouteParams, { requiredStandardIndex: '0' });
+ component.ngOnInit();
+
+ expect(component.amendingRs).toBeTruthy();
+ expect(component.requiredStandard).toBeDefined();
+ });
+
+ it('should init and get required standard from the store', () => {
+ component.isEditing = true;
+ store.overrideSelector(
+ testResultInEdit,
+ mockTestResult(),
+ );
+ store.overrideSelector(selectRouteParams, { ref: '1.1', inspectionType: 'basic', requiredStandardIndex: undefined });
+
+ store.overrideSelector(
+ getRequiredStandardFromTypeAndRef(INSPECTION_TYPE.BASIC, '1.1'),
+ { sectionNumber: '1' } as unknown as TestResultRequiredStandard,
+ );
+
+ component.ngOnInit();
+
+ expect(component.amendingRs).toBeFalsy();
+ expect(component.requiredStandard).toBeDefined();
+ });
+
+ it('should init and fail to required standard from the store so navigate back', () => {
+ component.isEditing = true;
+ store.overrideSelector(
+ testResultInEdit,
+ mockTestResult(),
+ );
+ store.overrideSelector(selectRouteParams, { ref: '1.1', inspectionType: 'basic', requiredStandardIndex: undefined });
+
+ store.overrideSelector(
+ getRequiredStandardFromTypeAndRef(INSPECTION_TYPE.BASIC, '1.1'),
+ undefined,
+ );
+ const spy = jest.spyOn(component, 'navigateBack');
+
+ component.ngOnInit();
+
+ expect(spy).toHaveBeenCalledTimes(1);
+ });
+ });
+
+ describe('navigateBack', () => {
+ it('should navigate back two levels if in amend mode', () => {
+ jest.spyOn(resultService, 'updateResultOfTestRequiredStandards').getMockImplementation();
+ component.amendingRs = true;
+ const spy = jest.spyOn(router, 'navigate');
+
+ component.navigateBack();
+
+ expect(spy).toHaveBeenCalledWith(['../../'], expect.anything());
+
+ });
+
+ it('should navigate back three levels if not in amend mode', () => {
+ jest.spyOn(resultService, 'updateResultOfTestRequiredStandards').getMockImplementation();
+ component.amendingRs = false;
+ const spy = jest.spyOn(router, 'navigate');
+
+ component.navigateBack();
+
+ expect(spy).toHaveBeenCalledWith(['../../../'], expect.anything());
+ });
+ });
+
+ describe('toggleRsPrsField', () => {
+ it('should error if there is no required standard', () => {
+ component.requiredStandard = undefined;
+
+ const res = component.toggleRsPrsField();
+
+ expect(res).toBeUndefined();
+ });
+ it('should flip bool value of prs', () => {
+ component.requiredStandard = { prs: true } as unknown as TestResultRequiredStandard;
+
+ component.toggleRsPrsField();
+
+ expect(component.requiredStandard).toStrictEqual({ prs: false });
+ });
+ });
+
+ describe('handleSubmit', () => {
+ beforeEach(() => {
+ component.form = dfs.createForm({
+ name: 'test section',
+ type: FormNodeTypes.SECTION,
+ children: [{ name: 'prs', type: FormNodeTypes.CONTROL }],
+ }, { prs: false }) as CustomFormGroup;
+ });
+ it('should return if the form is invalid', () => {
+ jest.spyOn(DynamicFormService, 'validate').mockImplementation();
+ component.form.controls['prs'].setErrors({ incorrect: true });
+
+ const res = component.handleSubmit();
+
+ expect(res).toBeUndefined();
+ });
+
+ it('should call update RS if in amend mode', () => {
+ jest.spyOn(DynamicFormService, 'validate').mockImplementation();
+ component.index = 1;
+ const dispatchSpy = jest.spyOn(store, 'dispatch');
+
+ component.handleSubmit();
+
+ expect(dispatchSpy).toHaveBeenCalledWith(expect.objectContaining({ type: '[test-results] update required standard' }));
+ });
+
+ it('should call create RS if not in amend mode', () => {
+ jest.spyOn(DynamicFormService, 'validate').mockImplementation();
+ const dispatchSpy = jest.spyOn(store, 'dispatch');
+
+ component.handleSubmit();
+
+ expect(dispatchSpy).toHaveBeenCalledWith(expect.objectContaining({ type: '[test-results] create required standard' }));
+ });
+ });
+
+});