feat: add Playwright E2E testing setup with POM and testids

- Install @playwright/test and Chromium browser
- Create playwright.config.ts with dev server integration
- Add data-testid attributes to LoginPage, DashboardPage, ServerCard, Sidebar
- Exclude tests-e2e from vitest config
- Create Page Object Models: LoginPage, DashboardPage
- Add 18 E2E tests: 6 login flow, 12 dashboard (happy, empty, error states)
- Add test:e2e and test:e2e:ui scripts to package.json

frontend/tests-e2e/auth/login.spec.ts

@@ -0,0 +1,95 @@
+import { test, expect } from "@playwright/test";
+import { LoginPage } from "../pages/LoginPage";
+
+test.describe("Login Flow", () => {
+  let loginPage: LoginPage;
+
+  test.beforeEach(async ({ page }) => {
+    loginPage = new LoginPage(page);
+    await loginPage.goto();
+  });
+
+  test("should display login form", async () => {
+    await expect(loginPage.card).toBeVisible();
+    await expect(loginPage.usernameInput).toBeVisible();
+    await expect(loginPage.passwordInput).toBeVisible();
+    await expect(loginPage.submitButton).toBeVisible();
+    await expect(loginPage.submitButton).toContainText("Sign In");
+  });
+
+  test("should show Languard branding", async () => {
+    await expect(loginPage.card.locator("h1")).toContainText("Languard");
+    await expect(loginPage.card.locator("p")).toContainText("Server Manager");
+  });
+
+  test("should show validation errors on empty submit", async ({ page }) => {
+    await loginPage.submitButton.click();
+    await expect(page.locator("text=Username is required")).toBeVisible();
+    await expect(page.locator("text=Password is required")).toBeVisible();
+  });
+
+  test("should show error on invalid credentials", async ({ page }) => {
+    await loginPage.login("invalid", "credentials");
+    await page.waitForResponse(
+      (resp) => resp.url().includes("/api/auth/login"),
+      { timeout: 10_000 },
+    ).catch(() => {});
+    await expect(loginPage.errorMessage).toBeVisible({ timeout: 10_000 });
+  });
+
+  test("should navigate to dashboard on successful login", async ({ page }) => {
+    await page.route("**/api/auth/login", (route) =>
+      route.fulfill({
+        status: 200,
+        contentType: "application/json",
+        body: JSON.stringify({
+          success: true,
+          data: {
+            access_token: "mock-jwt-token",
+            user: { id: 1, username: "admin", role: "admin" },
+          },
+        }),
+      }),
+    );
+
+    await page.route("**/api/servers*", (route) =>
+      route.fulfill({
+        status: 200,
+        contentType: "application/json",
+        body: JSON.stringify({ success: true, data: [] }),
+      }),
+    );
+
+    await loginPage.login("admin", "password");
+    await page.waitForURL("/", { timeout: 10_000 });
+    await expect(page.locator("text=Dashboard")).toBeVisible();
+  });
+
+  test("should show loading state while submitting", async ({ page }) => {
+    await page.route("**/api/auth/login", (route) =>
+      route.fulfill({
+        status: 200,
+        contentType: "application/json",
+        body: JSON.stringify({
+          success: true,
+          data: {
+            access_token: "mock-jwt-token",
+            user: { id: 1, username: "admin", role: "admin" },
+          },
+        }),
+        delay: 500,
+      }),
+    );
+
+    await page.route("**/api/servers*", (route) =>
+      route.fulfill({
+        status: 200,
+        contentType: "application/json",
+        body: JSON.stringify({ success: true, data: [] }),
+      }),
+    );
+
+    await loginPage.login("admin", "password");
+    await expect(loginPage.submitButton).toContainText("Signing in...");
+  });
+});