lee/pentagi
1
0
Fork 0
mirror of https://github.com/vxcontrol/pentagi.git synced 2026-08-26 13:06:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

test(e2e): assert the dashboard period switch renders a distinct range

Browse Source 
The period-switch test only proved the usageStatsByPeriod refetch fired; it would
still pass if the UI rendered stale data. Key the cassette's usageStatsByPeriod by
period (week vs month) with distinct date ranges, and assert the Token Usage chart
x-axis shows the month range after the switch and drops the week range.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Sergey Kozyrenko
2026-07-21 04:33:57 +07:00
co-authored by Claude Fable 5
parent f5070667de
commit 16e926614c
2 changed files with 18 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/e2e/mocks/cassettes/dashboard.ts
+11 -5
View File
@@ -15,7 +15,7 @@ import type {
UsageStatsTotalDocument,
} from '@/graphql/types';
import { AgentType } from '@/graphql/types';
import { AgentType, UsageStatsPeriod } from '@/graphql/types';
import type { Cassette } from '../cassette.ts';
@@ -23,6 +23,9 @@ import { entity, mergeCassettes } from '../cassette.ts';
import { baseQueries, baseRest } from './base.ts';
const DATES = ['2026-01-15', '2026-01-14', '2026-01-13'];
// The month period returns a distinct date range so the period switch is
// asserted on rendered data (the x-axis labels), not just the refetch firing.
const MONTH_DATES = ['2026-08-15', '2026-08-10', '2026-08-05'];
const usageStats = (seed: number): UsageStatsFragmentFragment =>
entity('UsageStats', {
@@ -34,9 +37,9 @@ const usageStats = (seed: number): UsageStatsFragmentFragment =>
totalUsageOut: seed * 40,
});
const usageStatsByPeriod: ResultOf<typeof UsageStatsByPeriodDocument> = {
usageStatsByPeriod: DATES.map((date, index) => entity('DailyUsageStats', { date, stats: usageStats(index + 1) })),
};
const usageStatsByPeriodFor = (dates: string[]): ResultOf<typeof UsageStatsByPeriodDocument> => ({
usageStatsByPeriod: dates.map((date, index) => entity('DailyUsageStats', { date, stats: usageStats(index + 1) })),
});
const toolcallsStatsByPeriod: ResultOf<typeof ToolcallsStatsByPeriodDocument> = {
toolcallsStatsByPeriod: DATES.map((date, index) =>
@@ -143,7 +146,10 @@ export const dashboardCassette = (override: Cassette = {}): Cassette =>
toolcallsStatsTotal: [{ data: toolcallsStatsTotal }],
usageStatsByAgentType: [{ data: usageStatsByAgentType }],
usageStatsByModel: [{ data: usageStatsByModel }],
usageStatsByPeriod: [{ data: usageStatsByPeriod }],
usageStatsByPeriod: [
{ data: usageStatsByPeriodFor(DATES), variables: { period: UsageStatsPeriod.Week } },
{ data: usageStatsByPeriodFor(MONTH_DATES), variables: { period: UsageStatsPeriod.Month } },
],
usageStatsByProvider: [{ data: usageStatsByProvider }],
usageStatsTotal: [{ data: usageStatsTotal }],
},
frontend/e2e/specs/dashboard/dashboard.spec.ts
+7 -1
View File
@@ -39,11 +39,14 @@ test.describe('dashboard', { tag: '@coverage' }, () => {
expectCleanPage(pageErrorLog);
});
test('period switch refetches the charts for the month', async ({ page, pageErrorLog }) => {
test('period switch refetches and renders the month range', async ({ page, pageErrorLog }) => {
await page.goto('/dashboard');
await expect(page.getByRole('heading', { exact: true, name: 'Flows Activity Over Time' })).toBeVisible();
const tokenCard = cardWith(page, 'Token Usage Over Time');
await expect(tokenCard.getByText('Jan 15', { exact: true })).toBeVisible();
const monthRequest = page.waitForRequest((request) => {
if (request.method() !== 'POST' || !request.url().includes('/api/v1/graphql')) {
return false;
@@ -62,6 +65,9 @@ test.describe('dashboard', { tag: '@coverage' }, () => {
await expect(page.getByRole('tab', { name: 'Month' })).toHaveAttribute('aria-selected', 'true');
await expect(tokenCard.getByText('Aug 15', { exact: true })).toBeVisible();
await expect(tokenCard.getByText('Jan 15', { exact: true })).toBeHidden();
for (const title of CHART_TITLES) {
await expect(page.getByRole('heading', { exact: true, name: title })).toBeVisible();
}