test: re-adding test files

frontend/tests/components/pages/FormStaffPage.cy.ts

@@ -0,0 +1,72 @@
+import FormStaffPage from "@/pages/FormStaffPage.vue";
+
+const individualBaseData = {
+  firstName: "John",
+  middleName: "Michael",
+  lastName: "Silver",
+  birthdateYear: "2001",
+  birthdateMonth: "05",
+  birthdateDay: "30",
+  identificationTypeCode: "PASS",
+  identificationTypeValue: "Canadian passport",
+  identificationProvinceValue: undefined,
+  clientIdentification: "AB345678",
+};
+
+const fillIndividual = (data = individualBaseData) => {
+  cy.fillFormEntry("#firstName",data.firstName);
+  cy.fillFormEntry("#middleName",data.middleName);
+  cy.fillFormEntry("#lastName",data.lastName);
+  cy.fillFormEntry("#birthdateYear",data.birthdateYear);
+  cy.fillFormEntry("#birthdateMonth",data.birthdateMonth);
+  cy.fillFormEntry("#birthdateDay",data.birthdateDay);
+  cy.selectFormEntry("#identificationType",data.identificationTypeValue,false);
+  cy.fillFormEntry("#clientIdentification",data.clientIdentification);
+};
+
+describe("Step 2 - Locations", () => {
+
+  beforeEach(() => {
+    cy.intercept("GET", "/api/codes/countries?page=0&size=250", {
+      fixture: "countries.json",
+    }).as("getCountries");
+
+    cy.intercept("GET", "/api/codes/countries/CA/provinces?page=0&size=250", {
+      fixture: "provinces.json",
+    }).as("getProvinces");
+
+    cy.intercept("GET", "/api/codes/countries/US/provinces?page=0&size=250", {
+      fixture: "states.json",
+    }).as("getStates");
+
+    cy.intercept("GET", "/api/codes/identification-types", {
+      fixture: "identificationTypes.json",
+    }).as("getIdentificationTypes");
+
+    cy.intercept("POST", "/api/clients/matches", {
+      statusCode: 204,
+    }).as("doMatches");
+
+    cy.viewport(1056, 800);
+  });
+
+  it("should render the LocationsWizardStep with maxLocations set to 25", () => {
+
+    cy.mount(FormStaffPage, {}).its("wrapper").as("wrapper");
+
+    cy.get("#clientType").find("[part='trigger-button']").click();
+
+    cy.get("#clientType").find('cds-combo-box-item[data-id="I"]').click();
+
+    fillIndividual();
+
+    cy.get("[data-test='wizard-next-button']").click();
+
+    cy.get("@wrapper")
+      .then((wrapper) => {
+        const locations = wrapper.findComponent({ name: "LocationsWizardStep" });
+        return locations.props("maxLocations");
+      })
+      .should("eq", 25);
+  });
+});

frontend/tests/components/pages/bceidform/AddressWizardStep.cy.ts

