Files
web/components/Forms/Edit/Profile/editProfile.test.tsx
2024-10-10 08:59:33 +02:00

112 lines
3.5 KiB
TypeScript

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(<Form user={user} />)
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)
})
})
})