@allbluecn/web-app 0.18.2 → 0.19.0

package/src/components/bug/__tests__/story-bugs-panel.test.tsx

@@ -0,0 +1,146 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+// 需求详情「关联 BUG」面板测试（照 related-test-cases.test.tsx 样板）：
+// ① 列表渲染 + 计数徽章 ② 按状态分组 → 组头出现 ③ 行复选多选 → 批量条
+// → 移出走 bulkUnlinkBugsFromStoryFn ④ 零关联 → 面板不渲染
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { cleanup, fireEvent, render, screen, waitFor, within } from "@testing-library/react";
+
+const mocks = vi.hoisted(() => ({
+  listBugsByStoryFn: vi.fn(),
+  bulkUnlinkBugsFromStoryFn: vi.fn(),
+  bulkUpdateBugsFn: vi.fn(),
+  bulkArchiveBugsFn: vi.fn(),
+  bulkDeleteBugsFn: vi.fn(),
+  navigate: vi.fn(),
+  toastSuccess: vi.fn(),
+  toastError: vi.fn(),
+}));
+
+vi.mock("@tanstack/react-router", () => ({
+  useNavigate: () => mocks.navigate,
+}));
+
+vi.mock("@/server/serverFns/bug/bug-story-bulk", () => ({
+  listBugsByStoryFn: mocks.listBugsByStoryFn,
+  bulkUnlinkBugsFromStoryFn: mocks.bulkUnlinkBugsFromStoryFn,
+  bulkLinkBugsToStoryFn: vi.fn(),
+  listBugsForSelectFn: vi.fn(),
+}));
+
+vi.mock("@/server/serverFns/bug/bug-crud", () => ({
+  bulkUpdateBugsFn: mocks.bulkUpdateBugsFn,
+  bulkArchiveBugsFn: mocks.bulkArchiveBugsFn,
+  bulkDeleteBugsFn: mocks.bulkDeleteBugsFn,
+}));
+
+vi.mock("@/components/ui/toast", () => ({
+  toast: { success: mocks.toastSuccess, error: mocks.toastError },
+}));
+
+// 弹窗整模块 mock（真实组件拖入 listBugsForSelectFn 链）
+vi.mock("@/components/bug/select-bug-dialog", () => ({
+  BugSelectDialog: () => null,
+}));
+
+import { StoryBugsPanel } from "../story-bugs-panel";
+
+const bugRow = (id: string, over: Record<string, unknown> = {}) => ({
+  id,
+  identifier: `PRJ-B${id}`,
+  title: `BUG ${id}`,
+  state: "open",
+  severity: "medium",
+  assignee: null,
+  labels: [],
+  lastOccurAt: "2026-10-10T00:00:00.000Z",
+  updatedAt: "2026-10-10T00:00:00.000Z",
+  ...over,
+});
+
+beforeEach(() => {
+  vi.clearAllMocks();
+  mocks.listBugsByStoryFn.mockResolvedValue({
+    items: [bugRow("1"), bugRow("2", { state: "fixed" })],
+  });
+});
+
+afterEach(() => {
+  cleanup();
+});
+
+describe("StoryBugsPanel 需求关联 BUG 面板", () => {
+  it("渲染 BUG 列表与计数徽章", async () => {
+    render(<StoryBugsPanel storyId="story-1" projectId="proj-1" />);
+
+    expect(await screen.findByText("BUG 1")).toBeTruthy();
+    expect(screen.getByText("BUG 2")).toBeTruthy();
+    expect(screen.getByTestId("story-bugs-panel")).toBeTruthy();
+    // 全部组头计数 = 可见 BUG 数（2）
+    expect(screen.getByText("全部")).toBeTruthy();
+    expect(screen.getAllByText("2").length).toBeGreaterThanOrEqual(1);
+  });
+
+  it("零关联 BUG → 面板不渲染", async () => {
+    mocks.listBugsByStoryFn.mockResolvedValue({ items: [] });
+    render(<StoryBugsPanel storyId="story-1" projectId="proj-1" />);
+
+    await waitFor(() => {
+      expect(mocks.listBugsByStoryFn).toHaveBeenCalled();
+    });
+    expect(screen.queryByTestId("story-bugs-panel")).toBeNull();
+  });
+
+  it("显示选项切按状态分组 → 组头出现（状态徽章 + 计数）", async () => {
+    render(<StoryBugsPanel storyId="story-1" projectId="proj-1" />);
+
+    await screen.findByText("BUG 1");
+    fireEvent.click(screen.getByTestId("story-bugs-display"));
+    // 分组与子分组区都有同名选项，须分区定位
+    const groupSection = document.querySelector('[data-section="groupBy"]');
+    expect(groupSection).toBeTruthy();
+    fireEvent.click(within(groupSection as HTMLElement).getByText("按状态"));
+    // 两组：open / fixed（组头徽章与行内徽章同文案，用 getAllByText 断言存在）
+    await waitFor(() => {
+      expect(screen.getAllByText("已修复").length).toBeGreaterThanOrEqual(2);
+    });
+    expect(screen.getAllByText("待处理").length).toBeGreaterThanOrEqual(1);
+    expect(screen.getAllByText("已修复").length).toBeGreaterThanOrEqual(1);
+  });
+
+  it("行复选多选 → 批量条出现 → 移出走 bulkUnlink", async () => {
+    render(<StoryBugsPanel storyId="story-1" projectId="proj-1" />);
+
+    await screen.findByText("BUG 1");
+    const rows = screen.getAllByTestId("bug-ref-row");
+    expect(rows).toHaveLength(2);
+    // 点行复选（Base UI Checkbox root 是 span[role=checkbox]）
+    fireEvent.click(rows[0].querySelector('[role="checkbox"]')!);
+    fireEvent.click(rows[1].querySelector('[role="checkbox"]')!);
+    const batchbar = await screen.findByTestId("story-bugs-batchbar");
+    expect(within(batchbar).getByText("已选 2 条")).toBeTruthy();
+
+    mocks.bulkUnlinkBugsFromStoryFn.mockResolvedValue({ unlinked: 2 });
+    fireEvent.click(within(batchbar).getByText("移出"));
+    await waitFor(() => {
+      expect(mocks.bulkUnlinkBugsFromStoryFn).toHaveBeenCalledWith({
+        data: { bugIds: ["1", "2"] },
+      });
+    });
+  });
+});

