Skip to content
This repository was archived by the owner on Nov 5, 2023. It is now read-only.

Commit 7d396d9

Browse files
release: v0.3.0 (#17)
* feat: List user files (#14) * feat: Add service to get user files * feat: Initial user files view * fix(ui): Set fixed height to navbar * feat: Files pages layout * feat: Folders navigation * feat(ui): Integrate file dropdown * refactor: Refactor user files using custom hook and context * refactor: Create user files dispatcher * feat: Dialog to upload files (#15) * fix(ui): Prevent file card texts overflow * chore(deps): Add shadcn dialog component * feat: Dialog to upload files * refactor: Change user files provider location * feat: Automatically check if the file was uploaded * feat: Add tests to upload files * feat: Profile page and update password (#16) * chore(ui): Remove share option from file dropdown * fix(ui): Make navbar container to take the full height * refactor: Use refine method to ensure passwords match during register * feat: Profile page and form to update the password * test: Add tests to the form to update the password
1 parent 2d33214 commit 7d396d9

38 files changed

+2241
-26
lines changed

CHANGELOG.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# [0.3.0](https://github.com/PedroChaparro/unofficial-frontend-react/compare/v0.2.0...v0.3.0) (2023-10-17)
2+
3+
4+
### Features
5+
6+
* Profile page and update password ([#16](https://github.com/PedroChaparro/unofficial-frontend-react/issues/16)) ([2b8825f](https://github.com/PedroChaparro/unofficial-frontend-react/commit/2b8825ff55b8df092b72bbaaab9a9544b1e1307b))
7+
8+
9+
10+
# [0.2.0](https://github.com/PedroChaparro/unofficial-frontend-react/compare/v0.1.0...v0.2.0) (2023-10-16)
11+
12+
13+
### Features
14+
15+
* Dialog to upload files ([#15](https://github.com/PedroChaparro/unofficial-frontend-react/issues/15)) ([1441752](https://github.com/PedroChaparro/unofficial-frontend-react/commit/14417526a6eeb4fc3caaab4f6b37a53e65b35052))
16+
17+
18+
19+
# [0.1.0](https://github.com/PedroChaparro/unofficial-frontend-react/compare/410290a1e5a90644d7e76d422f5504a0aff4fbe2...v0.1.0) (2023-10-16)
20+
21+
22+
### Features
23+
24+
* List user files ([#14](https://github.com/PedroChaparro/unofficial-frontend-react/issues/14)) ([410290a](https://github.com/PedroChaparro/unofficial-frontend-react/commit/410290a1e5a90644d7e76d422f5504a0aff4fbe2))
25+
26+
27+

e2e/account/update-password.spec.tsx

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
import { faker } from "@faker-js/faker";
2+
import { expect, test } from "@playwright/test";
3+
4+
test.describe.serial("Users can update their password", () => {
5+
const username = faker.internet.userName();
6+
const password = "password";
7+
const newPassword = faker.internet.password({ length: 8 });
8+
9+
test("Register test user", async ({ page }) => {
10+
await page.goto("/register");
11+
await page.getByLabel("Username").fill(username);
12+
await page.getByLabel("Password", { exact: true }).fill(password);
13+
await page.getByLabel("Confirm Password", { exact: true }).fill(password);
14+
await page.getByRole("button", { name: "Submit", exact: true }).click();
15+
await expect(page.getByText("Account created successfully")).toBeVisible();
16+
});
17+
18+
test("Update password", async ({ page }) => {
19+
// Login with the registered user
20+
await page.goto("/login");
21+
await page.getByLabel("Username").fill(username);
22+
await page.getByLabel("Password", { exact: true }).fill(password);
23+
await page.getByRole("button", { name: "Submit", exact: true }).click();
24+
await page.waitForURL(/\/files$/);
25+
26+
// Go to the profile page
27+
await page.getByRole("link", { name: "Profile", exact: true }).click();
28+
await page.waitForURL(/\/profile$/);
29+
30+
// Check that the username is shown
31+
await expect(
32+
page.getByText(username[0].toUpperCase(), { exact: true })
33+
).toBeVisible();
34+
await expect(page.getByText(username)).toBeVisible();
35+
36+
// Click the update password button
37+
await page
38+
.getByRole("tab", { name: "Update password", exact: true })
39+
.click();
40+
41+
// Fill the form
42+
const currentPasswordInput = page.getByLabel("Current password", {
43+
exact: true
44+
});
45+
await currentPasswordInput.fill(password);
46+
47+
const newPasswordInput = page.getByLabel("New password", { exact: true });
48+
await newPasswordInput.fill(newPassword);
49+
50+
const confirmNewPasswordInput = page.getByLabel("Confirm new password", {
51+
exact: true
52+
});
53+
await confirmNewPasswordInput.fill(newPassword);
54+
await page.getByRole("button", { name: "Submit", exact: true }).click();
55+
56+
// Assert the success message is shown
57+
await expect(page.getByText("Password updated successfully")).toBeVisible();
58+
59+
// Assert the form is cleared
60+
await expect(currentPasswordInput).toHaveValue("");
61+
await expect(newPasswordInput).toHaveValue("");
62+
await expect(confirmNewPasswordInput).toHaveValue("");
63+
});
64+
65+
test("Update password wrong credentials", async ({ page }) => {
66+
// Login with the registered user
67+
await page.goto("/login");
68+
await page.getByLabel("Username").fill(username);
69+
await page.getByLabel("Password", { exact: true }).fill(newPassword);
70+
await page.getByRole("button", { name: "Submit", exact: true }).click();
71+
await page.waitForURL(/\/files$/);
72+
73+
// Go to the profile page
74+
await page.getByRole("link", { name: "Profile", exact: true }).click();
75+
await page.waitForURL(/\/profile$/);
76+
77+
// Click the update password button
78+
await page
79+
.getByRole("tab", { name: "Update password", exact: true })
80+
.click();
81+
82+
// Fill the form
83+
await page.getByLabel("Current password").fill(password);
84+
await page.getByLabel("New password", { exact: true }).fill(newPassword);
85+
await page
86+
.getByLabel("Confirm new password", { exact: true })
87+
.fill(newPassword);
88+
await page.getByRole("button", { name: "Submit", exact: true }).click();
89+
90+
// Assert the error message is shown
91+
await expect(page.getByText("unauthorized")).toBeVisible();
92+
});
93+
});
File renamed without changes.
File renamed without changes.

e2e/files/data/blue.jpg

309 Bytes
Loading

e2e/files/data/red.jpg

310 Bytes
Loading

e2e/files/data/yellow.jpg

310 Bytes
Loading

e2e/files/upload-files.spec.tsx

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
import { faker } from "@faker-js/faker";
2+
import { expect, test } from "@playwright/test";
3+
import path from "path";
4+
import { fileURLToPath } from "url";
5+
6+
const __filename = fileURLToPath(import.meta.url);
7+
const __dirname = path.dirname(__filename);
8+
9+
test.describe.serial("Users can upload files", () => {
10+
const username = faker.internet.userName();
11+
const password = "password";
12+
13+
test("Register test user", async ({ page }) => {
14+
await page.goto("/register");
15+
16+
await page.getByLabel("Username").fill(username);
17+
await page.getByLabel("Password", { exact: true }).fill(password);
18+
await page.getByLabel("Confirm Password", { exact: true }).fill(password);
19+
await page.getByRole("button", { name: "Submit", exact: true }).click();
20+
21+
await expect(page.getByText("Account created successfully")).toBeVisible();
22+
await page.waitForURL(/\/files$/);
23+
});
24+
25+
test("Users can upload files", async ({ page }) => {
26+
// Login with the registered user
27+
await page.goto("/login");
28+
await page.getByLabel("Username").fill(username);
29+
await page.getByLabel("Password", { exact: true }).fill(password);
30+
await page.getByRole("button", { name: "Submit", exact: true }).click();
31+
await page.waitForURL(/\/files$/);
32+
33+
// Open the upload modal
34+
await page.getByRole("button", { name: "Upload file" }).click();
35+
await expect(page.getByRole("dialog")).toBeVisible();
36+
await expect(page.getByText("Upload files", { exact: true })).toBeVisible();
37+
38+
// Upload a file
39+
const filesInput = page.getByLabel("Choose files to upload", {
40+
exact: true
41+
});
42+
await filesInput.setInputFiles([
43+
path.join(__dirname, "data/yellow.jpg"),
44+
path.join(__dirname, "data/blue.jpg"),
45+
path.join(__dirname, "data/red.jpg")
46+
]);
47+
48+
// Submit the form
49+
await page.getByRole("button", { name: "Upload", exact: true }).click();
50+
51+
// Assert the modal is closed
52+
await expect(page.getByRole("dialog")).not.toBeVisible();
53+
54+
// Assert files are shown
55+
await expect(page.getByText("yellow.jpg")).toBeVisible();
56+
await expect(page.getByText("blue.jpg")).toBeVisible();
57+
await expect(page.getByText("red.jpg")).toBeVisible();
58+
});
59+
60+
test("Users cannot upload files with the same name", async ({ page }) => {
61+
// Login with the registered user
62+
await page.goto("/login");
63+
await page.getByLabel("Username").fill(username);
64+
await page.getByLabel("Password", { exact: true }).fill(password);
65+
await page.getByRole("button", { name: "Submit", exact: true }).click();
66+
await page.waitForURL(/\/files$/);
67+
68+
// Open the upload modal
69+
await page.getByRole("button", { name: "Upload file" }).click();
70+
await expect(page.getByRole("dialog")).toBeVisible();
71+
72+
// Upload a file
73+
const filesInput = page.getByLabel("Choose files to upload", {
74+
exact: true
75+
});
76+
await filesInput.setInputFiles([path.join(__dirname, "data/yellow.jpg")]);
77+
78+
// Submit the form
79+
await page.getByRole("button", { name: "Upload", exact: true }).click();
80+
81+
// Assert the modal is closed
82+
await expect(page.getByRole("dialog")).not.toBeVisible();
83+
84+
// Assert an alert is shown
85+
await expect(
86+
page.getByText(
87+
"A file with the same name already exists in the given directory"
88+
)
89+
).toBeVisible();
90+
});
91+
});

package.json

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "unofficial-frontend-react",
33
"private": true,
4-
"version": "0.0.0",
4+
"version": "0.3.0",
55
"type": "module",
66
"scripts": {
77
"dev": "vite",
@@ -17,8 +17,11 @@
1717
},
1818
"dependencies": {
1919
"@hookform/resolvers": "^3.3.2",
20+
"@radix-ui/react-dialog": "^1.0.5",
21+
"@radix-ui/react-dropdown-menu": "^2.0.6",
2022
"@radix-ui/react-label": "^2.0.2",
2123
"@radix-ui/react-slot": "^1.0.2",
24+
"@radix-ui/react-tabs": "^1.0.4",
2225
"axios": "1.5.1",
2326
"class-variance-authority": "^0.7.0",
2427
"clsx": "^2.0.0",

0 commit comments

Comments
 (0)