diff --git a/ui/litellm-dashboard/src/components/bulk_create_users_button.test.tsx b/ui/litellm-dashboard/src/components/bulk_create_users_button.test.tsx
index 7397eaa6b24..88656c6d97c 100644
--- a/ui/litellm-dashboard/src/components/bulk_create_users_button.test.tsx
+++ b/ui/litellm-dashboard/src/components/bulk_create_users_button.test.tsx
@@ -1,6 +1,7 @@
-import { render } from "@testing-library/react";
-import { describe, it, expect, vi } from "vitest";
+import { act, fireEvent, render, screen, waitFor } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
import BulkCreateUsersButton from "./bulk_create_users_button";
+import { getProxyUISettings } from "./networking";
vi.mock("./networking", () => ({
userCreateCall: vi.fn(),
@@ -21,8 +22,45 @@ vi.mock("./molecules/notifications_manager", () => ({
}));
describe("BulkCreateUsersButton", () => {
- it("should render", () => {
- const { getByText } = render();
- expect(getByText("+ Bulk Invite Users")).toBeInTheDocument();
+ afterEach(() => {
+ vi.clearAllMocks();
+ vi.restoreAllMocks();
+ });
+
+ const renderBulkCreateUsersButton = async () => {
+ render();
+ await waitFor(() => expect(getProxyUISettings).toHaveBeenCalled());
+ };
+
+ it("should render", async () => {
+ await renderBulkCreateUsersButton();
+ expect(screen.getByRole("button", { name: "+ Bulk Invite Users" })).toBeInTheDocument();
+ });
+
+ it("should download the CSV template when the template button is clicked", async () => {
+ if (!URL.createObjectURL) {
+ Object.defineProperty(URL, "createObjectURL", {
+ configurable: true,
+ value: vi.fn(),
+ });
+ }
+
+ const createObjectURLSpy = vi.spyOn(URL, "createObjectURL").mockReturnValue("blob:template");
+ const revokeObjectURLSpy = vi.spyOn(URL, "revokeObjectURL").mockImplementation(() => {});
+ const anchorClickSpy = vi.spyOn(HTMLAnchorElement.prototype, "click");
+
+ await renderBulkCreateUsersButton();
+
+ act(() => {
+ fireEvent.click(screen.getByRole("button", { name: "+ Bulk Invite Users" }));
+ });
+
+ act(() => {
+ fireEvent.click(screen.getByRole("button", { name: /Download CSV Template/ }));
+ });
+
+ expect(createObjectURLSpy).toHaveBeenCalledWith(expect.any(Blob));
+ expect(anchorClickSpy).toHaveBeenCalledOnce();
+ expect(revokeObjectURLSpy).toHaveBeenCalledWith("blob:template");
});
});
diff --git a/ui/litellm-dashboard/src/components/bulk_create_users_button.tsx b/ui/litellm-dashboard/src/components/bulk_create_users_button.tsx
index 4d0eb254d0d..28016266269 100644
--- a/ui/litellm-dashboard/src/components/bulk_create_users_button.tsx
+++ b/ui/litellm-dashboard/src/components/bulk_create_users_button.tsx
@@ -629,7 +629,13 @@ const BulkCreateUsersButton: React.FC = ({
- }>
+ }
+ onClick={downloadTemplate}
+ >
Download CSV Template