人物列表还在读
: null} + // The shared waiting orbit, like 星盘 / 星历 / 报告 (2026-09-30, product: 「星盘档案这里也要加一个加载动画」). +人物列表暂时读不出来
diff --git a/frontend/src/components/personal-report/vedic-chart-svg.tsx b/frontend/src/components/personal-report/vedic-chart-svg.tsx index 78ee9d81..9505fba7 100644 --- a/frontend/src/components/personal-report/vedic-chart-svg.tsx +++ b/frontend/src/components/personal-report/vedic-chart-svg.tsx @@ -16,7 +16,7 @@ * Colour identifies a body. It is not a benefic/malefic signal. */ -import { useId } from "react"; +import { useId, type CSSProperties } from "react"; import type { ChartV1 } from "@/lib/personal-report-contract"; import { SIGN_ORDER, signZh } from "@/lib/chart-view-labels"; @@ -364,6 +364,8 @@ export function VedicChartSvgDrawing({ chart: suppliedChart, ariaLabel, highligh+ // Keyed on the text: a line that arrives or changes after the first frame + // fades in instead of snapping in (BUG-1125). +
{dailyTrend}
) : null} diff --git a/frontend/src/components/subject-switcher.tsx b/frontend/src/components/subject-switcher.tsx index c7a29099..91963041 100644 --- a/frontend/src/components/subject-switcher.tsx +++ b/frontend/src/components/subject-switcher.tsx @@ -9,6 +9,7 @@ import { type ChatProfileCatalogStatus, type ChatProfilePickerRow, } from "@/lib/chat-profile-picker-model"; +import { OrbitWaiting } from "@/components/orbit-waiting"; import type { ChartLibraryRecord } from "@/lib/home-types"; export type SubjectSwitcherProps = { @@ -88,7 +89,7 @@ export function SubjectSwitcher({ }} >人物列表还在读
: null} + {status === "loading" ?人物列表暂时读不出来
diff --git a/frontend/tests/chart-page-view.test.tsx b/frontend/tests/chart-page-view.test.tsx index 3f09cabe..d7646a9a 100644 --- a/frontend/tests/chart-page-view.test.tsx +++ b/frontend/tests/chart-page-view.test.tsx @@ -373,10 +373,18 @@ test("skeleton shares north Indian geometry without planets degrees or signs", a }); test("chart skeleton has one scoped breath rule and reduced motion is static", () => { - assert.match(cssDeclarations(".chart-page-skeleton", globalStyles), /animation: chart-skeleton-breathe 2\.4s ease-in-out infinite/); - assert.equal((globalStyles.match(/@keyframes chart-skeleton-breathe/g) ?? []).length, 1); - assert.match(globalStyles, /@keyframes chart-skeleton-breathe\s*\{\s*0%, 100% \{ opacity: 0\.35; \}\s*50% \{ opacity: 0\.6; \}/); - assert.match(globalStyles, /@media \(prefers-reduced-motion: reduce\)\s*\{\s*\.chart-page-skeleton \{ animation: none; opacity: 0\.5; \}/); + // 原值: `.chart-page-skeleton { animation: chart-skeleton-breathe 2.4s … }` (the whole empty drawing + // breathed 0.35 ↔ 0.6), one @keyframes chart-skeleton-breathe, reduced motion `animation: none; opacity: 0.5` + // 新值: the lines stay still (stroke-opacity .55); only the house fills move — one scoped + // @keyframes chart-skeleton-house, staggered by --house-index × 150ms; reduced motion switches it off + // 原因: 产品 2026-09-30「星盘的加载动画太丑了」，选「宫位依次点亮」 + assert.doesNotMatch(globalStyles, /\.chart-page-skeleton \{[^}]*animation/, "the drawing as a whole no longer breathes"); + assert.equal((globalStyles.match(/@keyframes chart-skeleton-breathe/g) ?? []).length, 0); + assert.equal((globalStyles.match(/@keyframes chart-skeleton-house/g) ?? []).length, 1); + const house = cssDeclarations(".chart-page-skeleton .personal-report-chart-cell,\n.chart-page-skeleton .chart-skeleton-sector", globalStyles); + assert.match(house, /animation: chart-skeleton-house 2\.4s ease-in-out infinite/); + assert.match(house, /animation-delay: calc\(var\(--house-index, 0\) \* 150ms\)/); + assert.match(globalStyles, /@media \(prefers-reduced-motion: reduce\)\s*\{\s*\.chart-page-skeleton \.personal-report-chart-cell,\s*\.chart-page-skeleton \.chart-skeleton-sector \{ animation: none; fill-opacity: 0; \}/); }); test("chart svgs omit the invalid height attribute and western height stays in css", () => { diff --git a/frontend/tests/daily-starlanguage.test.ts b/frontend/tests/daily-starlanguage.test.ts index 357775ed..3e643d9a 100644 --- a/frontend/tests/daily-starlanguage.test.ts +++ b/frontend/tests/daily-starlanguage.test.ts @@ -338,7 +338,13 @@ test("the home requests the card exactly when it renders one, and retries a fail // no longer shows a busy state after reveal; a pending card reads as the static copy. assert.doesNotMatch(page, /dailyStarlanguageBusy/); assert.ok(effect.length > 0); - assert.match(effect, /if \(bootstrapPhase === "account" \|\| !accountId \|\| !subjectReady \|\| !profile \|\| !profileComplete \|\| !natalMinuteAvailable\)/); + // 原值: /if \(bootstrapPhase === "account" \|\| !accountId \|\| !subjectReady \|\| !profile …\)/ — any unready + // catalog made the card "unavailable" (counted as settled) + // 新值: only another person waits for the catalog, and waiting reads as "pending" so the reveal holds for the line + // 原因: BUG-1125——首页揭幕后今日一句才出现，问候「突然跳一下」 + assert.match(effect, /const waitingForCatalog = !subjectReady && subjectId !== SELF_SUBJECT_ID;/); + assert.match(effect, /if \(bootstrapPhase !== "account" && accountId && waitingForCatalog\) \{[\s\S]*?setDailyStarlanguage\(\{ kind: "pending" \}\)/); + assert.match(effect, /if \(bootstrapPhase === "account" \|\| !accountId \|\| waitingForCatalog \|\| !profile \|\| !profileComplete \|\| !natalMinuteAvailable\)/); assert.match(binder, /const profile = useCurrentSubjectProfile\(props\.profile\)/); assert.match(binder, /const profileComplete = Boolean\(profile && missingOtherProfileStep\(profile\) === null\)/); assert.match(effect, /calendarDateInTimeZone\(new Date\(\), profile\.timezoneId\)/); diff --git a/frontend/tests/loading-motion-20260930.test.tsx b/frontend/tests/loading-motion-20260930.test.tsx new file mode 100644 index 00000000..75089dd6 --- /dev/null +++ b/frontend/tests/loading-motion-20260930.test.tsx @@ -0,0 +1,58 @@ +// 2026-09-30 loading round: the chart wait lights houses up in order, the people +// archive uses the shared orbit, and today's line enters softly (BUG-1125). +import assert from "node:assert/strict"; +import { readFileSync } from "node:fs"; +import test from "node:test"; +import React from "react"; +import { renderToStaticMarkup } from "react-dom/server"; + +import { ChartPageSkeleton } from "../src/components/chart-page/chart-page-skeleton.tsx"; +import { EMPTY_NORTH_INDIAN_CHART, VedicChartSvg } from "../src/components/personal-report/vedic-chart-svg.tsx"; +import { StarterGreeting } from "../src/components/starter-home.tsx"; +import { cssDeclarations } from "./css-contract-test-support.ts"; + +Object.assign(globalThis, { React }); +const css = readFileSync(new URL("../src/app/globals.css", import.meta.url), "utf8"); +const read = (path: string) => readFileSync(new URL(path, import.meta.url), "utf8"); + +test("the Vedic wait numbers its twelve houses in house order; the finished chart carries no index", () => { + const waiting = renderToStaticMarkup(/);
+ const picker = read("../src/components/subject-switcher.tsx");
+ assert.match(picker, /
虚构的一句。<\/p>/); + assert.match(read("../src/components/starter-home.tsx"), /
\{label\}<\/span>/);
assert.match(orbit, /app-loading-orbit/);
assert.match(read("../src/components/secondary-page-shell.tsx"), / at all
+ // 新值: exactly twelve