diff --git a/tests/FluidForm.test.svelte b/tests/FluidForm.test.svelte
deleted file mode 100644
index 46f93e00..00000000
--- a/tests/FluidForm.test.svelte
+++ /dev/null
@@ -1,17 +0,0 @@
-
-
-
-
-
-
diff --git a/tests/FluidForm/FluidForm.test.svelte b/tests/FluidForm/FluidForm.test.svelte
new file mode 100644
index 00000000..fd0eef80
--- /dev/null
+++ b/tests/FluidForm/FluidForm.test.svelte
@@ -0,0 +1,27 @@
+
+
+ {
+ if (preventDefault) {
+ e.preventDefault();
+ }
+ console.log("submit", e);
+ }}
+>
+
+
+
+
+
+
+
diff --git a/tests/FluidForm/FluidForm.test.ts b/tests/FluidForm/FluidForm.test.ts
new file mode 100644
index 00000000..7b0cd640
--- /dev/null
+++ b/tests/FluidForm/FluidForm.test.ts
@@ -0,0 +1,58 @@
+import { render, screen } from "@testing-library/svelte";
+import { user } from "../setup-tests";
+import FluidFormTest from "./FluidForm.test.svelte";
+
+describe("FluidForm", () => {
+ it("renders with default props", () => {
+ render(FluidFormTest);
+ const form = screen.getByTestId("fluid-form");
+ expect(form).toBeInTheDocument();
+ expect(form).toHaveClass("bx--form--fluid");
+ });
+
+ it("renders form elements correctly", () => {
+ render(FluidFormTest);
+
+ // Check form group
+ const formGroup = screen.getByRole("group");
+ expect(formGroup).toBeInTheDocument();
+ expect(formGroup).toHaveTextContent("Checkboxes");
+
+ // Check checkboxes
+ const checkboxes = screen.getAllByRole("checkbox");
+ expect(checkboxes).toHaveLength(3);
+ expect(checkboxes[0]).toBeChecked();
+ expect(checkboxes[1]).not.toBeChecked();
+ expect(checkboxes[2]).toBeDisabled();
+
+ // Check submit button
+ const submitButton = screen.getByRole("button", { name: "Submit" });
+ expect(submitButton).toBeInTheDocument();
+ expect(submitButton).toHaveAttribute("type", "submit");
+ });
+
+ describe("form submission", () => {
+ it("handles form submission", async () => {
+ const consoleLog = vi.spyOn(console, "log");
+ render(FluidFormTest);
+
+ const submitButton = screen.getByRole("button", { name: "Submit" });
+ await user.click(submitButton);
+
+ expect(consoleLog).toHaveBeenCalledWith("submit", expect.any(Event));
+ });
+
+ it("prevents default submission when preventDefault is true", async () => {
+ const consoleLog = vi.spyOn(console, "log");
+ const preventDefaultSpy = vi.fn();
+
+ render(FluidFormTest, { preventDefault: true });
+
+ const submitButton = screen.getByRole("button", { name: "Submit" });
+ await user.click(submitButton);
+
+ expect(preventDefaultSpy).not.toHaveBeenCalled();
+ expect(consoleLog).toHaveBeenCalled();
+ });
+ });
+});