test(zaak-create.component): added component tests (#2380)

added tests

Solves PZ-4875

src/main/app/src/app/zaken/zaak-create/zaak-create.component.spec.ts

@@ -0,0 +1,127 @@
+/*
+ * SPDX-FileCopyrightText: 2024 Lifely
+ * SPDX-License-Identifier: EUPL-1.2+
+ *
+ */
+
+import { HttpClientTestingModule } from "@angular/common/http/testing";
+import { TestBed } from "@angular/core/testing";
+import { MatSidenavModule } from "@angular/material/sidenav";
+import { provideAnimations } from "@angular/platform-browser/animations";
+import { RouterModule } from "@angular/router";
+import { TranslateModule } from "@ngx-translate/core";
+import { of } from "rxjs";
+import { CaseDefinition } from "../../admin/model/case-definition";
+import { ReferentieTabelService } from "../../admin/referentie-tabel.service";
+import { UtilService } from "../../core/service/util.service";
+import { IdentityService } from "../../identity/identity.service";
+import { KlantenService } from "../../klanten/klanten.service";
+import { NavigationService } from "../../shared/navigation/navigation.service";
+import { ZaakStatusmailOptie } from "../model/zaak-statusmail-optie";
+import { Zaaktype } from "../model/zaaktype";
+import { ZakenService } from "../zaken.service";
+import { ZaakCreateComponent } from "./zaak-create.component";
+
+describe(ZaakCreateComponent.name, () => {
+  let component: ZaakCreateComponent;
+
+  let identityService: IdentityService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [ZaakCreateComponent],
+      providers: [
+        ZakenService,
+        NavigationService,
+        KlantenService,
+        ReferentieTabelService,
+        UtilService,
+        IdentityService,
+        provideAnimations(),
+      ],
+      imports: [
+        RouterModule.forRoot([]),
+        TranslateModule.forRoot(),
+        HttpClientTestingModule,
+        MatSidenavModule,
+      ],
+    }).compileComponents();
+
+    const fixture = TestBed.createComponent(ZaakCreateComponent);
+    component = fixture.componentInstance;
+
+    identityService = TestBed.inject(IdentityService);
+    jest
+      .spyOn(identityService, "listGroups")
+      .mockReturnValue(of([{ id: "test-group-id", naam: "test group" }]));
+    jest
+      .spyOn(identityService, "listUsersInGroup")
+      .mockReturnValue(of([{ id: "test-user-id", naam: "test user" }]));
+  });
+
+  describe(
+    ZaakCreateComponent.prototype.getMedewerkerGroupFormField.name,
+    () => {
+      it("should set the medewerker group and name when exist", async () => {
+        await component.ngOnInit();
+
+        const formField = await component.getMedewerkerGroupFormField(
+          "test-group-id",
+          "test-user-id",
+        );
+
+        expect(formField.medewerker.value).toEqual({
+          id: "test-user-id",
+          naam: "test user",
+        });
+        expect(formField.groep.value).toEqual({
+          id: "test-group-id",
+          naam: "test group",
+        });
+      });
+    },
+  );
+
+  describe(ZaakCreateComponent.prototype.zaaktypeGeselecteerd.name, () => {
+    it(`should call ${ZaakCreateComponent.prototype.getMedewerkerGroupFormField.name} with the default behandelaar and groep`, async () => {
+      const getMedewerkerGroupFormField = jest.spyOn(
+        component,
+        "getMedewerkerGroupFormField",
+      );
+      await component.ngOnInit();
+
+      const zaakType = new Zaaktype();
+      zaakType.zaakafhandelparameters = {
+        defaultBehandelaarId: "default-behandelaar",
+        defaultGroepId: "default-group",
+        einddatumGeplandWaarschuwing: 10,
+        zaaktype: zaakType,
+        afrondenMail: ZaakStatusmailOptie.BESCHIKBAAR_AAN,
+        caseDefinition: new CaseDefinition(),
+        creatiedatum: new Date().toJSON(),
+        domein: "test",
+        humanTaskParameters: [],
+        intakeMail: ZaakStatusmailOptie.BESCHIKBAAR_AAN,
+        mailtemplateKoppelingen: [],
+        productaanvraagtype: "",
+        uiterlijkeEinddatumAfdoeningWaarschuwing: 10,
+        valide: true,
+        userEventListenerParameters: [],
+        zaakAfzenders: [],
+        zaakbeeindigParameters: [],
+        smartDocuments: {},
+        zaakNietOntvankelijkResultaattype: {
+          id: "1",
+        },
+      };
+
+      await component.zaaktypeGeselecteerd(zaakType);
+
+      expect(getMedewerkerGroupFormField).toHaveBeenCalledTimes(2); // one for the init
+      expect(getMedewerkerGroupFormField).toHaveBeenCalledWith(
+        zaakType.zaakafhandelparameters.defaultGroepId,
+        zaakType.zaakafhandelparameters.defaultBehandelaarId,
+      );
+    });
+  });
+});

src/main/app/src/app/zaken/zaak-create/zaak-create.component.ts

