From 9fbce095b246ee8bee4c4557d837154b361c9cba Mon Sep 17 00:00:00 2001
From: Ilia Mashkov <hikkikomori7@gmail.com>
Date: Fri, 17 Apr 2026 20:12:43 +0300
Subject: [PATCH] test(Footnote): cover Footnote with tests

---
 .../ui/Footnote/Footnote.svelte.test.ts       | 33 +++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 src/shared/ui/Footnote/Footnote.svelte.test.ts

diff --git a/src/shared/ui/Footnote/Footnote.svelte.test.ts b/src/shared/ui/Footnote/Footnote.svelte.test.ts
new file mode 100644
index 0000000..cf2270a
--- /dev/null
+++ b/src/shared/ui/Footnote/Footnote.svelte.test.ts
@@ -0,0 +1,33 @@
+import {
+    render,
+    screen,
+} from '@testing-library/svelte';
+import { createRawSnippet } from 'svelte';
+import Footnote from './Footnote.svelte';
+
+function textSnippet(text: string) {
+    return createRawSnippet(() => ({ render: () => `<span>${text}</span>` }));
+}
+
+describe('Footnote', () => {
+    it('renders children content in a span', () => {
+        render(Footnote, { children: textSnippet('* measured at 20°C') });
+        expect(screen.getByText('* measured at 20°C')).toBeInTheDocument();
+    });
+
+    it('renders nothing when no children or render', () => {
+        const { container } = render(Footnote);
+        expect(container.firstElementChild).toBeNull();
+    });
+
+    it('passes class to the render snippet', () => {
+        const renderSnippet = createRawSnippet<[{ class: string }]>(getParams => ({
+            render: () => {
+                const cls = getParams().class;
+                return `<span class="${cls}">note</span>`;
+            },
+        }));
+        const { container } = render(Footnote, { render: renderSnippet });
+        expect(container.querySelector('span')?.className).toContain('font-mono');
+    });
+});