Add tests for status & value components #758

bkd-mba-fbi · Feb 28, 2025 · 5370b5b · 5370b5b
1 parent 6484e2b
commit 5370b5b
Show file tree

Hide file tree

Showing 2 changed files with 95 additions and 6 deletions.
diff --git a/src/app/import/components/import-entry-status/import-entry-status.component.spec.ts b/src/app/import/components/import-entry-status/import-entry-status.component.spec.ts
@@ -1,10 +1,14 @@
 import { ComponentFixture, TestBed } from "@angular/core/testing";
 import { buildTestModuleMetadata } from "src/spec-helpers";
+import { SubscriptionDetailImportEntry } from "../../services/import-validate-subscription-details.service";
+import { EventNotFoundError } from "../../utils/subscription-details/error";
 import { ImportEntryStatusComponent } from "./import-entry-status.component";
 
 describe("ImportEntryStatusComponent", () => {
   let component: ImportEntryStatusComponent;
   let fixture: ComponentFixture<ImportEntryStatusComponent>;
+  let element: HTMLElement;
+  let entry: SubscriptionDetailImportEntry;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule(
@@ -15,24 +19,53 @@ describe("ImportEntryStatusComponent", () => {
 
     fixture = TestBed.createComponent(ImportEntryStatusComponent);
     component = fixture.componentInstance;
+    element = fixture.debugElement.nativeElement;
 
-    fixture.componentRef.setInput("entry", {
+    entry = {
       validationStatus: "validating",
       importStatus: null,
       entry: {
         eventId: 10,
         personId: 100,
+        personEmail: null,
         subscriptionDetailId: 1000,
         value: "Lorem ipsum",
       },
+      data: {},
       validationError: null,
       importError: null,
-    });
+    };
+  });
 
+  it("renders a check mark without error message for a valid entry", () => {
+    entry.validationStatus = "valid";
+    fixture.componentRef.setInput("entry", entry);
     fixture.detectChanges();
+
+    expect(component.icon()).toEqual("check_circle");
+    const icon = element.querySelector("i");
+    expect(icon).not.toBeNull();
+    expect(icon?.textContent).toContain("check_circle");
+
+    expect(component.errorMessage()).toBeNull();
   });
 
-  it("should create", () => {
-    expect(component).toBeTruthy();
+  it("renders a cross with error message for an invalid entry", () => {
+    entry.validationStatus = "invalid";
+    entry.validationError = new EventNotFoundError();
+    fixture.componentRef.setInput("entry", entry);
+    fixture.detectChanges();
+
+    expect(component.icon()).toEqual("cancel");
+    const icon = element.querySelector("i");
+    expect(icon).not.toBeNull();
+    expect(icon?.textContent).toContain("cancel");
+
+    expect(component.errorMessage()).toBe(
+      "import.validation.errors.EventNotFoundError",
+    );
+    expect(element.textContent).toContain(
+      "import.validation.errors.EventNotFoundError",
+    );
   });
 });
diff --git a/src/app/import/components/import-entry-value/import-entry-value.component.spec.ts b/src/app/import/components/import-entry-value/import-entry-value.component.spec.ts
@@ -4,6 +4,7 @@ import { ImportEntryValueComponent } from "./import-entry-value.component";
 describe("ImportEntryValueComponent", () => {
   let component: ImportEntryValueComponent;
   let fixture: ComponentFixture<ImportEntryValueComponent>;
+  let element: HTMLElement;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
@@ -12,14 +13,69 @@ describe("ImportEntryValueComponent", () => {
 
     fixture = TestBed.createComponent(ImportEntryValueComponent);
     component = fixture.componentInstance;
+    element = fixture.debugElement.nativeElement;
+  });
+
+  it("renders a valid string value", () => {
+    fixture.componentRef.setInput("value", "Lorem ipsum");
+    fixture.componentRef.setInput("valid", true);
+
+    fixture.detectChanges();
+    expect(component.displayValue()).toBe("Lorem ipsum");
+    expect(element.textContent).toContain("Lorem ipsum");
+    expect(element.classList).not.toContain("invalid");
+    const icon = element.querySelector("i");
+    expect(icon).toBeNull();
+  });
+
+  it("renders a valid number value", () => {
+    fixture.componentRef.setInput("value", 42);
+    fixture.componentRef.setInput("valid", true);
+
+    fixture.detectChanges();
+    expect(component.displayValue()).toBe("42");
+    expect(element.textContent).toContain("42");
+    expect(element.classList).not.toContain("invalid");
+    const icon = element.querySelector("i");
+    expect(icon).toBeNull();
+  });
 
+  it("renders an invalid value", () => {
     fixture.componentRef.setInput("value", "Lorem ipsum");
+    fixture.componentRef.setInput("valid", false);
+
+    fixture.detectChanges();
+    expect(component.displayValue()).toBe("Lorem ipsum");
+    expect(element.textContent).toContain("Lorem ipsum");
+    expect(element.classList).toContain("invalid");
+    const icon = element.querySelector("i");
+    expect(icon).not.toBeNull();
+  });
+
+  it("renders '–' for an empty string", () => {
+    fixture.componentRef.setInput("value", "");
+    fixture.componentRef.setInput("valid", true);
+
+    fixture.detectChanges();
+    expect(component.displayValue()).toBe("–");
+    expect(element.textContent).toContain("–");
+  });
+
+  it("renders '–' for null", () => {
+    fixture.componentRef.setInput("value", null);
     fixture.componentRef.setInput("valid", true);
 
     fixture.detectChanges();
+    expect(component.displayValue()).toBe("–");
+    expect(element.textContent).toContain("–");
   });
 
-  it("should create", () => {
-    expect(component).toBeTruthy();
+  it("renders '–' for undefined", () => {
+    fixture.componentRef.setInput("value", undefined);
+    fixture.componentRef.setInput("valid", true);
+
+    fixture.detectChanges();
+    expect(component.displayValue()).toBe("–");
+    expect(element.textContent).toContain("–");
   });
 });