fix: refine heaven workspace controls

2026-07-23 10:16:56 +08:00
parent c62670d46b
commit d85529dce5
3 changed files with 140 additions and 23 deletions
@@ -354,3 +354,79 @@ test("reduced-motion preference suppresses continuous animation", async ({ page
  expect(Number.parseFloat(motion.duration)).toBeLessThanOrEqual(0.00001);
  expect(motion.iterations).toBe("1");
 });
+
+test("heaven workspace actions remain compact and do not overlap", async ({ page }) => {
+  await page.setViewportSize({ width: 1440, height: 900 });
+  await mockApplication(page, session("user", true));
+  await page.goto("/index.html");
+  await page.locator('[data-view="heavenView"]').first().click();
+
+  const titleSize = Number.parseFloat(await page.locator("#heavenView .heaven-toolbar h2").evaluate((element) => getComputedStyle(element).fontSize));
+  expect(titleSize).toBeLessThanOrEqual(22);
+
+  const trendButtons = page.locator(".heaven-trend-actions .button");
+  await expect(trendButtons).toHaveCount(3);
+  for (let index = 0; index < await trendButtons.count(); index += 1) {
+    const box = await trendButtons.nth(index).boundingBox();
+    expect(box.width).toBeLessThanOrEqual(130);
+    expect(box.height).toBeLessThanOrEqual(44);
+  }
+  await page.locator('[data-heaven-panel="fortune"]').click();
+  const fortuneActions = await page.locator("#heavenFortunePanel .fortune-heading-actions").boundingBox();
+  const fortunePanel = await page.locator("#heavenFortunePanel").boundingBox();
+  expect(fortuneActions.x + fortuneActions.width).toBeLessThanOrEqual(fortunePanel.x + fortunePanel.width + 1);
+  await page.evaluate(() => {
+    state.heavenInterpretations.fortune = {
+      id: 31,
+      mode: "fortune",
+      context_date: "20260723",
+      subject: "2026-07-23 观气",
+      subject_detail: "丙午年 · 乙未月 · 己丑日",
+      answer: "三层气机已经合参，今日宜先定节奏，再看行动。",
+      created_at: "2026-07-23T09:12:00+08:00",
+    };
+    openHeavenReading("fortune", { loading: false });
+  });
+  const readingDialog = await page.locator("#heavenReadingDialog").boundingBox();
+  expect(readingDialog.width).toBeLessThanOrEqual(920);
+  expect(readingDialog.height).toBeLessThanOrEqual(820);
+  const readingHeader = await page.locator("#heavenReadingDialog .dialog-header").boundingBox();
+  const readingTabs = await page.locator("#heavenReadingDialog .heaven-reading-tabs").boundingBox();
+  expect(readingHeader.y + readingHeader.height).toBeLessThanOrEqual(readingTabs.y + 1);
+  await page.locator("#closeHeavenReadingDialog").click();
+
+  await page.locator('[data-heaven-panel="heart"]').click();
+  const heartControls = await page.locator(".heart-toolbar-controls").boundingBox();
+  const heartPanel = await page.locator("#heavenHeartPanel").boundingBox();
+  expect(heartControls.width).toBeLessThanOrEqual(190);
+  expect(heartControls.x + heartControls.width).toBeLessThanOrEqual(heartPanel.x + heartPanel.width + 1);
+  const historyBox = await page.locator("#historyHeartButton").boundingBox();
+  const soundBox = await page.locator("#heartSoundToggle").boundingBox();
+  expect(historyBox.width).toBeLessThanOrEqual(100);
+  expect(historyBox.x + historyBox.width).toBeLessThanOrEqual(soundBox.x);
+
+});
+
+test("heaven workspace controls fit a narrow viewport", async ({ page }) => {
+  await page.setViewportSize({ width: 375, height: 812 });
+  await mockApplication(page, session("user", true));
+  await page.goto("/index.html");
+  await page.locator('[data-view="heavenView"]').first().click();
+  expect(await page.evaluate(() => window.scrollY)).toBe(0);
+
+  const trendActions = await page.locator(".heaven-trend-actions").boundingBox();
+  expect(trendActions.width).toBeLessThanOrEqual(347);
+  expect(await page.evaluate(() => document.documentElement.scrollWidth - window.innerWidth)).toBeLessThanOrEqual(1);
+  await page.locator('[data-heaven-panel="fortune"]').click();
+  expect(await page.evaluate(() => document.documentElement.scrollWidth - window.innerWidth)).toBeLessThanOrEqual(1);
+  const fortuneButtons = page.locator("#heavenFortunePanel .fortune-heading-actions .button");
+  const firstFortuneButton = await fortuneButtons.first().boundingBox();
+  const secondFortuneButton = await fortuneButtons.last().boundingBox();
+  expect(Math.abs(firstFortuneButton.width - secondFortuneButton.width)).toBeLessThanOrEqual(1);
+  expect(Math.abs(firstFortuneButton.y - secondFortuneButton.y)).toBeLessThanOrEqual(1);
+  await page.locator('[data-heaven-panel="heart"]').click();
+  const heartControls = await page.locator(".heart-toolbar-controls").boundingBox();
+  expect(heartControls.width).toBeLessThanOrEqual(80);
+  expect(heartControls.x + heartControls.width).toBeLessThanOrEqual(375);
+  expect(await page.evaluate(() => document.documentElement.scrollWidth - window.innerWidth)).toBeLessThanOrEqual(1);
+});