test(Slider): cover Slider with tests

src/shared/ui/Slider/Slider.svelte.test.ts

@@ -0,0 +1,62 @@
+import {
+    render,
+    screen,
+} from '@testing-library/svelte';
+import Slider from './Slider.svelte';
+
+describe('Slider', () => {
+    describe('Rendering', () => {
+        it('renders a slider element', () => {
+            render(Slider);
+            expect(screen.getByRole('slider')).toBeInTheDocument();
+        });
+
+        it('displays formatted value', () => {
+            render(Slider, { value: 50 });
+            expect(screen.getByText('50')).toBeInTheDocument();
+        });
+
+        it('applies a custom formatter', () => {
+            const { container } = render(Slider, { value: 25, format: (v: number) => `${v}%` });
+            expect(container.textContent).toContain('25%');
+        });
+    });
+
+    describe('Props', () => {
+        it('respects min and max attributes', () => {
+            render(Slider, { min: 10, max: 90, value: 50 });
+            const slider = screen.getByRole('slider');
+            expect(slider).toHaveAttribute('aria-valuemin', '10');
+            expect(slider).toHaveAttribute('aria-valuemax', '90');
+        });
+
+        it('reflects value as aria-valuenow', () => {
+            render(Slider, { value: 42 });
+            expect(screen.getByRole('slider')).toHaveAttribute('aria-valuenow', '42');
+        });
+
+        it('is disabled when disabled=true', () => {
+            render(Slider, { disabled: true });
+            expect(screen.getByRole('slider')).toHaveAttribute('aria-disabled', 'true');
+        });
+
+        it('is not disabled by default', () => {
+            render(Slider, { value: 0 });
+            expect(screen.getByRole('slider')).not.toHaveAttribute('aria-disabled', 'true');
+        });
+    });
+
+    describe('Orientations', () => {
+        it('renders horizontal by default', () => {
+            const { container } = render(Slider);
+            expect(screen.getByRole('slider')).toHaveAttribute('aria-orientation', 'horizontal');
+            expect(container.querySelector('.cursor-col-resize')).toBeInTheDocument();
+        });
+
+        it('renders vertical when orientation="vertical"', () => {
+            const { container } = render(Slider, { orientation: 'vertical' });
+            expect(screen.getByRole('slider')).toHaveAttribute('aria-orientation', 'vertical');
+            expect(container.querySelector('.cursor-row-resize')).toBeInTheDocument();
+        });
+    });
+});