diff --git a/apps/web/src/components/usage/UsageLimitsPooled.browser.test.tsx b/apps/web/src/components/usage/UsageLimitsPooled.browser.test.tsx
index ab114fbbd6f21..88095f4974028 100644
--- a/apps/web/src/components/usage/UsageLimitsPooled.browser.test.tsx
+++ b/apps/web/src/components/usage/UsageLimitsPooled.browser.test.tsx
@@ -6,9 +6,11 @@ import {
} from "@t3tools/contracts";
import { CHATGPT_USAGE_URL } from "@t3tools/shared/usageLimits";
import { describe, expect, it } from "vite-plus/test";
+import { page } from "vite-plus/test/browser";
import { render } from "../../../test/render";
import { UsageLimitsPooled } from "./UsageLimitsPooled";
+import "~/index.css";
const checkedAt = "2026-10-25T16:00:00.000Z";
@@ -63,3 +65,47 @@ describe("UsageLimitsPooled ChatGPT usage card", () => {
.toBeVisible();
});
});
+
+describe("UsageLimitsPooled pool bar", () => {
+ it("labels a single account's bar in the wide layout", async () => {
+ await page.viewport(1280, 800);
+ const codex: ServerProvider = {
+ instanceId: ProviderInstanceId.make("codex"),
+ driver: ProviderDriverKind.make("codex"),
+ enabled: true,
+ installed: true,
+ version: "0.164.0",
+ status: "ready",
+ auth: { status: "authenticated", email: "kam@example.com" },
+ checkedAt,
+ models: [],
+ slashCommands: [],
+ skills: [],
+ usageLimits: {
+ checkedAt,
+ windows: [
+ {
+ id: "weekly",
+ kind: "weekly",
+ label: "Weekly",
+ usedPercent: 40,
+ resetsAt: "2026-10-28T16:00:00.000Z",
+ },
+ ],
+ },
+ };
+ const presentations = new Map([
+ [
+ EnvironmentId.make("desk"),
+ { entry: { target: { label: "Desk" } }, serverConfig: { providers: [codex] } },
+ ],
+ ]);
+ await using screen = await render(
+