test(ui): characterise the cost-optimization notice and methodology disclosure

Cover the two antd surfaces on the Cost Optimization page that had no
assertions: the experimental-dashboard notice with its discussion link,
and the collapsed savings-methodology disclosure. Both are written
against role and text queries so they hold across a markup change.

Proven green against the current antd components.
This commit is contained in:
Yuneng Jiang 2026-07-24 22:35:04 -07:00
parent b9b27c2beb
commit 2cb1a2a0c0
No known key found for this signature in database
2 changed files with 23 additions and 0 deletions

View file

@ -20,6 +20,16 @@ describe("CostOptimizationView", () => {
expect(getByText("Prompt Caching")).toBeInTheDocument();
});
it("surfaces the experimental-dashboard notice and links to the discussion", () => {
const { getByText, getByRole } = renderView();
expect(getByText("This is an experimental dashboard")).toBeInTheDocument();
expect(getByRole("link", { name: "here" })).toHaveAttribute(
"href",
"https://github.com/BerriAI/litellm/discussions/32172",
);
});
it("defaults to the Usage tab and switches the active tab on click", () => {
const { getByRole } = renderView();

View file

@ -1,4 +1,5 @@
import { render } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { describe, expect, it, vi } from "vitest";
import type { ToolSpendResponse } from "@/components/networking";
@ -95,6 +96,18 @@ describe("UsageTab", () => {
expect(getByText("140,000 tokens compressed")).toBeInTheDocument();
});
it("keeps the savings methodology collapsed until its disclosure is opened", async () => {
const user = userEvent.setup();
const { getByText, queryByText, findByText } = renderWith([day("2026-07-12", {})]);
expect(getByText("How savings are calculated")).toBeInTheDocument();
expect(queryByText(/Savings are computed for each request when it is logged/)).not.toBeInTheDocument();
await user.click(getByText("How savings are calculated"));
expect(await findByText(/Savings are computed for each request when it is logged/)).toBeInTheDocument();
});
it("builds a per-day time series and per-driver donut from the daily rows", () => {
const { getByTestId } = renderWith([
day("2026-07-12", { compression_savings_spend: 0.04, prompt_caching_savings_spend: 0.006 }),