@@ -0,0 +1,269 @@
+import AddressWizardStep from "@/pages/bceidform/AddressWizardStep.vue";
+import { emptyAddress } from "@/dto/ApplyClientNumberDto";
+import type { Address, FormDataDto } from "@/dto/ApplyClientNumberDto";
+import type { ModalNotification } from "@/dto/CommonTypesDto";
+import { useEventBus } from "@vueuse/core";
+
+describe("<AddressWizardStep />", () => {
+
+  beforeEach(() => {
+    cy.intercept("GET", `/api/addresses?country=CA&maxSuggestions=10&searchTerm=*`, {
+      fixture: "addressSearch.json",
+    });
+  });
+
+  describe("when feature BCEID_MULTI_ADDRESS is enabled", () => {
+    const global = {
+      config: {
+        globalProperties: {
+          $features: {
+            BCEID_MULTI_ADDRESS: true,
+          },
+        },
+      },
+    };
+
+    it("renders the AddressWizardStep component", () => {
+      cy.mount(AddressWizardStep, {
+        props: {
+          data: {
+            location: {
+              addresses: [
+                {
+                  locationName: "Mailing address",
+                  streetAddress: "123 Forest Street",
+                  country: { value: "CA", text: "Canada" },
+                  province: { value: "BC", text: "British Columbia" },
+                  city: "Victoria",
+                  postalCode: "A0A0A0",
+                } as Address,
+              ],
+              contacts: [],
+            },
+          } as FormDataDto,
+          active: false,
+        },
+        global,
+      });
+
+      // Assert that the main component is rendered
+      cy.get(".frame-01").should("exist");
+
+      // Assert that the first field is displayed
+      cy.get("#addr_0").should("exist");
+    });
+
+    it("should display an error when two locations have the same address data", () => {
+      const address = {
+        streetAddress: "123 Forest Street",
+        country: { value: "CA", text: "Canada" },
+        province: { value: "BC", text: "British Columbia" },
+        city: "Victoria",
+        postalCode: "A0A0A0",
+      } as Address;
+      cy.mount(AddressWizardStep, {
+        props: {
+          data: {
+            location: {
+              addresses: [
+                {
+                  locationName: "My Office",
+                  ...address,
+                } as Address,
+                {
+                  locationName: "My Store",
+                  ...address,
+                } as Address,
+              ],
+              contacts: [],
+            },
+          } as FormDataDto,
+          active: false,
+        },
+        global,
+      });
+
+      cy.get("#addr_1").find("div").should("have.class", "cds--dropdown--invalid");
+      cy.get("#city_1").find("input").should("have.class", "cds--text-input--invalid");
+    });
+
+    describe("when an address which is not the last one gets deleted", () => {
+      const otherAddressNames = ["Sales Office", "Beach Office"];
+      const addAddress = (addressId: number, name: string) => {
+        cy.contains("Add another address").should("be.visible").click();
+
+        cy.focused().should("contain.text", "Additional address");
+
+        cy.get(`#name_${addressId}`)
+          .should("be.visible")
+          .shadow()
+          .find("input")
+          .should("have.value", "")
+          .type(name);
+      };
+      const fillAddress = (
+        addressId: number,
+        { streetAddress, postalCode }: { streetAddress: string; postalCode: string },
+      ) => {
+        cy.get(`#addr_${addressId}`)
+          .should("be.visible")
+          .shadow()
+          .find("input")
+          .should("have.value", "")
+          .type(streetAddress);
+
+        cy.get(`#city_${addressId}`)
+          .should("be.visible")
+          .shadow()
+          .find("input")
+          .should("have.value", "")
+          .type("Victoria");
+
+        cy.get(`#postalCode_${addressId}`)
+          .should("be.visible")
+          .shadow()
+          .find("input")
+          .should("have.value", "")
+          .type(postalCode);
+      };
+
+      let bus: ReturnType<typeof useEventBus<ModalNotification>>;
+
+      const mountTest = (includeOtherAddressesInProps: boolean) => {
+        cy.mount(AddressWizardStep, {
+          props: {
+            data: {
+              location: {
+                addresses: [
+                  {
+                    locationName: "Mailing address",
+                    streetAddress: "123 Forest Street",
+                    country: { value: "CA", text: "Canada" },
+                    province: { value: "BC", text: "British Columbia" },
+                    city: "Victoria",
+                    postalCode: "A0A0A0",
+                  } as Address,
+                  ...(includeOtherAddressesInProps ? otherAddressNames : []).map(
+                    (locationName) => ({
+                      ...emptyAddress(),
+                      locationName,
+                    }),
+                  ),
+                ],
+                contacts: [],
+              },
+            } as FormDataDto,
+            active: false,
+          },
+          global,
+        })
+          .its("wrapper")
+          .as("vueWrapper");
+      };
+
+      // Multi-scenario test
+      [
+        { includeOtherAddressesInProps: true, predicate: "are provided in the props" },
+        { includeOtherAddressesInProps: false, predicate: "are added manually" },
+      ].forEach(({ includeOtherAddressesInProps, predicate }) =>
+        describe(`when other addresses ${predicate}`, () => {
+          beforeEach(() => {
+            bus = useEventBus<ModalNotification>("modal-notification");
+            bus.on((payload) => {
+              payload.handler(); // automatically proceed with the deletion
+            });
+
+            mountTest(includeOtherAddressesInProps);
+
+            if (!includeOtherAddressesInProps) {
+              otherAddressNames.forEach((name, index) => {
+                addAddress(index + 1, name);
+              });
+            }
+          });
+
+          afterEach(() => {
+            bus.reset();
+          });
+
+          it("removes the intended address from the DOM", () => {
+            cy.get("#deleteAddress_1").click();
+            cy.wait(150);
+            cy.get("#name_1").should("not.exist");
+            cy.get("#name_2").should("exist");
+          });
+
+          it("can submit the form (regardless of the deleted address being invalid)", () => {
+            cy.get("#deleteAddress_1").click();
+            cy.wait(150);
+
+            fillAddress(2, {
+              streetAddress: "456 Lumber Street",
+              postalCode: "B0B0B0",
+            });
+
+            cy.get("@vueWrapper").should((vueWrapper) => {
+              const lastValid = vueWrapper.emitted("valid").slice(-1)[0];
+
+              // The last valid event was emitted with true.
+              expect(lastValid[0]).to.equal(true);
+            });
+          });
+        }),
+      );
+    });
+
+  });
+
+  describe("when feature BCEID_MULTI_ADDRESS is disabled", () => {
+    const global = {
+      config: {
+        globalProperties: {
+          $features: {
+            BCEID_MULTI_ADDRESS: false,
+          },
+        },
+      },
+    };
+    const mountTest = () => {
+      cy.mount(AddressWizardStep, {
+        props: {
+          data: {
+            location: {
+              addresses: [
+                {
+                  locationName: "Mailing address",
+                  streetAddress: "123 Forest Street",
+                  country: { value: "CA", text: "Canada" },
+                  province: { value: "BC", text: "British Columbia" },
+                  city: "Victoria",
+                  postalCode: "A0A0A0",
+                } as Address,
+              ],
+              contacts: [],
+            },
+          } as FormDataDto,
+          active: false,
+        },
+        global,
+      });
+    };
+
+    it("renders the AddressWizardStep component", () => {
+      mountTest();
+
+      // Assert that the main component is rendered
+      cy.get(".frame-01").should("exist");
+
+      // Assert that the first field is displayed
+      cy.get("#addr_0").should("exist");
+    });
+
+    it("should not render the button 'Add another address'", () => {
+      mountTest();
+      cy.contains("Add another address").should("not.exist");
+    });
+
+  });
+
+});