fix(ui): keep create guardrail modal open on outside click (#29871)
The create guardrail modal used antd's default maskClosable, so clicking
outside it dismissed the modal and reset every field the user had entered.
Setting maskClosable={false} keeps the modal open; it now closes only via
the explicit close button or Cancel, matching the other form modals in the
dashboard
This commit is contained in:
parent
26fe26a5c0
commit
47b383dbbf
@ -0,0 +1,43 @@
|
||||
import React from "react";
|
||||
import { fireEvent, screen } from "@testing-library/react";
|
||||
import { renderWithProviders } from "../../../tests/test-utils";
|
||||
import { beforeEach, describe, expect, it, vi } from "vitest";
|
||||
import AddGuardrailForm from "./add_guardrail_form";
|
||||
|
||||
vi.mock("@/components/networking", () => ({
|
||||
createGuardrailCall: vi.fn(),
|
||||
getGuardrailProviderSpecificParams: vi.fn().mockResolvedValue({}),
|
||||
getGuardrailUISettings: vi.fn().mockResolvedValue({}),
|
||||
modelAvailableCall: vi.fn().mockResolvedValue({ data: [] }),
|
||||
}));
|
||||
|
||||
const renderForm = () => {
|
||||
const onClose = vi.fn();
|
||||
renderWithProviders(<AddGuardrailForm visible={true} onClose={onClose} accessToken={null} onSuccess={vi.fn()} />);
|
||||
return { onClose };
|
||||
};
|
||||
|
||||
describe("AddGuardrailForm close behavior", () => {
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks();
|
||||
});
|
||||
|
||||
it("does not close when the user clicks outside the modal on the mask", () => {
|
||||
const { onClose } = renderForm();
|
||||
expect(screen.getByText("Create guardrail")).toBeInTheDocument();
|
||||
|
||||
const wrap = document.querySelector(".ant-modal-wrap") as HTMLElement;
|
||||
expect(wrap).toBeTruthy();
|
||||
fireEvent.mouseDown(wrap);
|
||||
fireEvent.mouseUp(wrap);
|
||||
fireEvent.click(wrap);
|
||||
|
||||
expect(onClose).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("closes when the user clicks the explicit close button", () => {
|
||||
const { onClose } = renderForm();
|
||||
fireEvent.click(screen.getByRole("button", { name: "✕" }));
|
||||
expect(onClose).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
});
|
||||
@ -1144,6 +1144,7 @@ const AddGuardrailForm: React.FC<AddGuardrailFormProps> = ({ visible, onClose, a
|
||||
title={null}
|
||||
open={visible}
|
||||
onCancel={handleClose}
|
||||
maskClosable={false}
|
||||
footer={null}
|
||||
width={1000}
|
||||
closable={false}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user