diff --git a/tests/InlineNotification.test.svelte b/tests/InlineNotification.test.svelte
deleted file mode 100644
index 856bc2b8..00000000
--- a/tests/InlineNotification.test.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-
-
-
-
- {
- console.log(e.detail.timeout);
- }}
-/>
-
-
-
- Learn more
-
-
-
-Learn more
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/tests/InlineNotification/InlineNotification.close.test.svelte b/tests/InlineNotification/InlineNotification.close.test.svelte
new file mode 100644
index 00000000..6f66810c
--- /dev/null
+++ b/tests/InlineNotification/InlineNotification.close.test.svelte
@@ -0,0 +1,12 @@
+
+
+ {
+ e.preventDefault();
+ console.log("close", e.detail);
+ }}
+/>
diff --git a/tests/InlineNotification/InlineNotification.test.svelte b/tests/InlineNotification/InlineNotification.test.svelte
new file mode 100644
index 00000000..320683d2
--- /dev/null
+++ b/tests/InlineNotification/InlineNotification.test.svelte
@@ -0,0 +1,29 @@
+
+
+ {
+ console.log("close", e.detail);
+ }}
+/>
diff --git a/tests/InlineNotification/InlineNotification.test.ts b/tests/InlineNotification/InlineNotification.test.ts
new file mode 100644
index 00000000..d7d3b6de
--- /dev/null
+++ b/tests/InlineNotification/InlineNotification.test.ts
@@ -0,0 +1,156 @@
+import { render, screen } from "@testing-library/svelte";
+import { user } from "../setup-tests";
+import InlineNotification from "./InlineNotification.test.svelte";
+import InlineNotificationCustom from "./InlineNotificationCustom.test.svelte";
+import InlineNotificationClose from "./InlineNotification.close.test.svelte";
+
+describe("InlineNotification", () => {
+ beforeEach(() => {
+ vi.restoreAllMocks();
+ });
+
+ it("should render with default props", () => {
+ render(InlineNotification);
+
+ expect(screen.getByRole("alert")).toHaveClass(
+ "bx--inline-notification--error",
+ );
+ expect(screen.getByText("Error:")).toBeInTheDocument();
+ expect(
+ screen.getByText("An internal server error occurred."),
+ ).toBeInTheDocument();
+ });
+
+ it("should handle different kinds", () => {
+ (
+ [
+ "error",
+ "info",
+ "info-square",
+ "success",
+ "warning",
+ "warning-alt",
+ ] as const
+ ).forEach((kind) => {
+ const { container } = render(InlineNotification, {
+ props: { kind },
+ });
+
+ expect(
+ container.querySelector(`.bx--inline-notification--${kind}`),
+ ).toBeInTheDocument();
+ container.remove();
+ });
+ });
+
+ it("should handle low contrast variant", () => {
+ render(InlineNotification, {
+ props: { lowContrast: true },
+ });
+
+ expect(screen.getByRole("alert")).toHaveClass(
+ "bx--inline-notification--low-contrast",
+ );
+ });
+
+ it("should handle close button click", async () => {
+ const consoleLog = vi.spyOn(console, "log");
+ render(InlineNotification);
+
+ await user.click(screen.getByRole("button"));
+
+ expect(consoleLog).toHaveBeenCalledWith("close", { timeout: false });
+ expect(screen.queryByRole("alert")).not.toBeInTheDocument();
+ });
+
+ it("should hide close button", () => {
+ render(InlineNotification, {
+ props: { hideCloseButton: true },
+ });
+
+ expect(
+ screen.queryByLabelText("Close notification"),
+ ).not.toBeInTheDocument();
+ expect(screen.getByRole("alert")).toHaveClass(
+ "bx--inline-notification--hide-close-button",
+ );
+ });
+
+ it("should handle custom icon descriptions", () => {
+ render(InlineNotification, {
+ props: {
+ statusIconDescription: "Custom status",
+ closeButtonDescription: "Custom close",
+ },
+ });
+
+ expect(screen.getByText("Custom status")).toBeInTheDocument();
+ expect(screen.getByRole("button")).toHaveAttribute(
+ "aria-label",
+ "Custom close",
+ );
+ });
+
+ it("should handle custom role", () => {
+ render(InlineNotification, {
+ props: { role: "status" },
+ });
+
+ expect(screen.getByRole("status")).toBeInTheDocument();
+ });
+
+ it("should handle timeout", async () => {
+ vi.useFakeTimers();
+ const consoleLog = vi.spyOn(console, "log");
+ render(InlineNotification, { props: { timeout: 1000 } });
+
+ expect(screen.getByRole("alert")).toBeInTheDocument();
+ await vi.advanceTimersByTimeAsync(1000);
+
+ expect(consoleLog).toHaveBeenCalledWith("close", { timeout: true });
+ expect(screen.queryByRole("alert")).not.toBeInTheDocument();
+ vi.useRealTimers();
+ });
+
+ it("should handle custom slots", () => {
+ render(InlineNotificationCustom);
+
+ const title = screen.getByText("Custom Title:");
+ expect(title).not.toHaveClass("bx--inline-notification__title");
+ expect(title.tagName).toBe("STRONG");
+
+ const subtitle = screen.getByText("Custom subtitle content.");
+ expect(subtitle).not.toHaveClass("bx--inline-notification__subtitle");
+ expect(subtitle.tagName).toBe("STRONG");
+ });
+
+ it("should render action button", () => {
+ render(InlineNotificationCustom);
+
+ expect(
+ screen.getByRole("button", { name: "Learn more" }),
+ ).toBeInTheDocument();
+ });
+
+ it("should cleanup timeout on unmount", () => {
+ vi.useFakeTimers();
+ const clearTimeoutSpy = vi.spyOn(window, "clearTimeout");
+
+ const { unmount } = render(InlineNotification, {
+ props: { timeout: 1_000 },
+ });
+
+ unmount();
+ expect(clearTimeoutSpy).toHaveBeenCalled();
+ vi.useRealTimers();
+ });
+
+ it("should prevent default close behavior", async () => {
+ const consoleLog = vi.spyOn(console, "log");
+ render(InlineNotificationClose);
+
+ await user.click(screen.getByRole("button"));
+ expect(consoleLog).toHaveBeenCalledWith("close", { timeout: false });
+ expect(screen.getByRole("alert")).toBeInTheDocument();
+ });
+});
diff --git a/tests/InlineNotification/InlineNotificationCustom.test.svelte b/tests/InlineNotification/InlineNotificationCustom.test.svelte
new file mode 100644
index 00000000..4186595f
--- /dev/null
+++ b/tests/InlineNotification/InlineNotificationCustom.test.svelte
@@ -0,0 +1,14 @@
+
+
+
+ Custom Title:
+ Custom subtitle content.
+
+ Learn more
+
+