diff --git a/ui/litellm-dashboard/src/app/(dashboard)/usage/_components/components/UsagePageView.test.tsx b/ui/litellm-dashboard/src/app/(dashboard)/usage/_components/components/UsagePageView.test.tsx
index 888717bb847..50bfd53a27b 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/usage/_components/components/UsagePageView.test.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/usage/_components/components/UsagePageView.test.tsx
@@ -1371,12 +1371,10 @@ describe("UsagePage", () => {
});
describe("selected-user budget wiring", () => {
- const userSelectCombobox = (): HTMLElement => {
- let node: HTMLElement | null = screen.getByText("Filter by user");
- while (node && !node.querySelector('[role="combobox"]')) {
- node = node.parentElement;
- }
- return node!.querySelector('[role="combobox"]') as HTMLElement;
+ const selectAlice = async () => {
+ const user = userEvent.setup();
+ await user.click(screen.getByPlaceholderText("Search users by email…"));
+ await user.click(await screen.findByText("Alice (user-001)"));
};
it("feeds the tile the selected user's budget and duration, not the admin's", async () => {
@@ -1394,8 +1392,7 @@ describe("UsagePage", () => {
renderWithProviders();
await waitFor(() => expect(mockUserDailyActivityAggregatedCall).toHaveBeenCalled());
- await userEvent.setup().click(userSelectCombobox());
- await userEvent.setup().click(screen.getByText("Alice (user-001)"));
+ await selectAlice();
await waitFor(() => {
expect(screen.getByTestId("view-user-spend")).toHaveAttribute("data-max-budget", "600");
@@ -1415,8 +1412,7 @@ describe("UsagePage", () => {
renderWithProviders();
await waitFor(() => expect(mockUserDailyActivityAggregatedCall).toHaveBeenCalled());
- await userEvent.setup().click(userSelectCombobox());
- await userEvent.setup().click(screen.getByText("Alice (user-001)"));
+ await selectAlice();
await waitFor(() => {
expect(screen.getByTestId("view-user-spend")).toHaveAttribute("data-budget-loading", "true");