@@ -9,8 +9,8 @@ import { MatSidenav } from "@angular/material/sidenav";
 import { Router } from "@angular/router";
 import { TranslateService } from "@ngx-translate/core";
 import moment from "moment";
-import { Observable, Subject, of } from "rxjs";
-import { catchError, filter, takeUntil } from "rxjs/operators";
+import { Observable, Subject, lastValueFrom, of } from "rxjs";
+import { catchError, filter, map, takeUntil } from "rxjs/operators";
 import { ReferentieTabelService } from "../../admin/referentie-tabel.service";
 import { BAGObject } from "../../bag/model/bagobject";
 import { UtilService } from "../../core/service/util.service";
@@ -81,8 +81,7 @@ export class ZaakCreateComponent implements OnInit, OnDestroy {
   private readonly inboxProductaanvraag: InboxProductaanvraag;
   private communicatiekanalen: Observable<string[]>;
   private communicatiekanaalField: SelectFormField;
-  private medewerkers: GeneratedType<"RestUser">[] = [];
-  private groepen: GeneratedType<"RestGroup">[] = [];
+  private groepen: Observable<GeneratedType<"RestGroup">[]>;
 
   constructor(
     private zakenService: ZakenService,
@@ -98,7 +97,7 @@ export class ZaakCreateComponent implements OnInit, OnDestroy {
       this.router.getCurrentNavigation()?.extras?.state?.inboxProductaanvraag;
   }
 
-  ngOnInit(): void {
+  async ngOnInit() {
     this.utilService.setTitle("title.zaak.aanmaken");
 
     this.formConfig = new FormConfigBuilder()
@@ -154,7 +153,8 @@ export class ZaakCreateComponent implements OnInit, OnDestroy {
       .validators(Validators.required)
       .build();
 
-    this.medewerkerGroepFormField = this.getMedewerkerGroupFormField();
+    this.groepen = this.identityService.listGroups();
+    this.medewerkerGroepFormField = await this.getMedewerkerGroupFormField();
 
     this.initiatorField = new InputFormFieldBuilder()
       .id("initiatorIdentificatie")
@@ -234,14 +234,6 @@ export class ZaakCreateComponent implements OnInit, OnDestroy {
     if (this.inboxProductaanvraag) {
       this.verwerkInboxProductaanvraagGegevens();
     }
-
-    this.identityService.listUsers().subscribe((users) => {
-      this.medewerkers = users;
-    });
-
-    this.identityService.listGroups().subscribe((groups) => {
-      this.groepen = groups;
-    });
   }
 
   ngOnDestroy(): void {
@@ -310,40 +302,50 @@ export class ZaakCreateComponent implements OnInit, OnDestroy {
     this.actionsSidenav.close();
   }
 
-  getMedewerkerGroupFormField(
-    groepId?: string,
-    medewerkerId?: string,
-  ): MedewerkerGroepFormField {
-    const groep = this.groepen.find(({ id }) => id === groepId);
-    const medewerker = this.medewerkers.find(({ id }) => id === medewerkerId);
+  async getMedewerkerGroupFormField(groepId?: string, medewerkerId?: string) {
+    const group = await lastValueFrom(
+      this.groepen.pipe(
+        map((groups) => groups.find(({ id }) => id === groepId)),
+      ),
+    );
+
+    const employee = group
+      ? await lastValueFrom(
+          this.identityService
+            .listUsersInGroup(group.id)
+            .pipe(map((users) => users.find(({ id }) => id === medewerkerId))),
+        )
+      : undefined;
 
-    return new MedewerkerGroepFieldBuilder(groep, medewerker)
+    return new MedewerkerGroepFieldBuilder(group, employee)
       .id("toekenning")
       .groepLabel("actie.zaak.toekennen.groep")
       .groepRequired()
       .medewerkerLabel("actie.zaak.toekennen.medewerker")
       .build();
   }
 
-  zaaktypeGeselecteerd(zaaktype: Zaaktype): void {
+  async zaaktypeGeselecteerd(zaaktype: Zaaktype) {
     if (!zaaktype) {
       return;
     }
 
-    this.createZaakFields = this.createZaakFields.map((formRow) => {
-      if (
-        formRow.find(
-          (formField) => formField.fieldType === FieldType.MEDEWERKER_GROEP,
-        )
-      ) {
-        const newField = this.getMedewerkerGroupFormField(
-          zaaktype.zaakafhandelparameters.defaultGroepId,
-          zaaktype.zaakafhandelparameters.defaultBehandelaarId,
-        );
-        return [newField];
-      }
-      return formRow;
-    });
+    this.createZaakFields = await Promise.all(
+      this.createZaakFields.map(async (formRow) => {
+        if (
+          formRow.find(
+            ({ fieldType }) => fieldType === FieldType.MEDEWERKER_GROEP,
+          )
+        ) {
+          const newField = await this.getMedewerkerGroupFormField(
+            zaaktype.zaakafhandelparameters.defaultGroepId,
+            zaaktype.zaakafhandelparameters.defaultBehandelaarId,
+          );
+          return [newField];
+        }
+        return formRow;
+      }),
+    );
 
     this.vertrouwelijkheidaanduidingField.formControl.setValue(
       this.vertrouwelijkheidaanduidingen.find(