import { expect, test } from "@playwright/test";

test("sidebar geometry, recent navigation, user menu and compact tools", async ({
  page,
}) => {
  await page.goto("/");
  await page.getByLabel("密码", { exact: true }).fill("browser-test-password");
  await page.getByRole("button", { name: "进入工作空间" }).click();
  const sidebar = page.locator(".app-sidebar");
  const nav = page.getByRole("navigation", { name: "主导航", exact: true });
  const recent = page.getByRole("navigation", {
    name: "最近访问",
    exact: true,
  });
  await expect(sidebar).toHaveCSS("width", "230px");
  await expect(page.locator(".workspace")).toHaveCSS("padding-left", "230px");
  await expect(page.getByRole("toolbar").getByRole("button")).toHaveCount(3);
  await expect(page.locator(".topbar")).toHaveCount(0);
  await page.getByRole("button", { name: "配置", exact: true }).click();
  await expect(page.locator("#model-settings")).toBeInViewport();
  await expect(
    nav.getByRole("button", { name: "首页看板", exact: true }),
  ).toHaveAttribute("aria-current", "page");
  await page.locator(".settings-drawer .semi-sidesheet-close").click();
  await page.getByRole("button", { name: "用户菜单", exact: true }).click();
  await page.getByRole("button", { name: "查看个人信息", exact: true }).click();
  await expect(page.locator(".account-page #model-settings")).toHaveCount(0);
  await nav.getByRole("button", { name: "数据目录", exact: true }).click();
  await recent
    .getByRole("button", { name: "关闭最近访问：数据目录", exact: true })
    .focus();
  await page.keyboard.press("Enter");
  await expect(page).toHaveURL(/#account$/);
  await page.getByRole("button", { name: "全部关闭" }).click();
  await expect(recent.locator(".recent-item")).toHaveCount(1);
  await expect(
    recent.getByRole("button", { name: "关闭最近访问：个人信息", exact: true }),
  ).toBeDisabled();
  await page.screenshot({ path: "../output/playwright/sidebar-expanded.png" });
  await page.getByRole("button", { name: "收起导航", exact: true }).click();
  await expect(sidebar).toHaveCSS("width", "64px");
  await expect(page.locator(".workspace")).toHaveCSS("padding-left", "64px");
  await nav.getByRole("button", { name: "Alpha 管理", exact: true }).click();
  await page.getByRole("button", { name: "用户菜单" }).click();
  await expect(page.getByRole("button", { name: "退出登录" })).toBeVisible();
  await page.getByRole("button", { name: "切换深色主题" }).click();
  await expect(page.locator("body")).toHaveAttribute("theme-mode", "dark");
  await page.screenshot({
    path: "../output/playwright/sidebar-collapsed-dark.png",
  });
  await page.getByRole("button", { name: "切换浅色主题" }).click();
  await expect(page.locator("body")).toHaveAttribute("theme-mode", "light");
  await page.keyboard.press("Escape");
  await page.getByRole("button", { name: "展开导航", exact: true }).click();
  await page.getByRole("button", { name: "快捷导航" }).click();
  await page
    .getByRole("dialog")
    .getByRole("button", { name: "回测研究" })
    .click();
  await expect(
    nav.getByRole("button", { name: "回测研究", exact: true }),
  ).toHaveAttribute("aria-current", "page");
  await page.getByRole("button", { name: "同步任务", exact: true }).click();
  await expect(page.locator(".job-panel")).toBeVisible();
  // The drawer must receive pointer events where the global tools sit behind it.
  await expect.poll(() =>
    page.getByRole("toolbar").getByRole("button").evaluateAll((buttons) =>
      buttons.every((button) => {
        const rect = button.getBoundingClientRect();
        return Boolean(document.elementFromPoint(
          rect.x + rect.width / 2,
          rect.y + rect.height / 2,
        )?.closest(".job-panel"));
      }),
    ),
  ).toBe(true);
  await page.locator(".job-panel .semi-sidesheet-close").click();
  await expect(page.locator(".job-panel")).not.toBeVisible();
  await page.getByRole("button", { name: "切换研究助手" }).click();
  await expect(page.locator(".ai-chat")).toBeVisible();
  await page.getByRole("button", { name: "收起研究助手" }).click();
  await page.setViewportSize({ width: 390, height: 900 });
  await expect(sidebar).not.toBeVisible();
  await expect(page.locator(".workspace")).toHaveCSS("padding-left", "0px");
  await page.keyboard.press("Control+k");
  await page
    .getByRole("dialog")
    .getByRole("button", { name: "Alpha 管理" })
    .click();
  await expect(
    page.getByRole("tab", { name: "待提交", exact: true }),
  ).toBeVisible();
  expect(
    await page.evaluate(
      () => document.documentElement.scrollWidth <= innerWidth,
    ),
  ).toBe(true);
  await expect(page.getByRole("dialog")).not.toBeVisible();
  await page.screenshot({
    path: "../output/playwright/sidebar-mobile.png",
    animations: "disabled",
  });
});