feat(grafico): HiloConductor — la línea dorada que cose la página

components/primitives/__tests__/HiloConductor.test.tsx

@@ -0,0 +1,30 @@
+import { render } from '@testing-library/react';
+import { describe, it, expect } from 'vitest';
+import { HiloConductor } from '../HiloConductor';
+
+describe('<HiloConductor />', () => {
+  it('is decorative: hidden from assistive tech', () => {
+    const { container } = render(<HiloConductor />);
+    const svg = container.querySelector('svg');
+    expect(svg).toHaveAttribute('aria-hidden', 'true');
+    expect(svg).toHaveAttribute('focusable', 'false');
+  });
+
+  it('draws a single continuous thread', () => {
+    const { container } = render(<HiloConductor />);
+    expect(container.querySelectorAll('path')).toHaveLength(1);
+  });
+
+  it('travels with the document instead of sticking to the viewport', () => {
+    const { container } = render(<HiloConductor />);
+    // `fixed` would read as an ornament pinned to the window; the thread
+    // belongs to the page and must scroll with it.
+    expect(container.firstElementChild?.className).toContain('absolute');
+    expect(container.firstElementChild?.className).not.toContain('fixed');
+  });
+
+  it('stays out of the way of pointer input', () => {
+    const { container } = render(<HiloConductor />);
+    expect(container.firstElementChild?.className).toContain('pointer-events-none');
+  });
+});