Skip to content

Commit d94792c

Browse files
pre-commit-ci-lite[bot]pre-commit-ci-lite[bot]
authored
🎨 Auto format and update with pre-commit
1 parent 4e33975 commit d94792c

File tree

2 files changed

+223
-186
lines changed

2 files changed

+223
-186
lines changed

‎frontend/tests/admin.spec.ts‎

Lines changed: 198 additions & 169 deletions
Original file line numberDiff line numberDiff line change
@@ -1,172 +1,201 @@
1-
import { expect, test } from "@playwright/test";
2-
import { UserRole, verifyUserRow } from "./utils/admin";
3-
4-
5-
test.describe('Admin Page', () => {
6-
test.beforeEach(async ({ page }) => {
7-
await test.step("Open the admin page", async () => {
8-
await page.goto("/admin")
9-
})
10-
});
11-
12-
test("Admin tab table should be visible", async ({ page }) => {
13-
await test.step('Check elements visibility', async () => {
14-
await expect(page.getByRole('heading', { name: 'Users', level: 1 })).toBeVisible();
15-
await expect(page.getByText('Manage user accounts and permissions')).toBeVisible();
16-
await expect(page.getByRole('button', { name: 'Add User' })).toBeVisible();
17-
await expect(page.locator('th[data-slot="table-head"]')).toHaveText([
18-
'Full Name',
19-
'Email',
20-
'Role',
21-
'Status',
22-
'Actions'
23-
])
24-
});
25-
26-
await test.step('Check the user table', async () => {
27-
await verifyUserRow(page, 'N/A', 'admin@example.com', UserRole.SUPERUSER, 'Active', true);
28-
});
1+
import { expect, test } from "@playwright/test"
2+
import { UserRole, verifyUserRow } from "./utils/admin"
3+
4+
test.describe("Admin Page", () => {
5+
test.beforeEach(async ({ page }) => {
6+
await test.step("Open the admin page", async () => {
7+
await page.goto("/admin")
8+
})
9+
})
10+
11+
test("Admin tab table should be visible", async ({ page }) => {
12+
await test.step("Check elements visibility", async () => {
13+
await expect(
14+
page.getByRole("heading", { name: "Users", level: 1 }),
15+
).toBeVisible()
16+
await expect(
17+
page.getByText("Manage user accounts and permissions"),
18+
).toBeVisible()
19+
await expect(page.getByRole("button", { name: "Add User" })).toBeVisible()
20+
await expect(page.locator('th[data-slot="table-head"]')).toHaveText([
21+
"Full Name",
22+
"Email",
23+
"Role",
24+
"Status",
25+
"Actions",
26+
])
27+
})
28+
29+
await test.step("Check the user table", async () => {
30+
await verifyUserRow(
31+
page,
32+
"N/A",
33+
"admin@example.com",
34+
UserRole.SUPERUSER,
35+
"Active",
36+
true,
37+
)
38+
})
39+
})
40+
41+
test("User Dialog should have all fields visible", async ({ page }) => {
42+
const addUserBtn = page.getByRole("button", { name: "Add User" })
43+
44+
await test.step("Open the Dialog", async () => {
45+
await expect(addUserBtn).toBeVisible()
46+
await addUserBtn.click()
47+
})
48+
49+
const dialog = page.getByRole("dialog", { name: "Add User" })
50+
51+
await test.step("Fill Inputs", async () => {
52+
await expect(dialog).toBeVisible()
53+
await expect(
54+
page.getByRole("heading", { name: "Add User", level: 2 }),
55+
).toBeVisible()
56+
await expect(
57+
dialog.getByText("Fill in the form below to add a new user"),
58+
).toBeVisible()
59+
60+
const fields = ["Email", "Full Name", "Set Password", "Confirm Password"]
61+
for (const field of fields) {
62+
await expect(dialog.getByLabel(field)).toBeVisible()
63+
await expect(
64+
dialog
65+
.locator('label[data-slot="form-label"]')
66+
.filter({ hasText: field }),
67+
).toBeVisible()
68+
}
69+
70+
// Checkboxes
71+
await expect(
72+
dialog.getByRole("checkbox", { name: "Is superuser?" }),
73+
).toBeVisible()
74+
await expect(
75+
dialog.getByRole("checkbox", { name: "Is active?" }),
76+
).toBeVisible()
77+
})
78+
79+
await test.step("Close the Dialog", async () => {
80+
// Footer Buttons
81+
const cancelBtn = dialog.getByRole("button", { name: "Cancel" })
82+
await expect(cancelBtn).toBeVisible()
83+
await expect(dialog.getByRole("button", { name: "Save" })).toBeVisible()
84+
85+
// Close the dialog
86+
await cancelBtn.click()
87+
// Check if Add User button is visible after closing the dialog
88+
await expect(addUserBtn).toBeVisible()
89+
})
90+
})
91+
92+
test("User Dialog should have all error fields visible", async ({ page }) => {
93+
const addUserBtn = page.getByRole("button", { name: "Add User" })
94+
95+
await test.step("Open the Dialog", async () => {
96+
await expect(addUserBtn).toBeVisible()
97+
await addUserBtn.click()
98+
})
99+
100+
const dialog = page.getByRole("dialog", { name: "Add User" })
101+
102+
await test.step("Trigger error messages", async () => {
103+
await expect(dialog).toBeVisible()
104+
105+
// Trigger error messages by clicking on input field
106+
await dialog.getByLabel("Email").click()
107+
await dialog.getByLabel("Set Password").click()
108+
await dialog.getByLabel("Confirm Password").click()
109+
110+
// Click Save to trigger error message on 'Confirm Password' field
111+
const saveBtn = dialog.getByRole("button", { name: "Save" })
112+
await saveBtn.click()
113+
114+
// Check the error messages
115+
await expect(dialog.getByText("Invalid email address")).toBeVisible()
116+
await expect(dialog.getByText("Password is required")).toBeVisible()
117+
await expect(
118+
dialog.getByText("Please confirm your password"),
119+
).toBeVisible()
120+
})
121+
122+
await test.step("Close the Dialog", async () => {
123+
const cancelBtn = dialog.getByRole("button", { name: "Cancel" })
124+
await cancelBtn.click()
125+
// Check if Add User button is visible after closing the dialog
126+
await expect(dialog).toBeHidden()
127+
await expect(addUserBtn).toBeVisible()
128+
})
129+
})
130+
131+
test("Admin should fill out the Add User form, save then delete it", async ({
132+
page,
133+
}) => {
134+
const email = "becebal.burebista@example.com"
135+
const fullName = "Decebal Burebista"
136+
const password = "SecurePass123!"
137+
138+
const addUserBtn = page.getByRole("button", { name: "Add User" })
139+
await expect(addUserBtn).toBeVisible()
140+
await addUserBtn.click()
141+
142+
const dialog = page.getByRole("dialog", { name: "Add User" })
143+
await expect(dialog).toBeVisible()
144+
145+
await test.step("Fill out text and password fields", async () => {
146+
await dialog.getByLabel("Email").fill(email)
147+
await dialog.getByLabel("Full Name").fill(fullName)
148+
await dialog.locator('input[name="password"]').fill(password)
149+
await dialog.locator('input[name="confirm_password"]').fill(password)
150+
151+
// Toggle Checkboxes
152+
const superuserCheckbox = dialog.getByRole("checkbox", {
153+
name: "Is superuser?",
154+
})
155+
const activeCheckbox = dialog.getByRole("checkbox", {
156+
name: "Is active?",
157+
})
158+
159+
await superuserCheckbox.check()
160+
await activeCheckbox.check()
161+
162+
// Verify the data was entered correctly before saving
163+
await expect(dialog.getByLabel("Email")).toHaveValue(email)
164+
await expect(dialog.getByLabel("Full Name")).toHaveValue(fullName)
165+
await expect(dialog.getByLabel("Set Password")).toHaveValue(password)
166+
await expect(dialog.getByLabel("Confirm Password")).toHaveValue(password)
167+
await expect(superuserCheckbox).toBeChecked()
168+
await expect(activeCheckbox).toBeChecked()
29169
})
30170

171+
await test.step("Save the User", async () => {
172+
const saveButton = dialog.getByRole("button", { name: "Save" })
173+
await saveButton.click()
31174

32-
test('User Dialog should have all fields visible', async ({ page }) => {
33-
const addUserBtn = page.getByRole('button', { name: 'Add User' });
34-
35-
await test.step("Open the Dialog", async () => {
36-
await expect(addUserBtn).toBeVisible();
37-
await addUserBtn.click();
38-
});
39-
40-
const dialog = page.getByRole('dialog', { name: 'Add User' });
41-
42-
await test.step("Fill Inputs", async () => {
43-
await expect(dialog).toBeVisible();
44-
await expect(page.getByRole('heading', { name: 'Add User', level: 2 })).toBeVisible();
45-
await expect(dialog.getByText('Fill in the form below to add a new user')).toBeVisible();
46-
47-
const fields = ['Email', 'Full Name', 'Set Password', 'Confirm Password'];
48-
for (const field of fields) {
49-
await expect(dialog.getByLabel(field)).toBeVisible();
50-
await expect(dialog.locator('label[data-slot="form-label"]').filter({ hasText: field }))
51-
.toBeVisible();
52-
}
53-
54-
// Checkboxes
55-
await expect(dialog.getByRole('checkbox', { name: 'Is superuser?' })).toBeVisible();
56-
await expect(dialog.getByRole('checkbox', { name: 'Is active?' })).toBeVisible();
57-
});
58-
59-
await test.step("Close the Dialog", async () => {
60-
// Footer Buttons
61-
const cancelBtn = dialog.getByRole('button', { name: 'Cancel' });
62-
await expect(cancelBtn).toBeVisible();
63-
await expect(dialog.getByRole('button', { name: 'Save' })).toBeVisible();
64-
65-
// Close the dialog
66-
await cancelBtn.click();
67-
// Check if Add User button is visible after closing the dialog
68-
await expect(addUserBtn).toBeVisible();
69-
});
70-
});
71-
72-
73-
test('User Dialog should have all error fields visible', async ({ page }) => {
74-
const addUserBtn = page.getByRole('button', { name: 'Add User' });
75-
76-
await test.step("Open the Dialog", async () => {
77-
await expect(addUserBtn).toBeVisible();
78-
await addUserBtn.click();
79-
});
80-
81-
const dialog = page.getByRole('dialog', { name: 'Add User' });
82-
83-
await test.step("Trigger error messages", async () => {
84-
await expect(dialog).toBeVisible();
85-
86-
// Trigger error messages by clicking on input field
87-
await dialog.getByLabel('Email').click();
88-
await dialog.getByLabel('Set Password').click();
89-
await dialog.getByLabel('Confirm Password').click();
90-
91-
// Click Save to trigger error message on 'Confirm Password' field
92-
const saveBtn = dialog.getByRole('button', { name: 'Save' });
93-
await saveBtn.click();
94-
95-
// Check the error messages
96-
await expect(dialog.getByText('Invalid email address')).toBeVisible();
97-
await expect(dialog.getByText('Password is required')).toBeVisible();
98-
await expect(dialog.getByText('Please confirm your password')).toBeVisible();
99-
});
100-
101-
await test.step("Close the Dialog", async () => {
102-
const cancelBtn = dialog.getByRole('button', { name: 'Cancel' });
103-
await cancelBtn.click();
104-
// Check if Add User button is visible after closing the dialog
105-
await expect(dialog).toBeHidden();
106-
await expect(addUserBtn).toBeVisible();
107-
});
108-
});
109-
110-
111-
test('Admin should fill out the Add User form, save then delete it', async ({ page }) => {
112-
const email = 'becebal.burebista@example.com';
113-
const fullName = 'Decebal Burebista';
114-
const password = 'SecurePass123!';
115-
116-
const addUserBtn = page.getByRole('button', { name: 'Add User' });
117-
await expect(addUserBtn).toBeVisible();
118-
await addUserBtn.click();
119-
120-
const dialog = page.getByRole('dialog', { name: 'Add User' });
121-
await expect(dialog).toBeVisible();
122-
123-
await test.step("Fill out text and password fields", async () => {
124-
await dialog.getByLabel('Email').fill(email);
125-
await dialog.getByLabel('Full Name').fill(fullName);
126-
await dialog.locator('input[name="password"]').fill(password);
127-
await dialog.locator('input[name="confirm_password"]').fill(password);
128-
129-
// Toggle Checkboxes
130-
const superuserCheckbox = dialog.getByRole('checkbox', { name: 'Is superuser?' });
131-
const activeCheckbox = dialog.getByRole('checkbox', { name: 'Is active?' });
132-
133-
await superuserCheckbox.check();
134-
await activeCheckbox.check();
135-
136-
// Verify the data was entered correctly before saving
137-
await expect(dialog.getByLabel('Email')).toHaveValue(email);
138-
await expect(dialog.getByLabel('Full Name')).toHaveValue(fullName);
139-
await expect(dialog.getByLabel('Set Password')).toHaveValue(password);
140-
await expect(dialog.getByLabel('Confirm Password')).toHaveValue(password);
141-
await expect(superuserCheckbox).toBeChecked();
142-
await expect(activeCheckbox).toBeChecked();
143-
});
144-
145-
await test.step("Save the User", async () => {
146-
const saveButton = dialog.getByRole('button', { name: 'Save' });
147-
await saveButton.click();
148-
149-
// Verify the dialog closes
150-
await expect(dialog).toBeHidden();
151-
await expect(addUserBtn).toBeVisible();
152-
});
153-
154-
await test.step("Check the new user in the user table", async () => {
155-
await verifyUserRow(page, fullName, email, UserRole.SUPERUSER, 'Active');
156-
});
157-
158-
await test.step("Cleanup", async () => {
159-
const userRow = page.getByRole('row').filter({ hasText: email });
160-
161-
// Click the "ellipsis" trigger inside that row
162-
await userRow.getByRole('button', { name: 'menu' }).or(userRow.locator('[data-slot="dropdown-menu-trigger"]')).click();
163-
164-
// Click "Delete User" from the menu that appears globally
165-
await page.getByRole('menuitem', { name: 'Delete User' }).click();
166-
167-
// Confirm the deletion in the resulting dialog
168-
const confirmDialog = page.getByRole('dialog');
169-
await confirmDialog.getByRole('button', { name: 'Delete' }).click();
170-
});
171-
});
172-
});
175+
// Verify the dialog closes
176+
await expect(dialog).toBeHidden()
177+
await expect(addUserBtn).toBeVisible()
178+
})
179+
180+
await test.step("Check the new user in the user table", async () => {
181+
await verifyUserRow(page, fullName, email, UserRole.SUPERUSER, "Active")
182+
})
183+
184+
await test.step("Cleanup", async () => {
185+
const userRow = page.getByRole("row").filter({ hasText: email })
186+
187+
// Click the "ellipsis" trigger inside that row
188+
await userRow
189+
.getByRole("button", { name: "menu" })
190+
.or(userRow.locator('[data-slot="dropdown-menu-trigger"]'))
191+
.click()
192+
193+
// Click "Delete User" from the menu that appears globally
194+
await page.getByRole("menuitem", { name: "Delete User" }).click()
195+
196+
// Confirm the deletion in the resulting dialog
197+
const confirmDialog = page.getByRole("dialog")
198+
await confirmDialog.getByRole("button", { name: "Delete" }).click()
199+
})
200+
})
201+
})

0 commit comments

Comments
 (0)