cesnimda/jobtrackingapp
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

test(kanban): verify required browser states
CI and Deploy / test (pull_request) Successful in 4m43s
Details
CI and Deploy / deploy (pull_request) Has been skipped
Details

Browse Source
This commit is contained in:
cesnimda
2026-08-10 11:15:37 +02:00
parent fb6f17e1f3
commit 4e5ce0c447
2 changed files with 17 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/audits/evidence/ux-003-kanban-dark-after.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 90 KiB

After

Width:  |  Height:  |  Size: 98 KiB

job-tracker-ui/e2e/kanban-theme.spec.ts
+17 -1
View File
@@ -42,6 +42,7 @@ test("kanban columns use dark theme surfaces", async ({ page }) => {
await page.route("**/api/jobapplications/71/status", async (route) => { moveRequests += 1; await route.fulfill({ json: {} }); });
await login(page);
await page.setViewportSize({ width: 1440, height: 900 });
await page.goto("/kanban");
await expect(page.getByText("Synthetic platform engineer")).toBeVisible();
const column = page.getByText("Not Applied", { exact: true }).locator("xpath=ancestor::*[contains(@class,'MuiPaper-root')][1]");
@@ -60,7 +61,7 @@ test("kanban columns use dark theme surfaces", async ({ page }) => {
await expect.poll(() => moveRequests).toBe(1);
await expect(page.getByText("Job moved to Applied.")).toBeAttached();
await page.setViewportSize({ width: 375, height: 812 });
await page.setViewportSize({ width: 768, height: 900 });
await page.evaluate(() => (document.activeElement as HTMLElement | null)?.blur());
const overflow = await page.evaluate(() => ({
documentWidth: document.documentElement.scrollWidth,
@@ -85,4 +86,19 @@ test("kanban columns use dark theme surfaces", async ({ page }) => {
await expect(page.locator("html")).toHaveAttribute("data-color-scheme", "light");
const lightColumn = page.getByText("Not Applied", { exact: true }).locator("xpath=ancestor::*[contains(@class,'MuiPaper-root')][1]");
expect(await lightColumn.evaluate((element) => getComputedStyle(element).backgroundColor)).toBe("rgb(245, 242, 250)");
await page.setViewportSize({ width: 1440, height: 900 });
const lightCard = page.getByText("Synthetic platform engineer", { exact: true }).locator("xpath=ancestor::*[contains(@class,'MuiCard-root')][1]");
await lightCard.hover();
expect(await lightCard.evaluate((element) => getComputedStyle(element).transform)).not.toBe("none");
await lightCard.dragTo(page.getByRole("group", { name: "Active column" }));
await expect.poll(() => moveRequests).toBe(2);
await page.setViewportSize({ width: 375, height: 812 });
const mobileScroll = await page.evaluate(() => {
document.documentElement.scrollLeft = 999;
const scrollLeft = document.documentElement.scrollLeft;
document.documentElement.scrollLeft = 0;
return scrollLeft;
});
expect(mobileScroll).toBe(0);
});