fix: align rust web stitch sidebar tabs

This commit is contained in:
lix-2026
2026-04-29 16:23:49 +08:00
parent 33ddda9dfd
commit 6ddc95412c
9 changed files with 874 additions and 24 deletions
@@ -55,6 +55,11 @@ async function main() {
const topbar = page.getByTestId("wolai-topbar");
const floatingAi = page.getByTestId("wolai-floating-ai");
const floatingHelp = page.getByTestId("wolai-floating-help");
const sidebarTreeTabs = page.getByTestId("wolai-sidebar-tree-tabs");
const pageTreePanel = page.locator('[data-mnote-sidebar-tree-panel="page"]').first();
const fileTreePanel = page.locator('[data-mnote-sidebar-tree-panel="filetree"]').first();
const pageTreeTab = page.locator('[data-mnote-sidebar-tree-tab="page"]').first();
const fileTreeTab = page.locator('[data-mnote-sidebar-tree-tab="filetree"]').first();
const content = page.locator(".mnote-content").first();
const staticHomeLinks = page.locator(".mnote-home-links");
const documentShell = page.locator(".document-shell").first();
@@ -67,6 +72,7 @@ async function main() {
const sidebarBox = await boundingBox(sidebar, "左侧栏");
const topbarBox = await boundingBox(topbar, "顶栏");
await boundingBox(sidebarTreeTabs, "页面树/文件树切换栏");
const contentBox = await boundingBox(content, "主内容区");
const primaryContentBox = hasDocumentShell
? await boundingBox(documentShell, "active page shell")
@@ -84,7 +90,30 @@ async function main() {
assert(floatingHelpBox.x > sidebarBox.width, "帮助浮动按钮不应落入左侧栏");
assert(!boxesIntersect(floatingAiBox, primaryContentBox), "AI 浮动按钮不应遮挡主内容");
assert(!boxesIntersect(floatingHelpBox, primaryContentBox), "帮助浮动按钮不应遮挡主内容");
assert(floatingHelpBox.y > floatingAiBox.y, "帮助按钮应位于 AI 按钮下方");
assert(floatingHelpBox.y < floatingAiBox.y, "帮助按钮应位于 AI 按钮上方,匹配 Stitch 目标");
assert.equal(await page.locator('[data-mnote-sidebar-tree-tab="filetree"]').count(), 1, "Explorer 只能作为一个切换 tab 出现");
assert.equal(await page.locator('[data-testid="wolai-sidebar-file-tree-section"]').count(), 0, "文件树不应再渲染成第二个独立 Explorer section");
assert.equal(await pageTreeTab.getAttribute("aria-selected"), "true", "默认应选中我的页面 tab");
assert.equal(await fileTreeTab.getAttribute("aria-selected"), "false", "默认不应选中 Explorer tab");
assert.equal(await pageTreePanel.evaluate((node) => node.hidden), false, "默认应显示页面树 panel");
assert.equal(await fileTreePanel.evaluate((node) => node.hidden), true, "默认应隐藏文件树 panel");
await fileTreeTab.click({ timeout: UI_TIMEOUT_MS });
await page.waitForFunction(() => {
const filePanel = document.querySelector('[data-mnote-sidebar-tree-panel="filetree"]');
const pagePanel = document.querySelector('[data-mnote-sidebar-tree-panel="page"]');
return filePanel instanceof HTMLElement && pagePanel instanceof HTMLElement && !filePanel.hidden && pagePanel.hidden;
}, null, { timeout: UI_TIMEOUT_MS });
await boundingBox(fileTreePanel, "Explorer 文件树 panel");
assert.equal(await fileTreeTab.getAttribute("aria-selected"), "true", "点击后应选中 Explorer tab");
await pageTreeTab.click({ timeout: UI_TIMEOUT_MS });
await page.waitForFunction(() => {
const filePanel = document.querySelector('[data-mnote-sidebar-tree-panel="filetree"]');
const pagePanel = document.querySelector('[data-mnote-sidebar-tree-panel="page"]');
return filePanel instanceof HTMLElement && pagePanel instanceof HTMLElement && filePanel.hidden && !pagePanel.hidden;
}, null, { timeout: UI_TIMEOUT_MS });
await page.screenshot({ path: SCREENSHOT_PATH, fullPage: true });