diff --git a/ui/litellm-dashboard/src/components/GuardrailSettingsView.test.tsx b/ui/litellm-dashboard/src/components/GuardrailSettingsView.test.tsx
new file mode 100644
index 00000000000..1c206b9c3b7
--- /dev/null
+++ b/ui/litellm-dashboard/src/components/GuardrailSettingsView.test.tsx
@@ -0,0 +1,31 @@
+import { renderWithProviders, screen } from "../../tests/test-utils";
+import { describe, expect, it } from "vitest";
+import GuardrailSettingsView from "./GuardrailSettingsView";
+
+describe("GuardrailSettingsView", () => {
+ it("should render", () => {
+ renderWithProviders();
+
+ expect(screen.getByText("Guardrails Settings")).toBeInTheDocument();
+ });
+
+ it("should separate active global and team-specific guardrails", () => {
+ renderWithProviders(
+ ,
+ );
+
+ expect(screen.getByText("global-one")).toBeInTheDocument();
+ expect(screen.getByText("team-one")).toBeInTheDocument();
+ expect(screen.queryByText("global-two")).not.toBeInTheDocument();
+ });
+
+ it("should show when global guardrails are bypassed", () => {
+ renderWithProviders();
+
+ expect(screen.getByText("Bypassed for this team")).toBeInTheDocument();
+ });
+});
diff --git a/ui/litellm-dashboard/src/components/common_components/DurationSelect.test.tsx b/ui/litellm-dashboard/src/components/common_components/DurationSelect.test.tsx
index 296ef1ae632..2e3a12d9904 100644
--- a/ui/litellm-dashboard/src/components/common_components/DurationSelect.test.tsx
+++ b/ui/litellm-dashboard/src/components/common_components/DurationSelect.test.tsx
@@ -1,5 +1,5 @@
import { render, screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
+import userEvent, { PointerEventsCheckLevel } from "@testing-library/user-event";
import { describe, it, expect, vi } from "vitest";
import DurationSelect from "./DurationSelect";
@@ -19,6 +19,9 @@ describe("DurationSelect", () => {
expect(screen.getByText("Daily")).toBeInTheDocument();
expect(screen.getByText("Weekly")).toBeInTheDocument();
expect(screen.getByText("Monthly")).toBeInTheDocument();
+ const dailyLabel = screen.getByText("Daily");
+ const dailyOption = dailyLabel.closest('[role="option"]') ?? dailyLabel;
+ await user.click(dailyOption);
});
it("should apply className prop", () => {
@@ -28,17 +31,18 @@ describe("DurationSelect", () => {
});
it("should call onChange when an option is selected", async () => {
- const user = userEvent.setup();
+ const user = userEvent.setup({ pointerEventsCheck: PointerEventsCheckLevel.Never });
const onChange = vi.fn();
render();
const select = screen.getByRole("combobox");
await user.click(select);
- const dailyOption = screen.getByText("Daily");
+ const dailyLabel = screen.getByText("Daily");
+ const dailyOption = dailyLabel.closest('[role="option"]') ?? dailyLabel;
await user.click(dailyOption);
- expect(onChange).toHaveBeenCalledWith("24h", expect.any(Object));
+ expect(onChange.mock.calls.map(([selected]) => selected)).toContain("24h");
});
it("should accept and pass value prop to Select", () => {