diff --git a/src/lib/components/label/Label.svelte b/src/lib/components/label/Label.svelte
index 2723869..09d700a 100644
--- a/src/lib/components/label/Label.svelte
+++ b/src/lib/components/label/Label.svelte
@@ -1,7 +1,16 @@
-
+
diff --git a/src/lib/components/label/label.test.ts b/src/lib/components/label/label.test.ts
index dbfb1c8..1229ca5 100644
--- a/src/lib/components/label/label.test.ts
+++ b/src/lib/components/label/label.test.ts
@@ -2,6 +2,9 @@ import { render } from "@testing-library/svelte";
import Label from "./Label.svelte";
import LabelProvider from "./LabelProvider.svelte";
import svelte from "svelte-inline-compile";
+import { suppressConsoleLogs } from "$lib/test-utils/suppress-console-logs";
+import { writable, type Writable } from "svelte/store";
+import { tick } from "svelte";
let mockId = 0;
jest.mock("../../hooks/use-id", () => {
@@ -13,6 +16,19 @@ jest.mock("../../hooks/use-id", () => {
beforeEach(() => (mockId = 0));
afterAll(() => jest.restoreAllMocks());
+beforeEach(() => {
+ document.body.innerHTML = "";
+});
+
+it(
+ "should error when we are using a without a parent ",
+ suppressConsoleLogs(async () => {
+ expect(() => render(Label)).toThrowError(
+ `You used a component, but it is not inside a relevant parent.`
+ );
+ })
+);
+
it("should be possible to use a LabelProvider without using a Label", async () => {
let { container } = render(svelte`
@@ -31,36 +47,144 @@ it("should be possible to use a LabelProvider without using a Label", async () =
it("should be possible to use a LabelProvider and a single Label, and have them linked", async () => {
let { container } = render(svelte`
-
+
Contents
`);
expect(container.firstChild?.firstChild).toMatchInlineSnapshot(`
-
+
+
+
+
+
+ Contents
+
+
`);
});
it("should be possible to use a LabelProvider and multiple Label components, and have them linked", async () => {
let { container } = render(svelte`
-
+
Contents
+
-
`);
expect(container.firstChild?.firstChild).toMatchInlineSnapshot(`
-
+
+
+
+
+
+ Contents
+
+
+
+
+
+
+ `);
+});
+
+it("should be possible to render a Label with an `as` prop", async () => {
+ let { container } = render(svelte`
+
+
+ `);
+});
+
+it("should be possible to change the props of a Label", async () => {
+ let classStore: Writable = writable(null);
+ let { container } = render(svelte`
+
+