package/src/components/bug/__tests__/subgroup-header.test.tsx

@@ -0,0 +1,150 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+// BUG 列表双层分组（任务 40）：子组头 depth 缩进/折叠回调 + 冻结组头改写
+// computeFrozenHeader 的同构回归断言（吸顶判定与 story 同一实现，防再次漂移）。
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import { readFileSync } from "node:fs";
+import { resolve } from "node:path";
+import { TooltipProvider } from "@/components/ui/tooltip";
+import { BugGroupHeader } from "../views/bug-list/group";
+import { computeFrozenHeader } from "@/components/shared-kit/list-kit/frozen-header";
+import type { BugGroupNode } from "../display/use-paged-bug-groups";
+
+const renderWithProviders = (ui: React.ReactElement) =>
+  render(<TooltipProvider>{ui}</TooltipProvider>);
+
+function makeNode(over?: Partial<BugGroupNode>): BugGroupNode {
+  return {
+    key: "critical",
+    label: "严重",
+    items: [],
+    totalCount: 3,
+    ...over,
+  };
+}
+
+const baseHeaderProps = {
+  node: makeNode(),
+  depth: 0,
+  collapsed: false,
+  collapseKey: "state=open/severity=critical",
+  onToggle: vi.fn(),
+  selectState: false as const,
+  onToggleSelect: vi.fn(),
+  showSelect: false,
+};
+
+describe("BugGroupHeader 子组头（depth）", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+  afterEach(() => cleanup());
+
+  it("depth=1 渲染缩进（pl-4）与子组底色（bg-muted/35）", () => {
+    const { container } = renderWithProviders(
+      <BugGroupHeader {...baseHeaderProps} depth={1} />,
+    );
+    const root = container.firstElementChild as HTMLElement;
+    expect(root.className).toContain("pl-4");
+    expect(root.className).toContain("bg-muted/35");
+  });
+
+  it("depth=1 不渲染「添加」按钮（快捷创建仅一级组头持有）", () => {
+    renderWithProviders(<BugGroupHeader {...baseHeaderProps} depth={1} onCreate={() => {}} />);
+    expect(screen.queryByLabelText(/添加/)).toBeNull();
+  });
+
+  it("depth=0 保持一级形态（无缩进、bg-muted/50、Plus 可见）", () => {
+    const { container } = renderWithProviders(
+      <BugGroupHeader {...baseHeaderProps} depth={0} onCreate={() => {}} />,
+    );
+    const root = container.firstElementChild as HTMLElement;
+    expect(root.className).not.toContain("pl-4");
+    expect(root.className).toContain("bg-muted/50");
+    expect(screen.getByLabelText(/添加/)).toBeTruthy();
+  });
+
+  it("点击子组头触发折叠回调并携带路径 collapseKey", () => {
+    const onToggle = vi.fn();
+    renderWithProviders(<BugGroupHeader {...baseHeaderProps} depth={1} onToggle={onToggle} />);
+    fireEvent.click(screen.getByText("严重"));
+    expect(onToggle).toHaveBeenCalledWith("state=open/severity=critical");
+  });
+
+  it("collapsed=true 显示 ChevronRight（折叠态）且计数可见", () => {
+    renderWithProviders(<BugGroupHeader {...baseHeaderProps} depth={1} collapsed />);
+    // lucide ChevronRight 的 path d
+    const paths = document.querySelectorAll("svg path");
+    expect(Array.from(paths).some((p) => p.getAttribute("d") === "m9 18 6-6-6-6")).toBe(true);
+    expect(screen.getByText("3")).toBeTruthy();
+  });
+});
+
+// ---------------------------------------------------------------------------
+// 冻结组头同构回归：bug 列表吸顶判定必须消费共享 computeFrozenHeader
+// （任务 40 内联吸顶改写，与 story-list 同一实现；读源码断言防漂移——
+// install-commands-contract.test.ts 先例）。
+// ---------------------------------------------------------------------------
+
+const indexSource = readFileSync(resolve(import.meta.dirname, "../views/bug-list/index.tsx"), "utf8");
+
+describe("冻结组头共享实现契约（bug ↔ story 同构）", () => {
+  it("bug-list/index.tsx 从 shared-kit 导入 computeFrozenHeader（不再内联 rangeExtractor+activeStickyRef 吸顶）", () => {
+    expect(indexSource).toContain(
+      'from "@/components/shared-kit/list-kit/frozen-header"',
+    );
+    expect(indexSource).toContain("computeFrozenHeader");
+    // 旧内联机制残留必须清零
+    expect(indexSource).not.toContain("activeStickyRef");
+    expect(indexSource).not.toContain("position: sticky");
+  });
+
+  it("computeFrozenHeader 吸顶判定与 story 同构（threshold=scrollTop+1、子组 parent 归属）", () => {
+    // bug 双层扁平行布局（index → start）：
+    //   0 header(state=open)      0
+    //   1 subHeader(severity)    36
+    //   2 bug                    80
+    //   3 header(state=fixed)   200
+    const measurements = [{ start: 0 }, { start: 36 }, { start: 80 }, { start: 200 }];
+    const groupIdx = [0, 3];
+    const subIdx = [1];
+    const parentOfSub = new Map([[1, 0]]);
+
+    // 未滚动：激活首个主组、无子组
+    expect(computeFrozenHeader(0, measurements, groupIdx, subIdx, parentOfSub)).toEqual({
+      groupIdx: 0,
+      subIdx: null,
+    });
+    // +1 容差：start == scrollTop + 1 视为已到达（与 story 同一语义）
+    expect(computeFrozenHeader(35, measurements, groupIdx, subIdx, parentOfSub)).toEqual({
+      groupIdx: 0,
+      subIdx: 1,
+    });
+    // 跨到第二个主组：子组重置（不属于该主组）
+    expect(computeFrozenHeader(200, measurements, groupIdx, subIdx, parentOfSub)).toEqual({
+      groupIdx: 3,
+      subIdx: null,
+    });
+    // 负 scrollTop（overscroll）钳制
+    expect(computeFrozenHeader(-5, measurements, groupIdx, subIdx, parentOfSub)).toEqual({
+      groupIdx: 0,
+      subIdx: null,
+    });
+  });
+});

