diff --git a/components/Forms/Edit/Profile/editProfile.test.tsx b/components/Forms/Edit/Profile/editProfile.test.tsx new file mode 100644 index 000000000..9cbb2e2b3 --- /dev/null +++ b/components/Forms/Edit/Profile/editProfile.test.tsx @@ -0,0 +1,111 @@ +import { expect } from "@jest/globals" +import { render, screen, waitFor } from "@testing-library/react" +import { userEvent } from "@testing-library/user-event" + +import { editProfile } from "@/actions/editProfile" + +import Form from "." + +import { type User } from "@/types/user" + +jest.mock("@/actions/editProfile", () => ({ + editProfile: jest.fn().mockResolvedValue({ status: "" }), +})) + +describe("EditProfile", () => { + it("Should submit form with correct data", async () => { + const user: User = { + email: "test@test.com", + name: "Test User", + phoneNumber: "+4612345678", + dateOfBirth: "1990-01-08", + address: { + city: "Test City", + countryCode: "SE", + streetAddress: "Test Street", + zipCode: "12345", + }, + journeys: [], + nights: 0, + shortcuts: [], + victories: [], + language: "en", + firstName: "Test", + lastName: "User", + memberships: [], + profileId: "1", + } + + render(
) + + const newValues = { + email: "new@test.com", + dateOfBirth: "2000-01-01", + address: { + city: "New City", + countryCode: "SE", + streetAddress: "New Street", + zipCode: "67890", + }, + phoneNumber: "+469999999", + language: "No", + password: "oldPassword123!", + newPassword: "newPassword123!", + retypeNewPassword: "newPassword123!", + } + + const dateOfBirthInput = screen.getByTestId("dateOfBirth") + const daySelect = dateOfBirthInput.querySelector("select[name='date']")! + const monthSelect = dateOfBirthInput.querySelector("select[name='month']")! + const yearSelect = dateOfBirthInput.querySelector("select[name='year']")! + + await userEvent.selectOptions(daySelect, "1") + await userEvent.selectOptions(monthSelect, "1") + await userEvent.selectOptions(yearSelect, "2000") + + const streetAddressInput = screen.getByTestId("address.streetAddress") + await userEvent.clear(streetAddressInput) + await userEvent.type(streetAddressInput, newValues.address.streetAddress) + + const cityInput = screen.getByTestId("address.city") + await userEvent.clear(cityInput) + await userEvent.type(cityInput, newValues.address.city) + + const zipCodeInput = screen.getByTestId("address.zipCode") + await userEvent.clear(zipCodeInput) + await userEvent.type(zipCodeInput, newValues.address.zipCode) + + const countryInput = screen.getByLabelText("Select a country") + await userEvent.click(countryInput) + await userEvent.type(countryInput, "Sweden") + await userEvent.keyboard("{ArrowDown}{Enter}") + + const emailInput = screen.getByTestId("email") + await userEvent.clear(emailInput) + await userEvent.type(emailInput, newValues.email) + + const phoneNumberInput = screen.getByTestId("phoneNumber") + await userEvent.clear(phoneNumberInput) + await userEvent.type(phoneNumberInput, newValues.phoneNumber.slice(3)) // Remove country code + + const languageInput = screen.getByTestId("language") + await userEvent.click(languageInput) + await userEvent.click(screen.getByTestId("Norwegian")) + + await userEvent.type(screen.getByTestId("password"), newValues.password) + await userEvent.type( + screen.getByTestId("newPassword"), + newValues.newPassword + ) + await userEvent.type( + screen.getByTestId("retypeNewPassword"), + newValues.retypeNewPassword + ) + + await userEvent.click(screen.getByText("Save")) + + await waitFor(() => { + expect(editProfile).toHaveBeenCalledWith(newValues) + }) + }) +}) diff --git a/components/Forms/Register/index.tsx b/components/Forms/Register/index.tsx index 0a39c8ec2..319a0483a 100644 --- a/components/Forms/Register/index.tsx +++ b/components/Forms/Register/index.tsx @@ -67,6 +67,11 @@ export default function Form() {
diff --git a/components/Forms/Register/register.test.tsx b/components/Forms/Register/register.test.tsx index c83f63c59..e9188abff 100644 --- a/components/Forms/Register/register.test.tsx +++ b/components/Forms/Register/register.test.tsx @@ -18,7 +18,7 @@ describe("Register user form", () => { const values = { firstName: "John", lastName: "Doe", - dateOfBirth: "1990-01-08", + dateOfBirth: "1990-01-01", address: { zipCode: "11111", countryCode: "SE", diff --git a/components/TempDesignSystem/Form/Date/index.tsx b/components/TempDesignSystem/Form/Date/index.tsx index 63456c3e3..311650fc2 100644 --- a/components/TempDesignSystem/Form/Date/index.tsx +++ b/components/TempDesignSystem/Form/Date/index.tsx @@ -61,7 +61,7 @@ export default function DateSelect({ name, registerOptions = {} }: DateProps) { const newDate = dt(new Date()) .set("year", newSegments.year!) .set("month", newSegments.month!) - .set("day", newSegments.date!) + .set("date", newSegments.date!) setValue(name, newDate.format("YYYY-MM-DD")) } diff --git a/components/TempDesignSystem/Form/Phone/index.tsx b/components/TempDesignSystem/Form/Phone/index.tsx index 6e9c2024b..d09598296 100644 --- a/components/TempDesignSystem/Form/Phone/index.tsx +++ b/components/TempDesignSystem/Form/Phone/index.tsx @@ -85,6 +85,7 @@ export default function Phone({ className={styles.select} tabIndex={0} type="button" + data-testid="country-selector" >