nt_web_template/full-stack-fastapi-template
2
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

🛂 Migrate to Chakra UI v3 (#1496)

Browse Source 
Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
Alejandra
2025-02-17 19:33:00 +00:00
committed by GitHub
parent 74e2604faf
commit 55df823739
60 changed files with 4682 additions and 4399 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
frontend/tests/user-settings.spec.ts
View File

@@ -1,8 +1,8 @@
import { expect, test } from "@playwright/test"
import { firstSuperuser, firstSuperuserPassword } from "./config.ts"
import { createUser } from "./utils/privateApi.ts"
import { randomEmail, randomPassword } from "./utils/random"
import { logInUser, logOutUser } from "./utils/user"
import { createUser } from "./utils/privateApi.ts"
const tabs = ["My profile", "Password", "Appearance"]
@@ -151,9 +151,9 @@ test.describe("Change password successfully", () => {
await page.goto("/settings")
await page.getByRole("tab", { name: "Password" }).click()
await page.getByLabel("Current Password*").fill(password)
await page.getByLabel("Set Password*").fill(NewPassword)
await page.getByLabel("Confirm Password*").fill(NewPassword)
await page.getByPlaceholder("Current Password").fill(password)
await page.getByPlaceholder("New Password").fill(NewPassword)
await page.getByPlaceholder("Confirm Password").fill(NewPassword)
await page.getByRole("button", { name: "Save" }).click()
await expect(page.getByText("Password updated successfully.")).toBeVisible()
@@ -179,9 +179,9 @@ test.describe("Change password with invalid data", () => {
await page.goto("/settings")
await page.getByRole("tab", { name: "Password" }).click()
await page.getByLabel("Current Password*").fill(password)
await page.getByLabel("Set Password*").fill(weakPassword)
await page.getByLabel("Confirm Password*").fill(weakPassword)
await page.getByPlaceholder("Current Password").fill(password)
await page.getByPlaceholder("New Password").fill(weakPassword)
await page.getByPlaceholder("Confirm Password").fill(weakPassword)
await expect(
page.getByText("Password must be at least 8 characters"),
).toBeVisible()
@@ -202,11 +202,11 @@ test.describe("Change password with invalid data", () => {
await page.goto("/settings")
await page.getByRole("tab", { name: "Password" }).click()
await page.getByLabel("Current Password*").fill(password)
await page.getByLabel("Set Password*").fill(newPassword)
await page.getByLabel("Confirm Password*").fill(confirmPassword)
await page.getByRole("button", { name: "Save" }).click()
await expect(page.getByText("Passwords do not match")).toBeVisible()
await page.getByPlaceholder("Current Password").fill(password)
await page.getByPlaceholder("New Password").fill(newPassword)
await page.getByPlaceholder("Confirm Password").fill(confirmPassword)
await page.getByLabel("Password", { exact: true }).locator("form").click()
await expect(page.getByText("The passwords do not match")).toBeVisible()
})
test("Current password and new password are the same", async ({ page }) => {
@@ -220,9 +220,9 @@ test.describe("Change password with invalid data", () => {
await page.goto("/settings")
await page.getByRole("tab", { name: "Password" }).click()
await page.getByLabel("Current Password*").fill(password)
await page.getByLabel("Set Password*").fill(password)
await page.getByLabel("Confirm Password*").fill(password)
await page.getByPlaceholder("Current Password").fill(password)
await page.getByPlaceholder("New Password").fill(password)
await page.getByPlaceholder("Confirm Password").fill(password)
await page.getByRole("button", { name: "Save" }).click()
await expect(
page.getByText("New password cannot be the same as the current one"),
@@ -238,22 +238,50 @@ test("Appearance tab is visible", async ({ page }) => {
await expect(page.getByLabel("Appearance")).toBeVisible()
})
test("User can switch from light mode to dark mode", async ({ page }) => {
test("User can switch from light mode to dark mode and vice versa", async ({
page,
}) => {
await page.goto("/settings")
await page.getByRole("tab", { name: "Appearance" }).click()
await page.getByLabel("Appearance").locator("span").nth(3).click()
// Ensure the initial state is light mode
if (
await page.evaluate(() =>
document.documentElement.classList.contains("dark"),
)
) {
await page
.locator("label")
.filter({ hasText: "Light Mode" })
.locator("span")
.first()
.click()
}
let isLightMode = await page.evaluate(() =>
document.documentElement.classList.contains("light"),
)
expect(isLightMode).toBe(true)
await page
.locator("label")
.filter({ hasText: "Dark Mode" })
.locator("span")
.first()
.click()
const isDarkMode = await page.evaluate(() =>
document.body.classList.contains("chakra-ui-dark"),
document.documentElement.classList.contains("dark"),
)
expect(isDarkMode).toBe(true)
})
test("User can switch from dark mode to light mode", async ({ page }) => {
await page.goto("/settings")
await page.getByRole("tab", { name: "Appearance" }).click()
await page.getByLabel("Appearance").locator("span").first().click()
const isLightMode = await page.evaluate(() =>
document.body.classList.contains("chakra-ui-light"),
await page
.locator("label")
.filter({ hasText: "Light Mode" })
.locator("span")
.first()
.click()
isLightMode = await page.evaluate(() =>
document.documentElement.classList.contains("light"),
)
expect(isLightMode).toBe(true)
})
@@ -261,13 +289,42 @@ test("User can switch from dark mode to light mode", async ({ page }) => {
test("Selected mode is preserved across sessions", async ({ page }) => {
await page.goto("/settings")
await page.getByRole("tab", { name: "Appearance" }).click()
await page.getByLabel("Appearance").locator("span").nth(3).click()
// Ensure the initial state is light mode
if (
await page.evaluate(() =>
document.documentElement.classList.contains("dark"),
)
) {
await page
.locator("label")
.filter({ hasText: "Light Mode" })
.locator("span")
.first()
.click()
}
const isLightMode = await page.evaluate(() =>
document.documentElement.classList.contains("light"),
)
expect(isLightMode).toBe(true)
await page
.locator("label")
.filter({ hasText: "Dark Mode" })
.locator("span")
.first()
.click()
let isDarkMode = await page.evaluate(() =>
document.documentElement.classList.contains("dark"),
)
expect(isDarkMode).toBe(true)
await logOutUser(page)
await logInUser(page, firstSuperuser, firstSuperuserPassword)
const isDarkMode = await page.evaluate(() =>
document.body.classList.contains("chakra-ui-dark"),
isDarkMode = await page.evaluate(() =>
document.documentElement.classList.contains("dark"),
)
expect(isDarkMode).toBe(true)
})