diff --git a/tests/Link.test.svelte b/tests/Link.test.svelte
deleted file mode 100644
index 1a309c88..00000000
--- a/tests/Link.test.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-
-
-
- Carbon Design System
-
-
-
diff --git a/tests/Link/Link.test.svelte b/tests/Link/Link.test.svelte
new file mode 100644
index 00000000..61f98609
--- /dev/null
+++ b/tests/Link/Link.test.svelte
@@ -0,0 +1,87 @@
+
+
+
+
+
+
+ {
+ e.preventDefault();
+ console.log("click");
+ }}
+ on:mouseover={() => {
+ console.log("mouseover");
+ }}
+ on:mouseenter={() => {
+ console.log("mouseenter");
+ }}
+ on:mouseleave={() => {
+ console.log("mouseleave");
+ }}
+ >
+ Carbon Design System
+
+
+
+
+
+
+ Carbon Design System
+
+
+
+
+
+
+ Carbon Design System
+
+
+
+
+
+
+ Carbon Design System
+
+
+
+
+
+
+ Carbon Design System
+
+
+
+
+
+
+
+
+
+ Carbon Design System
+
+
+
+
+
+
+ Carbon Design System
+
+
+
+
+
+
+ Carbon Design System
+
+
+
+
+
+
+ Carbon Design System
+
+
diff --git a/tests/Link/Link.test.ts b/tests/Link/Link.test.ts
new file mode 100644
index 00000000..014b1383
--- /dev/null
+++ b/tests/Link/Link.test.ts
@@ -0,0 +1,121 @@
+import { render, screen } from "@testing-library/svelte";
+import { user } from "../setup-tests";
+import Link from "./Link.test.svelte";
+
+describe("Link", () => {
+ afterEach(() => {
+ vi.restoreAllMocks();
+ });
+
+ it("renders with default props", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("default-link");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveClass("bx--link");
+ expect(link).toHaveAttribute("href", "https://www.carbondesignsystem.com/");
+ expect(link).toHaveTextContent("Carbon Design System");
+ });
+
+ it("adds noopener noreferrer when target is _blank", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-blank");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveAttribute("target", "_blank");
+ expect(link).toHaveAttribute("rel", "noopener noreferrer");
+ });
+
+ it("supports inline variant", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-inline");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveClass("bx--link--inline");
+ });
+
+ it("supports icon prop", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-with-icon");
+ const link = wrapper.querySelector("a");
+ const iconWrapper = link?.querySelector(".bx--link__icon");
+
+ expect(iconWrapper).toBeInTheDocument();
+ expect(iconWrapper?.querySelector("svg")).toBeInTheDocument();
+ });
+
+ it("supports icon slot", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-with-icon-slot");
+ const link = wrapper.querySelector("a");
+ const iconWrapper = link?.querySelector(".bx--link__icon");
+
+ expect(iconWrapper).toBeInTheDocument();
+ expect(iconWrapper?.querySelector("svg")).toBeInTheDocument();
+ });
+
+ it("supports large size variant", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-large");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveClass("bx--link--lg");
+ });
+
+ it("supports small size variant", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-small");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveClass("bx--link--sm");
+ });
+
+ it("supports disabled state", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-disabled");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveClass("bx--link--disabled");
+ expect(link).toHaveAttribute("aria-disabled", "true");
+ expect(link).toHaveAttribute("role", "link");
+ });
+
+ it("supports visited state", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-visited");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveClass("bx--link--visited");
+ });
+
+ it("supports click and mouse events", async () => {
+ const consoleLog = vi.spyOn(console, "log");
+ render(Link);
+
+ const wrapper = screen.getByTestId("default-link");
+ const link = wrapper.querySelector("a");
+ assert(link);
+
+ await user.click(link);
+ expect(consoleLog).toHaveBeenCalledWith("click");
+
+ await user.hover(link);
+ expect(consoleLog).toHaveBeenCalledWith("mouseover");
+
+ await user.hover(link);
+ expect(consoleLog).toHaveBeenCalledWith("mouseenter");
+
+ await user.unhover(link);
+ expect(consoleLog).toHaveBeenCalledWith("mouseleave");
+ expect(consoleLog).toHaveBeenCalledTimes(4);
+ });
+
+ it("prevents icon rendering when inline is true", () => {
+ render(Link);
+ const wrapper = screen.getByTestId("link-inline");
+ const link = wrapper.querySelector("a");
+
+ expect(link).toHaveClass("bx--link--inline");
+ expect(link?.querySelector(".bx--link__icon")).not.toBeInTheDocument();
+ });
+});