-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(users profile): users should view and update his/her profile
-Ensures that user can view his or her profile -Ensure that user can update his or her profile [Deliver #187419128]
- Loading branch information
1 parent
9652708
commit a4ec87a
Showing
24 changed files
with
17,246 additions
and
16 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,49 @@ | ||
| import "@testing-library/jest-dom"; | ||
| import React from "react"; | ||
| import { render, fireEvent, waitFor } from "@testing-library/react"; | ||
| import { Provider } from "react-redux"; | ||
| import { BrowserRouter } from "react-router-dom"; | ||
|
|
||
| import UsersProfile from "../pages/userProfile"; | ||
| import store from "../redux/store"; | ||
|
|
||
| describe("UsersProfile component", () => { | ||
| beforeAll(() => { | ||
| const mockAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c"; | ||
| global.localStorage.setItem("accessToken", mockAccessToken); | ||
| }); | ||
|
|
||
| afterAll(() => { | ||
| global.localStorage.removeItem("accessToken"); | ||
| }); | ||
|
|
||
| it("displays loading state", () => { | ||
| const { getByText } = render( | ||
| <Provider store={store}> | ||
| <BrowserRouter> | ||
| <UsersProfile /> | ||
| </BrowserRouter> | ||
| </Provider>, | ||
| ); | ||
| expect(getByText("Loading...")).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it("calls getProfile action on mount", () => { | ||
| const getProfileMock = jest.fn(); | ||
| const { rerender } = render( | ||
| <Provider store={store}> | ||
| <BrowserRouter> | ||
| <UsersProfile /> | ||
| </BrowserRouter> | ||
| </Provider>, | ||
| ); | ||
| rerender( | ||
| <Provider store={store}> | ||
| <BrowserRouter> | ||
| <UsersProfile /> | ||
| </BrowserRouter> | ||
| </Provider>, | ||
| ); | ||
| expect(getProfileMock).toBeTruthy(); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| import { getProfile, profileSlice } from "../redux/reducers/profileSlice"; | ||
|
|
||
| import "@testing-library/jest-dom"; | ||
| import { render, screen } from "@testing-library/react"; | ||
|
|
||
| import DisplayProfileData from "../components/profile/getProfile"; | ||
|
|
||
| const { reducer } = profileSlice; | ||
|
|
||
| describe("get profile sclice", () => { | ||
| it("handles pending state on profile .pending", () => { | ||
| // @ts-ignore | ||
| const initialState = reducer(undefined, { type: getProfile.pending }); | ||
| expect(initialState.loading).toBeTruthy(); | ||
| }); | ||
|
|
||
| it("handles fulfilled state and data on profile .fulfilled", () => { | ||
| const mockData = { message: "Success" }; | ||
| const initialState = reducer(undefined, { | ||
| // @ts-ignore | ||
| type: getProfile.fulfilled, | ||
| payload: mockData, | ||
| }); | ||
| expect(initialState.profile).toBe(mockData); | ||
| }); | ||
|
|
||
| it("handles rejected state and error on profile .rejected", () => { | ||
| const error = { message: "Error" }; | ||
| const initialState = reducer(undefined, { | ||
| // @ts-ignore | ||
| type: getProfile.rejected, | ||
| payload: error, | ||
| }); | ||
| expect(initialState.error).toBe("Error"); | ||
| }); | ||
| }); | ||
|
|
||
| describe("DisplayProfileData component", () => { | ||
| it("renders the label and value correctly", () => { | ||
| const label = "Name"; | ||
| const value = "John Doe"; | ||
|
|
||
| render(<DisplayProfileData label={label} value={value} />); | ||
|
|
||
| expect(screen.getByText(label)).toBeInTheDocument(); | ||
| expect(screen.getByText(value)).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it("handles number values correctly", () => { | ||
| const label = "Age"; | ||
| const value = 30; | ||
|
|
||
| render(<DisplayProfileData label={label} value={value} />); | ||
|
|
||
| expect(screen.getByText(label)).toBeInTheDocument(); | ||
| expect(screen.getByText(value.toString())).toBeInTheDocument(); | ||
| }); | ||
| }); |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,94 @@ | ||
| import "@testing-library/jest-dom"; | ||
| import { | ||
| render, fireEvent, waitFor, screen, | ||
| } from "@testing-library/react"; | ||
| import { Provider } from "react-redux"; | ||
| import { BrowserRouter } from "react-router-dom"; | ||
|
|
||
| import UpdateUserProfile, { convertUrlToFile } from "../pages/updateProfile"; | ||
| import store from "../redux/store"; | ||
|
|
||
| global.fetch = jest.fn(() => Promise.resolve({ | ||
| blob: () => Promise.resolve(new Blob(["dummy content"], { type: "image/png" })), | ||
| })) as jest.Mock; | ||
|
|
||
| describe("UpdateUserProfile component", () => { | ||
| it("renders correctly", () => { | ||
| const { getByText } = render( | ||
| <Provider store={store}> | ||
| <BrowserRouter> | ||
| <UpdateUserProfile /> | ||
| </BrowserRouter> | ||
| </Provider>, | ||
| ); | ||
| expect(getByText("Update your profile")).toBeInTheDocument(); | ||
| }); | ||
| it("test the input in hte document ", () => { | ||
| const { getByLabelText } = render( | ||
| <Provider store={store}> | ||
| <BrowserRouter> | ||
| <UpdateUserProfile /> | ||
| </BrowserRouter> | ||
| </Provider>, | ||
| ); | ||
|
|
||
| const fullNameInput = getByLabelText("Full name"); | ||
| const genderInput = getByLabelText("Gender"); | ||
| const birthdateInput = getByLabelText("Birth date"); | ||
| const preferredLanguageInput = getByLabelText("Preferred language"); | ||
| const preferredCurrencyInput = getByLabelText("Preferred currency"); | ||
| const streetInput = getByLabelText("Street"); | ||
| const cityInput = getByLabelText("City"); | ||
| const stateInput = getByLabelText("State"); | ||
| const postalCodeInput = getByLabelText("Postal Code"); | ||
| const countryInput = getByLabelText("Country"); | ||
|
|
||
| expect(fullNameInput).toBeInTheDocument(); | ||
| expect(genderInput).toBeInTheDocument(); | ||
| expect(birthdateInput).toBeInTheDocument(); | ||
| expect(preferredLanguageInput).toBeInTheDocument(); | ||
| expect(preferredCurrencyInput).toBeInTheDocument(); | ||
| expect(cityInput).toBeInTheDocument(); | ||
| expect(stateInput).toBeInTheDocument(); | ||
| expect(postalCodeInput).toBeInTheDocument(); | ||
| expect(countryInput).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it("handles image input correctly", () => { | ||
| const { getByLabelText } = render( | ||
| <Provider store={store}> | ||
| <BrowserRouter> | ||
| <UpdateUserProfile /> | ||
| </BrowserRouter> | ||
| </Provider>, | ||
| ); | ||
|
|
||
| const file = new File(["dummy content"], "example.png", { | ||
| type: "image/png", | ||
| }); | ||
| const input = getByLabelText(/upload image/i); | ||
|
|
||
| fireEvent.change(input, { target: { files: [file] } }); | ||
|
|
||
| waitFor(() => expect(screen.getByAltText("Profile Preview")).toHaveAttribute( | ||
| "src", | ||
| expect.stringContaining("data:image/png;base64"), | ||
| )); | ||
| }); | ||
| it("should convert a URL to a File object", async () => { | ||
| const url = "http://example.com/profileImage.png"; | ||
| const file = await convertUrlToFile(url); | ||
|
|
||
| expect(file).toBeInstanceOf(File); | ||
| expect(file.name).toBe("profileImage.png"); | ||
| expect(file.type).toBe("image/png"); | ||
| }); | ||
|
|
||
| it("should handle URLs without a filename", async () => { | ||
| const url = "http://example.com/"; | ||
| const file = await convertUrlToFile(url); | ||
|
|
||
| expect(file).toBeInstanceOf(File); | ||
| expect(file.name).toBe("profileImage"); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| import { | ||
| updateProfile, | ||
| updateProfileSlice, | ||
| } from "../redux/reducers/updateProfileSlice"; | ||
|
|
||
| const { reducer } = updateProfileSlice; | ||
| describe("profile update slice", () => { | ||
| it("handles pending state on profile update.pending", () => { | ||
| // @ts-ignore | ||
| const initialState = reducer(undefined, { type: updateProfile.pending }); | ||
| expect(initialState.loading).toBeTruthy(); | ||
| }); | ||
|
|
||
| it("handles fulfilled state and data on profile update.fulfilled", () => { | ||
| const mockData = { message: "Success" }; | ||
| const initialState = reducer(undefined, { | ||
| // @ts-ignore | ||
| type: updateProfile.fulfilled, | ||
| payload: mockData, | ||
| }); | ||
| expect(initialState.profile).toBe(undefined); | ||
| }); | ||
|
|
||
| it("handles rejected state and error on profile update.rejected", () => { | ||
| const error = { message: "Error" }; | ||
| const initialState = reducer(undefined, { | ||
| // @ts-ignore | ||
| type: updateProfile.rejected, | ||
| payload: error, | ||
| }); | ||
| expect(initialState.error).toBe(error); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.