Skip to content

Commit 7276781

Browse files
committed
Add tests
1 parent 893efec commit 7276781

File tree

4 files changed

+132
-3
lines changed

4 files changed

+132
-3
lines changed

site/src/api/queries/users.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import type {
33
AuthorizationRequest,
44
GenerateAPIKeyResponse,
55
GetUsersResponse,
6+
RequestOneTimePasscodeRequest,
67
UpdateUserAppearanceSettingsRequest,
78
UpdateUserPasswordRequest,
89
UpdateUserProfileRequest,
@@ -256,7 +257,8 @@ export const updateAppearanceSettings = (
256257

257258
export const requestOneTimePassword = () => {
258259
return {
259-
mutationFn: API.requestOneTimePassword,
260+
mutationFn: (req: RequestOneTimePasscodeRequest) =>
261+
API.requestOneTimePassword(req),
260262
};
261263
};
262264

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
import type { Meta, StoryObj } from "@storybook/react";
2+
import ChangePasswordPage from "./ChangePasswordPage";
3+
import { spyOn, userEvent, within, expect } from "@storybook/test";
4+
import { API } from "api/api";
5+
import { mockApiError } from "testHelpers/entities";
6+
import { withGlobalSnackbar } from "testHelpers/storybook";
7+
8+
const meta: Meta<typeof ChangePasswordPage> = {
9+
title: "pages/ResetPasswordPage/ChangePasswordPage",
10+
component: ChangePasswordPage,
11+
args: { redirect: false },
12+
decorators: [withGlobalSnackbar],
13+
};
14+
15+
export default meta;
16+
type Story = StoryObj<typeof ChangePasswordPage>;
17+
18+
export const Default: Story = {};
19+
20+
export const Success: Story = {
21+
play: async ({ canvasElement }) => {
22+
spyOn(API, "changePasswordWithOTP").mockResolvedValueOnce();
23+
const canvas = within(canvasElement);
24+
const user = userEvent.setup();
25+
const newPasswordInput = await canvas.findByLabelText("New password *");
26+
await user.type(newPasswordInput, "password");
27+
const confirmPasswordInput = await canvas.findByLabelText(
28+
"Confirm new password *",
29+
);
30+
await user.type(confirmPasswordInput, "password");
31+
await user.click(canvas.getByRole("button", { name: /reset password/i }));
32+
await canvas.findByText("Password reset successfully");
33+
},
34+
};
35+
36+
export const WrongConfirmationPassword: Story = {
37+
play: async ({ canvasElement }) => {
38+
spyOn(API, "changePasswordWithOTP").mockRejectedValueOnce(
39+
mockApiError({
40+
message: "New password should be different from the old password",
41+
}),
42+
);
43+
const canvas = within(canvasElement);
44+
const user = userEvent.setup();
45+
const newPasswordInput = await canvas.findByLabelText("New password *");
46+
await user.type(newPasswordInput, "password");
47+
const confirmPasswordInput = await canvas.findByLabelText(
48+
"Confirm new password *",
49+
);
50+
await user.type(confirmPasswordInput, "different-password");
51+
await user.click(canvas.getByRole("button", { name: /reset password/i }));
52+
await canvas.findByText("Passwords must match");
53+
},
54+
};
55+
56+
export const ServerError: Story = {
57+
play: async ({ canvasElement }) => {
58+
const serverError =
59+
"New password should be different from the old password";
60+
spyOn(API, "changePasswordWithOTP").mockRejectedValueOnce(
61+
mockApiError({
62+
message: serverError,
63+
}),
64+
);
65+
const canvas = within(canvasElement);
66+
const user = userEvent.setup();
67+
const newPasswordInput = await canvas.findByLabelText("New password *");
68+
await user.type(newPasswordInput, "password");
69+
const confirmPasswordInput = await canvas.findByLabelText(
70+
"Confirm new password *",
71+
);
72+
await user.type(confirmPasswordInput, "password");
73+
await user.click(canvas.getByRole("button", { name: /reset password/i }));
74+
await canvas.findByText(serverError);
75+
},
76+
};

site/src/pages/ResetPasswordPage/ChangePasswordPage.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,13 @@ const validationSchema = yup.object({
3030
}),
3131
});
3232

33-
const ChangePasswordPage: FC = () => {
33+
type ChangePasswordChangeProps = {
34+
// This is used to prevent redirection when testing the page in Storybook and
35+
// capturing Chromatic snapshots.
36+
redirect?: boolean;
37+
};
38+
39+
const ChangePasswordPage: FC<ChangePasswordChangeProps> = ({ redirect }) => {
3440
const navigate = useNavigate();
3541
const applicationName = getApplicationName();
3642
const changePasswordMutation = useMutation(changePasswordWithOTP());
@@ -54,7 +60,9 @@ const ChangePasswordPage: FC = () => {
5460
password: values.password,
5561
});
5662
displaySuccess("Password reset successfully");
57-
navigate("/login");
63+
if (redirect) {
64+
navigate("/login");
65+
}
5866
} catch (error) {
5967
displayError(getErrorMessage(error, "Error resetting password"));
6068
}
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import type { Meta, StoryObj } from "@storybook/react";
2+
import RequestOTPPage from "./RequestOTPPage";
3+
import { spyOn, userEvent, within } from "@storybook/test";
4+
import { API } from "api/api";
5+
import { mockApiError } from "testHelpers/entities";
6+
import { withGlobalSnackbar } from "testHelpers/storybook";
7+
8+
const meta: Meta<typeof RequestOTPPage> = {
9+
title: "pages/ResetPasswordPage/RequestOTPPage",
10+
component: RequestOTPPage,
11+
decorators: [withGlobalSnackbar],
12+
};
13+
14+
export default meta;
15+
type Story = StoryObj<typeof RequestOTPPage>;
16+
17+
export const Default: Story = {};
18+
19+
export const Success: Story = {
20+
play: async ({ canvasElement }) => {
21+
spyOn(API, "requestOneTimePassword").mockResolvedValueOnce();
22+
const canvas = within(canvasElement);
23+
const user = userEvent.setup();
24+
const emailInput = await canvas.findByLabelText(/email/i);
25+
await user.type(emailInput, "admin@coder.com");
26+
await user.click(canvas.getByRole("button", { name: /reset password/i }));
27+
},
28+
};
29+
30+
export const ServerError: Story = {
31+
play: async ({ canvasElement }) => {
32+
spyOn(API, "requestOneTimePassword").mockRejectedValueOnce(
33+
mockApiError({
34+
message: "Error requesting password change",
35+
}),
36+
);
37+
const canvas = within(canvasElement);
38+
const user = userEvent.setup();
39+
const emailInput = await canvas.findByLabelText(/email/i);
40+
await user.type(emailInput, "admin@coder.com");
41+
await user.click(canvas.getByRole("button", { name: /reset password/i }));
42+
},
43+
};

0 commit comments

Comments
 (0)