test(analytics) : align dashboard tests with visible rankings
This commit is contained in:
@@ -10,7 +10,7 @@ import { getCachedPublicAnalytics } from "@/lib/cache/analytics";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "วิเคราะห์ข้อมูล",
|
||||
description: "อันดับตัวละคร อาวุธ และอาร์ติแฟกต์ที่ใช้และแนะนำบ่อยที่สุดในไกด์สาธารณะ พร้อมเลือกข้อมูล Stygian",
|
||||
description: "อันดับตัวละคร อาวุธ และอาร์ติแฟกต์ที่ใช้ในไกด์สาธารณะ พร้อมเลือกข้อมูล Stygian",
|
||||
};
|
||||
|
||||
async function AnalyticsContent() {
|
||||
@@ -36,7 +36,7 @@ export default function AnalyticsPage() {
|
||||
<main className="mx-auto flex w-full max-w-7xl flex-1 flex-col gap-8 px-4 py-10 sm:px-6 sm:py-14">
|
||||
<header className="flex flex-col gap-3">
|
||||
<h1 className="font-heading text-4xl font-semibold">วิเคราะห์ข้อมูล</h1>
|
||||
<p className="text-lg text-muted-foreground">ส่องภาพรวมตัวละคร อาวุธ และอาร์ติแฟกต์ที่ใช้และแนะนำบ่อยที่สุดในไกด์ทั้งหมด</p>
|
||||
<p className="text-lg text-muted-foreground">ส่องภาพรวมตัวละคร อาวุธ และอาร์ติแฟกต์ที่ใช้ในทีมจากไกด์ทั้งหมด</p>
|
||||
</header>
|
||||
<Suspense fallback={<AnalyticsSkeleton />}><AnalyticsContent /></Suspense>
|
||||
</main>
|
||||
|
||||
@@ -43,38 +43,38 @@ afterEach(async () => {
|
||||
});
|
||||
|
||||
describe("public analytics dashboard", () => {
|
||||
it("starts with Stygian enabled and updates all five rankings and totals on toggle", async () => {
|
||||
it("starts with Stygian enabled and updates all three team rankings and totals on toggle", async () => {
|
||||
await act(async () => root.render(<AnalyticsDashboard data={data} />));
|
||||
const toggle = container.querySelector<HTMLElement>('[role="switch"][aria-labelledby="include-stygian-label"]')!;
|
||||
expect(toggle.getAttribute("aria-checked")).toBe("true");
|
||||
expect(container.querySelector(`#${toggle.getAttribute("aria-labelledby")}`)?.textContent).toBe("รวมข้อมูล Stygian");
|
||||
expect(container.querySelectorAll("details[data-ranking]")).toHaveLength(5);
|
||||
expect(container.querySelectorAll("tbody tr")).toHaveLength(10);
|
||||
expect(container.querySelectorAll("details[data-ranking]")).toHaveLength(3);
|
||||
expect(container.querySelectorAll("tbody tr")).toHaveLength(6);
|
||||
expect(container.querySelector('[aria-label="ภาพรวมข้อมูล"]')?.textContent).toContain("ทีมทั้งหมด2");
|
||||
expect(Array.from(container.querySelectorAll("tbody tr:first-child td:last-child"), (cell) => cell.textContent)).toEqual(Array(5).fill("7"));
|
||||
expect(Array.from(container.querySelectorAll("tbody tr:first-child td:last-child"), (cell) => cell.textContent)).toEqual(Array(3).fill("7"));
|
||||
|
||||
const details = container.querySelector<HTMLDetailsElement>("details[data-ranking]")!;
|
||||
details.open = true;
|
||||
await act(async () => toggle.click());
|
||||
expect(toggle.getAttribute("aria-checked")).toBe("false");
|
||||
expect(details.open).toBe(true);
|
||||
expect(container.querySelectorAll("tbody tr")).toHaveLength(5);
|
||||
expect(container.querySelectorAll("tbody tr")).toHaveLength(3);
|
||||
expect(container.textContent).not.toContain("Stygian only");
|
||||
expect(container.querySelector('[aria-label="ภาพรวมข้อมูล"]')?.textContent).toContain("ทีมทั้งหมด1");
|
||||
expect(container.querySelector('[aria-label="ภาพรวมข้อมูล"]')?.textContent).toContain("เวอร์ชัน Stygian0");
|
||||
expect(Array.from(container.querySelectorAll("tbody tr:first-child td:last-child"), (cell) => cell.textContent)).toEqual(Array(5).fill("2"));
|
||||
expect(Array.from(container.querySelectorAll("tbody tr:first-child td:last-child"), (cell) => cell.textContent)).toEqual(Array(3).fill("2"));
|
||||
|
||||
await act(async () => root.render(<AnalyticsDashboard data={{ ...data, teamGroups: [...data.teamGroups, { guideId: "g1", signature: "new-team", count: 1 }] }} />));
|
||||
expect(toggle.getAttribute("aria-checked")).toBe("false");
|
||||
expect(container.querySelector('[aria-label="ภาพรวมข้อมูล"]')?.textContent).toContain("ทีมทั้งหมด2");
|
||||
});
|
||||
|
||||
it("shows empty states for sources without entries", async () => {
|
||||
it("shows empty states for team rankings without entries", async () => {
|
||||
await act(async () => root.render(<AnalyticsDashboard data={{
|
||||
...data, team: { character: [], weapon: [], artifact: [] }, recommendation: { weapon: [], artifact: [] },
|
||||
...data, team: { character: [], weapon: [], artifact: [] },
|
||||
}} />));
|
||||
expect(container.querySelectorAll("details[data-ranking]")).toHaveLength(0);
|
||||
expect(container.querySelectorAll('[data-slot="empty-title"]')).toHaveLength(5);
|
||||
expect(container.querySelectorAll('[data-slot="empty-title"]')).toHaveLength(3);
|
||||
});
|
||||
|
||||
it("lets each guide be excluded and restored and supports repeated-team filtering", async () => {
|
||||
|
||||
Reference in New Issue
Block a user