Fix invisible admin sidebar links; add e2e nav smoke.

2026-08-05 16:57:55 -04:00
parent 2d3f1dee92
commit b3b3904cf3
3 changed files with 63 additions and 2 deletions
@@ -0,0 +1,60 @@
+import { z } from 'zod';
+import { test, expect } from '../fixtures';
+import { DEFAULT_ADMIN_BASE_URL } from '../env-defaults';
+
+const TokenResponse = z.object({
+  access_token: z.string().min(1),
+  refresh_token: z.string().min(1),
+});
+
+/**
+ * Admin sidebar primary nav must be visible after Chabad chrome (CSS-var
+ * opacity modifiers made inactive links transparent — #104).
+ */
+test.describe('admin sidebar nav @smoke', () => {
+  const adminBaseUrl = process.env.PLAYKIT_ADMIN_BASE_URL || DEFAULT_ADMIN_BASE_URL;
+
+  test('primary workflow links are visible in the sidebar', async ({ page, api }) => {
+    const username = process.env.E2E_API_USERNAME || '';
+    const password = process.env.E2E_API_PASSWORD || '';
+    test.skip(!username || !password, 'E2E_API_USERNAME/PASSWORD required for admin UI');
+
+    const tokens = await api.post<z.infer<typeof TokenResponse>>('/api/v1/auth/login', {
+      body: { username, password },
+      expectedStatus: 200,
+      schema: TokenResponse,
+    });
+
+    await page.goto(`${adminBaseUrl}/login`);
+    await page.evaluate(
+      ({ access, refresh }) => {
+        localStorage.setItem('access_token', access);
+        localStorage.setItem('refresh_token', refresh);
+      },
+      {
+        access: tokens.data.access_token,
+        refresh: tokens.data.refresh_token,
+      },
+    );
+    await page.goto(`${adminBaseUrl}/`);
+    await expect(page.getByRole('button', { name: /Log\s*out/i })).toBeVisible({
+      timeout: 30_000,
+    });
+
+    const nav = page.getByRole('navigation', { name: 'Primary' });
+    await expect(nav).toBeVisible();
+
+    for (const label of ['Scan', 'Process', 'Search photos', 'People', 'Tag photos']) {
+      const link = nav.getByRole('link', { name: label, exact: true });
+      await expect(link, `sidebar missing visible link: ${label}`).toBeVisible();
+      // Guard against transparent text (CSS-var + /opacity bug)
+      await expect(link).toHaveCSS('opacity', '1');
+      const color = await link.evaluate((el) => getComputedStyle(el).color);
+      expect(color, `${label} must not be transparent`).not.toBe('rgba(0, 0, 0, 0)');
+      expect(color).not.toMatch(/rgba?\(\s*0,\s*0,\s*0,\s*0\s*\)/);
+    }
+
+    await expect(nav.getByRole('button', { name: /Maintenance/i })).toBeVisible();
+    await expect(nav.getByRole('link', { name: 'Help', exact: true })).toBeVisible();
+  });
+});