package/src/components/bug/__tests__/toolbar-shell.test.tsx

@@ -0,0 +1,369 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+// 任务 31（三期 BUG-A 收尾）：BUG 工具栏换 ToolbarShell 三列网格壳 + view/peekMode
+// localStorage 持久化。断言：壳行三列网格 + @container；总数断点 640→1100；
+// 项目按钮 ghost+Tooltip（禁 HTML title）；530 搜索降级；920 新建收纳 / 1000 视图
+// 选择器降级；「更多」菜单含导出禁用占位（任务 45 CSV 启用，testcase 19 对称）；
+// view localStorage「默认值渲染+挂载后恢复」（SSR 防脱水时序）；useToolbarCompact
+// 紧凑档抽测（testcase 19 形态）。任务 34：view 值域定版 list|board，原 table 档
+// 断言翻转（旧值回落 list，回退细断言见 view-type.test.tsx）。
+import { act } from "react";
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { render, screen, waitFor, cleanup } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { TooltipProvider } from "@/components/ui/tooltip";
+
+const h = vi.hoisted(() => ({
+  listBugGroupsFn: vi.fn(),
+  listBugsInGroupFn: vi.fn(),
+  listAllGroupsItemsFn: vi.fn(),
+  getBugDisplayOptionsFn: vi.fn(),
+  updateBugDisplayOptionsFn: vi.fn(),
+  listBugViewsFn: vi.fn(),
+  createBugViewFn: vi.fn(),
+  updateBugViewFn: vi.fn(),
+  deleteBugViewFn: vi.fn(),
+  createBugFn: vi.fn(),
+  bulkArchiveBugsFn: vi.fn(),
+  bulkDeleteBugsFn: vi.fn(),
+  bulkUpdateBugsFn: vi.fn(),
+}));
+
+vi.mock("@/server/serverFns/bug", () => h);
+// CSV 导出 serverFn（任务 45 起工具栏 import 该模块）：壳断言文件裁掉重依赖链
+vi.mock("@/server/serverFns/bug/bug-export", () => ({ exportBugsFn: vi.fn() }));
+vi.mock("@/server/serverFns/story", () => ({
+  listUsersBriefFn: vi.fn(() => Promise.resolve([])),
+}));
+vi.mock("@/server/serverFns/project", () => ({
+  listProjectsBriefFn: vi.fn(() => Promise.resolve([])),
+  ensureBuiltinProjectFn: vi.fn(() => Promise.resolve(null)),
+}));
+vi.mock("@tanstack/react-router", () => ({
+  useNavigate: () => vi.fn(),
+}));
+vi.mock("@/lib/collab/use-presence-list-refresh", () => ({
+  usePresenceListRefresh: vi.fn(),
+}));
+// 重依赖对话框/面板裁掉（TipTap 编辑器、详情协同链）：本文件只测壳与持久化链路
+vi.mock("@/components/project/create-project-dialog", () => ({
+  CreateProjectDialog: () => null,
+}));
+vi.mock("../create-bug-dialog", () => ({ CreateBugDialog: () => null }));
+vi.mock("../peek-panel", () => ({ BugPeekPanel: () => null }));
+
+import { BugToolbar } from "../bug-toolbar";
+import { BugListView } from "../bug-list-view";
+import { useToolbarCompact } from "@/components/shared-kit/list-kit/toolbar-shell";
+import { DEFAULT_BUG_DISPLAY_OPTIONS } from "../display/types";
+
+afterEach(() => {
+  cleanup();
+  vi.unstubAllGlobals();
+});
+
+const PROJECTS = [
+  { id: "proj_1", name: "项目A", displayId: "PA", icon: "folder" },
+];
+
+const TOOLBAR_PROPS = {
+  filters: { projectId: undefined, search: undefined } as { projectId?: string; search?: string },
+  filterConditions: [],
+  onFilterChange: vi.fn(),
+  onFilterConditionsChange: vi.fn(),
+  projects: PROJECTS,
+  users: [],
+  labels: [],
+  total: 42,
+  onCreateClick: vi.fn(),
+  onProjectCreated: vi.fn(),
+  view: "list" as const,
+  onViewChange: vi.fn(),
+  displayFilters: { ...DEFAULT_BUG_DISPLAY_OPTIONS },
+  onDisplayOptionsChange: vi.fn(),
+};
+
+/** 找到带三列网格类的壳行元素（toolbar-shell / testcase 19 同款定位） */
+function findRow(container: HTMLElement): HTMLElement {
+  const row = Array.from(container.querySelectorAll("div")).find((el) =>
+    el.className.includes("grid-cols-[1fr_0.5fr_1fr]"),
+  );
+  expect(row).toBeDefined();
+  return row!;
+}
+
+function renderToolbar(overrides: Partial<React.ComponentProps<typeof BugToolbar>> = {}) {
+  return render(
+    <TooltipProvider>
+      <BugToolbar {...TOOLBAR_PROPS} {...overrides} />
+    </TooltipProvider>,
+  );
+}
+
+describe("BugToolbar 换壳（任务 31）", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("外层为 ToolbarShell 三列网格行：grid-cols-[1fr_0.5fr_1fr] + @container", () => {
+    const { container } = renderToolbar();
+    const row = findRow(container);
+    expect(row.className).toContain("@container");
+    expect(row.className).toContain("items-center");
+  });
+
+  it("总数带 @max-[1100px]:hidden（断点 640→1100，story/testcase 同位）", () => {
+    const { container } = renderToolbar();
+    const total = screen.getByText(/42/);
+    expect(total.className).toContain("@max-[1100px]:hidden");
+    expect(total.className).not.toContain("@max-[640px]");
+    expect(findRow(container).contains(total)).toBe(true);
+  });
+
+  it("项目按钮 ghost+Tooltip 形态：border-0 + @max-[780px] 降级类，禁 HTML title", () => {
+    const { container } = renderToolbar();
+    const projectBtn = screen.getByText(/全部项目/).closest("button")!;
+    expect(projectBtn.className).toContain("border-0");
+    expect(projectBtn.className).toContain("@max-[780px]:border");
+    expect(projectBtn.hasAttribute("title")).toBe(false);
+    // TooltipContent 与按钮并存（壳内 Tooltip 包 Trigger）
+    expect(findRow(container).contains(projectBtn)).toBe(true);
+  });
+
+  it("搜索框在中列降级容器内：min-w-30 max-w-60 + @max-[530px]:hidden 挂容器（壳保证）", () => {
+    const { container } = renderToolbar();
+    const input = screen.getByPlaceholderText("搜索编号或标题…");
+    const wrap = input.parentElement!;
+    expect(wrap.className).toContain("relative");
+    expect(wrap.className).toContain("w-full");
+    expect(wrap.className).toContain("min-w-30");
+    expect(wrap.className).toContain("max-w-60");
+    expect(wrap.className).toContain("@max-[530px]:hidden");
+    expect(findRow(container).contains(input)).toBe(true);
+  });
+
+  it("530 搜索降级：图标按钮（aria-label 同占位文案）+ Popover 内 autoFocus 输入框", async () => {
+    const user = userEvent.setup();
+    renderToolbar();
+    const fallbackBtn = screen.getByRole("button", { name: "搜索编号或标题…" });
+    expect(fallbackBtn.className).toContain("@max-[530px]:flex");
+    expect(fallbackBtn.className).toContain("hidden");
+    await user.click(fallbackBtn);
+    const inputs = await screen.findAllByPlaceholderText("搜索编号或标题…");
+    expect(inputs.length).toBe(2);
+  });
+
+  it("视图选择器带 @max-[1000px] 降级类（story/testcase 同位断点）", () => {
+    renderToolbar({
+      views: [{ id: "v1", name: "默认视图", icon: "list", filters: [], displayOptions: { ...DEFAULT_BUG_DISPLAY_OPTIONS }, isBuiltIn: true }],
+      activeViewId: "v1",
+      onApplyView: vi.fn(),
+      onEditView: vi.fn(),
+      onDeleteView: vi.fn(),
+      onAddView: vi.fn(),
+      onSaveAsView: vi.fn(),
+    });
+    const selectorBtn = screen.getByText("默认视图").closest("button")!;
+    expect(selectorBtn.className).toContain("@max-[1000px]:border");
+  });
+
+  it("新建按钮带 @max-[920px]:hidden（紧凑档收纳进菜单）+ 更多触发器存在", () => {
+    renderToolbar();
+    const createBtn = screen.getByRole("button", { name: /新建 BUG/ });
+    expect(createBtn.className).toContain("@max-[920px]:hidden");
+    expect(screen.getByRole("button", { name: "更多" })).toBeInTheDocument();
+  });
+
+  it("右簇同位序：FilterToggle → DisplayDropdown → ViewSwitcher → 新建 → 更多", () => {
+    const { container } = renderToolbar();
+    const row = findRow(container);
+    const filterToggle = screen.getByRole("button", { name: "筛选" });
+    const displayTrigger = screen.getByTestId("bug-display-trigger");
+    const listBtn = screen.getByRole("button", { name: "列表" });
+    // 任务 34 定版 list|board：表格档移除，第二档为看板
+    const boardBtn = screen.getByRole("button", { name: "看板" });
+    const createBtn = screen.getByRole("button", { name: /新建 BUG/ });
+    const moreBtn = screen.getByRole("button", { name: "更多" });
+    for (const el of [filterToggle, displayTrigger, listBtn, boardBtn, createBtn, moreBtn]) {
+      expect(row.contains(el)).toBe(true);
+    }
+    expect(filterToggle.compareDocumentPosition(displayTrigger) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+    expect(displayTrigger.compareDocumentPosition(listBtn) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+    expect(listBtn.compareDocumentPosition(boardBtn) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+    expect(boardBtn.compareDocumentPosition(createBtn) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+    expect(createBtn.compareDocumentPosition(moreBtn) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+  });
+});
+
+describe("BugToolbar「更多」菜单（任务 31 建立）", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  /** 菜单项查询：portal 异步挂载，waitFor 内按 menuitem 过滤（testcase 19 同款） */
+  const menuItem = (label: string) =>
+    waitFor(() => {
+      const item = screen
+        .getAllByText(label)
+        .map((el) => el.closest('[role="menuitem"]'))
+        .find(Boolean);
+      if (!item) throw new Error(`菜单项「${label}」未挂载`);
+      return item;
+    });
+
+  it("菜单含导出入口（任务 45 占位启用为 CSV 导出；点击链路断言在 export-entry.test.tsx）", async () => {
+    const user = userEvent.setup();
+    renderToolbar();
+    await user.click(screen.getByRole("button", { name: "更多" }));
+    const exportItem = await menuItem("导出 CSV");
+    // Base UI Menu.Item 禁用态标 data-disabled（div 非表单元素，toBeDisabled 不适用）
+    expect(exportItem.hasAttribute("data-disabled")).toBe(false);
+    expect(exportItem.textContent).not.toContain("即将上线");
+  });
+
+  it("紧凑档（行宽 <920）新建项收纳进菜单、触发器转主色新建样式", async () => {
+    let fireResize: () => void = () => {};
+    let observed: Element | null = null;
+    class CapturableResizeObserver {
+      constructor(cb: ResizeObserverCallback) {
+        fireResize = () => cb([], this as unknown as ResizeObserver);
+      }
+      observe(el: Element) {
+        observed = el;
+      }
+      unobserve() {}
+      disconnect() {}
+    }
+    vi.stubGlobal("ResizeObserver", CapturableResizeObserver);
+
+    renderToolbar();
+    expect(observed).not.toBeNull();
+    Object.defineProperty(observed, "clientWidth", { configurable: true, value: 800 });
+    act(() => {
+      fireResize();
+    });
+
+    const trigger = screen.getByRole("button", { name: "更多" });
+    expect(trigger.className).toContain("@max-[920px]:bg-primary!");
+
+    const user = userEvent.setup();
+    await user.click(trigger);
+    // 「新建 BUG」文本同时存在于右簇隐藏按钮与菜单项：按 menuitem 过滤 + 等挂载
+    const createItem = await menuItem("新建 BUG");
+    expect(createItem).toBeDefined();
+  });
+});
+
+describe("useToolbarCompact 紧凑档抽测（testcase 19 形态）", () => {
+  /** 探针组件：hook 的 ref 必须接到真实 DOM 才触发 observe（消费方接 ToolbarShell rowRef） */
+  function HookProbe() {
+    const { ref, compact } = useToolbarCompact();
+    return <div ref={ref} data-compact={compact} />;
+  }
+
+  it("行宽 <920 → compact=true；≥920 → false", () => {
+    let fireResize: () => void = () => {};
+    let observed: Element | null = null;
+    class CapturableResizeObserver {
+      constructor(cb: ResizeObserverCallback) {
+        fireResize = () => cb([], this as unknown as ResizeObserver);
+      }
+      observe(el: Element) {
+        observed = el;
+      }
+      unobserve() {}
+      disconnect() {}
+    }
+    vi.stubGlobal("ResizeObserver", CapturableResizeObserver);
+
+    const { container } = render(<HookProbe />);
+    expect(observed).not.toBeNull();
+    Object.defineProperty(observed, "clientWidth", { configurable: true, value: 800 });
+    act(() => {
+      fireResize();
+    });
+    expect(container.firstElementChild!.getAttribute("data-compact")).toBe("true");
+
+    Object.defineProperty(observed, "clientWidth", { configurable: true, value: 960 });
+    act(() => {
+      fireResize();
+    });
+    expect(container.firstElementChild!.getAttribute("data-compact")).toBe("false");
+  });
+});
+
+describe("BugListView view 持久化（任务 31，bug.view localStorage）", () => {
+  const LIST_VIEW_PROPS = {
+    users: [],
+    projects: PROJECTS,
+    labels: [],
+  };
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    window.localStorage.clear();
+    h.listBugGroupsFn.mockResolvedValue({ groups: [{ key: "open", total: 0 }] });
+    h.listAllGroupsItemsFn.mockResolvedValue({ grouped: { open: [] } });
+    h.listBugsInGroupFn.mockResolvedValue({ items: [], total: 0, hasMore: false });
+    h.getBugDisplayOptionsFn.mockResolvedValue(null);
+    h.updateBugDisplayOptionsFn.mockResolvedValue(null);
+    h.listBugViewsFn.mockResolvedValue([]);
+  });
+
+  function renderView() {
+    return render(
+      <TooltipProvider>
+        <BugListView {...LIST_VIEW_PROPS} />
+      </TooltipProvider>,
+    );
+  }
+
+  it("默认渲染 list 视图（无 localStorage 种子：SSR 首渲染用默认值）", async () => {
+    renderView();
+    const listBtn = await screen.findByRole("button", { name: "列表" });
+    expect(listBtn.getAttribute("aria-pressed")).toBe("true");
+    expect(screen.getByRole("button", { name: "看板" }).getAttribute("aria-pressed")).toBe("false");
+  });
+
+  // 任务 34 翻转：BugView 收缩 list|board 后 "table" 为非法旧值，守卫回落 list
+  // （回退语义细断言见 view-type.test.tsx）
+  it("localStorage bug.view=table（旧值）→ 挂载后回落 list 视图", async () => {
+    window.localStorage.setItem("bug.view", "table");
+    renderView();
+    await waitFor(() => {
+      expect(screen.getByRole("button", { name: "列表" }).getAttribute("aria-pressed")).toBe("true");
+    });
+    expect(screen.queryByRole("button", { name: "表格" })).toBeNull();
+  });
+
+  it("切换视图写入 localStorage：点看板 → bug.view=board；点列表 → bug.view=list", async () => {
+    const user = userEvent.setup();
+    renderView();
+    await user.click(await screen.findByRole("button", { name: "看板" }));
+    expect(window.localStorage.getItem("bug.view")).toBe("board");
+    await user.click(screen.getByRole("button", { name: "列表" }));
+    expect(window.localStorage.getItem("bug.view")).toBe("list");
+  });
+
+  it("board 为合法值（任务 33 看板接入）：localStorage 恢复并高亮看板按钮", async () => {
+    window.localStorage.setItem("bug.view", "board");
+    renderView();
+    const boardBtn = await screen.findByRole("button", { name: "看板" });
+    expect(boardBtn.getAttribute("aria-pressed")).toBe("true");
+  });
+});