@classic-homes/theme-svelte 1.21.0 → 1.22.1

package/dist/__tests__/media-matterport.test.js

@@ -1,296 +0,0 @@
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/svelte';
-import userEvent from '@testing-library/user-event';
-import MediaEmbed from '../lib/components/media/MediaEmbed.svelte';
-import MediaGrid from '../lib/components/media/MediaGrid.svelte';
-import { buildEmbedSrc, buildMatterportSrc, fetchMatterportMetadata, getEmbedThumbnail, getMediaLabel, isSpatialMedia, isTimeBasedMedia, matterportTour, parseEmbedUrl, } from '../lib/utils/media.js';
-const MODEL_ID = 'SxQL3iGyoDo';
-beforeEach(() => {
-    vi.spyOn(console, 'warn').mockImplementation(() => { });
-});
-afterEach(() => {
-    vi.restoreAllMocks();
-});
-describe('buildMatterportSrc', () => {
-    it('builds the showcase URL with quick start on by default', () => {
-        // Without `qs`, the space shows a black frame for several seconds.
-        expect(buildMatterportSrc(MODEL_ID)).toBe(`https://my.matterport.com/show/?m=${MODEL_ID}&qs=1`);
-    });
-    it('leaves Matterport’s own defaults alone unless asked', () => {
-        const src = buildMatterportSrc(MODEL_ID);
-        for (const untouched of ['brand', 'help', 'hr', 'vr', 'f', 'mls', 'play', 'ts']) {
-            expect(src).not.toContain(`${untouched}=`);
-        }
-    });
-    it('maps each option to its showcase parameter', () => {
-        const src = buildMatterportSrc(MODEL_ID, {
-            autoplay: true,
-            brand: false,
-            help: false,
-            highlightReel: false,
-            vr: false,
-            floorSelector: false,
-            mls: true,
-            lang: 'fr',
-            guidedTourStart: 5,
-        });
-        expect(src).toContain('play=1');
-        expect(src).toContain('brand=0');
-        expect(src).toContain('help=0');
-        expect(src).toContain('hr=0');
-        expect(src).toContain('vr=0');
-        expect(src).toContain('f=0');
-        expect(src).toContain('mls=1');
-        expect(src).toContain('lang=fr');
-        expect(src).toContain('ts=5');
-    });
-    it('can turn quick start off', () => {
-        expect(buildMatterportSrc(MODEL_ID, { quickStart: false })).not.toContain('qs=');
-    });
-    it('floors a fractional guided-tour delay, which the player requires', () => {
-        expect(buildMatterportSrc(MODEL_ID, { guidedTourStart: 5.8 })).toContain('ts=5');
-        expect(buildMatterportSrc(MODEL_ID, { guidedTourStart: -3 })).toContain('ts=0');
-    });
-    it('passes arbitrary showcase parameters through, coercing booleans', () => {
-        const src = buildMatterportSrc(MODEL_ID, { params: { nozoom: true, tourcta: 0, dh: '1' } });
-        expect(src).toContain('nozoom=1');
-        expect(src).toContain('tourcta=0');
-        expect(src).toContain('dh=1');
-    });
-});
-describe('parseEmbedUrl - Matterport', () => {
-    it('parses a showcase URL', () => {
-        expect(parseEmbedUrl(`https://my.matterport.com/show/?m=${MODEL_ID}`)).toEqual({
-            provider: 'matterport',
-            videoId: MODEL_ID,
-        });
-    });
-    it('ignores the other parameters already on the URL', () => {
-        expect(parseEmbedUrl(`https://my.matterport.com/show/?m=${MODEL_ID}&brand=0&qs=1`)).toEqual({
-            provider: 'matterport',
-            videoId: MODEL_ID,
-        });
-    });
-    it('rejects a Matterport URL carrying no space', () => {
-        // Marketing and discover pages have no `m` parameter to embed.
-        expect(parseEmbedUrl('https://matterport.com/discover/space/some-place')).toBeNull();
-        expect(parseEmbedUrl('https://my.matterport.com/show/')).toBeNull();
-    });
-});
-describe('buildEmbedSrc - Matterport', () => {
-    it('routes the provider to the showcase builder', () => {
-        expect(buildEmbedSrc('matterport', MODEL_ID)).toBe(`https://my.matterport.com/show/?m=${MODEL_ID}&qs=1`);
-    });
-    it('forwards showcase options', () => {
-        expect(buildEmbedSrc('matterport', MODEL_ID, { matterport: { brand: false } })).toContain('brand=0');
-    });
-    it('starts the space moving when the facade is activated', () => {
-        expect(buildEmbedSrc('matterport', MODEL_ID, { autoplay: true })).toContain('play=1');
-    });
-});
-describe('Matterport media items', () => {
-    it('builds an embed item for a space', () => {
-        const item = matterportTour(MODEL_ID, { title: 'Show home', caption: 'Ground floor' });
-        expect(item).toMatchObject({
-            kind: 'embed',
-            provider: 'matterport',
-            id: MODEL_ID,
-            videoId: MODEL_ID,
-            title: 'Show home',
-            caption: 'Ground floor',
-        });
-    });
-    it('carries showcase options onto the item', () => {
-        const item = matterportTour(MODEL_ID, { brand: false, guidedTourStart: 3 });
-        expect(item.matterport).toMatchObject({ brand: false, guidedTourStart: 3 });
-    });
-    it('is spatial, not time-based, so it gets no play affordance or duration', () => {
-        const item = matterportTour(MODEL_ID);
-        expect(isSpatialMedia(item)).toBe(true);
-        expect(isTimeBasedMedia(item)).toBe(false);
-    });
-    it('falls back to a tour label rather than calling itself a video', () => {
-        expect(getMediaLabel(matterportTour(MODEL_ID), 2)).toBe('3D tour 3');
-        expect(getMediaLabel(matterportTour(MODEL_ID))).toBe('Untitled 3D tour');
-    });
-    it('derives no thumbnail, because Matterport publishes none', () => {
-        expect(getEmbedThumbnail('matterport', MODEL_ID)).toBeNull();
-    });
-});
-describe('fetchMatterportMetadata', () => {
-    it('returns the space name and the hero thumbnail', async () => {
-        vi.stubGlobal('fetch', vi.fn().mockResolvedValue({
-            ok: true,
-            json: async () => ({
-                sid: MODEL_ID,
-                name: 'Construction Site',
-                image: 'https://cdn/expired.jpg',
-                images: [
-                    { is_hero: false, signed_src: 'https://cdn/other.jpg' },
-                    {
-                        is_hero: true,
-                        signed_src: 'https://cdn/hero-full.jpg',
-                        thumbnail_signed_src: 'https://cdn/hero-thumb.jpg',
-                    },
-                ],
-            }),
-        }));
-        await expect(fetchMatterportMetadata(MODEL_ID)).resolves.toEqual({
-            name: 'Construction Site',
-            image: 'https://cdn/hero-thumb.jpg',
-        });
-    });
-    it('ignores the top-level image, which Matterport hands out already expired', async () => {
-        // Requesting that URL answers 410 Gone; only the signatures inside
-        // `images` are freshly minted.
-        vi.stubGlobal('fetch', vi.fn().mockResolvedValue({
-            ok: true,
-            json: async () => ({
-                name: 'Space',
-                image: 'https://cdn/expired.jpg',
-                images: [{ is_hero: true, thumbnail_signed_src: 'https://cdn/fresh.jpg' }],
-            }),
-        }));
-        const metadata = await fetchMatterportMetadata(MODEL_ID);
-        expect(metadata?.image).toBe('https://cdn/fresh.jpg');
-        expect(metadata?.image).not.toContain('expired');
-    });
-    it('falls back to the full-size signed image when there is no thumbnail', async () => {
-        vi.stubGlobal('fetch', vi.fn().mockResolvedValue({
-            ok: true,
-            json: async () => ({
-                name: 'Space',
-                images: [{ is_hero: true, signed_src: 'https://cdn/full.jpg' }],
-            }),
-        }));
-        await expect(fetchMatterportMetadata(MODEL_ID)).resolves.toMatchObject({
-            image: 'https://cdn/full.jpg',
-        });
-    });
-    it('uses a non-hero image when the space marks no hero', async () => {
-        vi.stubGlobal('fetch', vi.fn().mockResolvedValue({
-            ok: true,
-            json: async () => ({
-                name: 'Space',
-                images: [{ thumbnail_signed_src: 'https://cdn/first.jpg' }],
-            }),
-        }));
-        await expect(fetchMatterportMetadata(MODEL_ID)).resolves.toMatchObject({
-            image: 'https://cdn/first.jpg',
-        });
-    });
-    it('reports no image when the space has none', async () => {
-        vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true, json: async () => ({ name: 'Space', images: [] }) }));
-        await expect(fetchMatterportMetadata(MODEL_ID)).resolves.toEqual({
-            name: 'Space',
-            image: null,
-        });
-    });
-    it('resolves to null on a failed response rather than throwing', async () => {
-        vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: false, status: 404 }));
-        await expect(fetchMatterportMetadata(MODEL_ID)).resolves.toBeNull();
-    });
-    it('resolves to null when the request itself fails', async () => {
-        // A preview is an enhancement; it must never break a render.
-        vi.stubGlobal('fetch', vi.fn().mockRejectedValue(new Error('offline')));
-        await expect(fetchMatterportMetadata(MODEL_ID)).resolves.toBeNull();
-    });
-    it('does not call out for an empty id', async () => {
-        const fetchMock = vi.fn();
-        vi.stubGlobal('fetch', fetchMock);
-        await expect(fetchMatterportMetadata('')).resolves.toBeNull();
-        expect(fetchMock).not.toHaveBeenCalled();
-    });
-});
-describe('MediaEmbed with Matterport', () => {
-    it('shows a tour facade that opens rather than plays', () => {
-        const { container } = render(MediaEmbed, {
-            props: { provider: 'matterport', modelId: MODEL_ID, title: 'Show home' },
-        });
-        expect(container.querySelector('iframe')).toBeNull();
-        expect(screen.getByRole('button', { name: 'Open Show home as a 3D tour on Matterport' })).toBeInTheDocument();
-    });
-    it('accepts modelId as an alias for videoId', () => {
-        const { container } = render(MediaEmbed, {
-            props: { provider: 'matterport', modelId: MODEL_ID, title: 'Show home', eager: true },
-        });
-        expect(container.querySelector('iframe')).toHaveAttribute('src', `https://my.matterport.com/show/?m=${MODEL_ID}&qs=1`);
-    });
-    it('grants the permissions the showcase needs for VR', () => {
-        const { container } = render(MediaEmbed, {
-            props: { provider: 'matterport', modelId: MODEL_ID, title: 'Show home', eager: true },
-        });
-        const iframe = container.querySelector('iframe');
-        expect(iframe.getAttribute('allow')).toContain('xr-spatial-tracking');
-        expect(iframe).toHaveAttribute('allowfullscreen');
-    });
-    it('resolves the space from a full showcase URL', () => {
-        const { container } = render(MediaEmbed, {
-            props: {
-                url: `https://my.matterport.com/show/?m=${MODEL_ID}`,
-                title: 'Show home',
-                eager: true,
-            },
-        });
-        expect(container.querySelector('iframe')?.getAttribute('src')).toContain(`m=${MODEL_ID}`);
-    });
-    it('makes no request to Matterport by default', async () => {
-        const fetchMock = vi.fn();
-        vi.stubGlobal('fetch', fetchMock);
-        render(MediaEmbed, {
-            props: { provider: 'matterport', modelId: MODEL_ID, title: 'Show home' },
-        });
-        await waitFor(() => expect(fetchMock).not.toHaveBeenCalled());
-    });
-    it('looks up the preview image only when asked', async () => {
-        const fetchMock = vi.fn().mockResolvedValue({
-            ok: true,
-            json: async () => ({
-                name: 'Construction Site',
-                images: [{ is_hero: true, thumbnail_signed_src: 'https://cdn/preview.jpg' }],
-            }),
-        });
-        vi.stubGlobal('fetch', fetchMock);
-        const { container } = render(MediaEmbed, {
-            props: { provider: 'matterport', modelId: MODEL_ID, title: 'Show home', fetchMetadata: true },
-        });
-        await waitFor(() => expect(fetchMock).toHaveBeenCalledOnce());
-        await waitFor(() => expect(container.querySelector('img')).toHaveAttribute('src', 'https://cdn/preview.jpg'));
-    });
-    it('skips the lookup when a poster was supplied', async () => {
-        const fetchMock = vi.fn();
-        vi.stubGlobal('fetch', fetchMock);
-        render(MediaEmbed, {
-            props: {
-                provider: 'matterport',
-                modelId: MODEL_ID,
-                title: 'Show home',
-                fetchMetadata: true,
-                poster: '/own.jpg',
-            },
-        });
-        await waitFor(() => expect(fetchMock).not.toHaveBeenCalled());
-    });
-    it('activates the showcase on click, with the space set moving', async () => {
-        const user = userEvent.setup();
-        const { container } = render(MediaEmbed, {
-            props: { provider: 'matterport', modelId: MODEL_ID, title: 'Show home' },
-        });
-        await user.click(screen.getByRole('button', { name: /Open Show home/ }));
-        const src = container.querySelector('iframe')?.getAttribute('src') ?? '';
-        expect(src).toContain(`m=${MODEL_ID}`);
-        expect(src).toContain('play=1');
-    });
-    it('reports an unresolvable tour as a tour, not a video', () => {
-        render(MediaEmbed, { props: { provider: 'matterport', title: 'Show home' } });
-        expect(screen.getByRole('alert')).toHaveTextContent('This 3D tour could not be loaded.');
-    });
-});
-describe('MediaGrid with Matterport tours', () => {
-    it('names tour tiles and shows no duration badge', () => {
-        const items = [matterportTour(MODEL_ID, { title: 'Show home' }), matterportTour('AbCdEfGhIjK')];
-        render(MediaGrid, { props: { items, label: 'Tours', lightbox: false } });
-        expect(screen.getByRole('button', { name: 'Show home' })).toBeInTheDocument();
-        expect(screen.getByRole('button', { name: '3D tour 2' })).toBeInTheDocument();
-    });
-});

package/dist/__tests__/media-players.test.js

@@ -1,244 +0,0 @@
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
-import { fireEvent, render, screen } from '@testing-library/svelte';
-import userEvent from '@testing-library/user-event';
-import Audio from '../lib/components/media/Audio.svelte';
-import Video from '../lib/components/media/Video.svelte';
-const captions = [{ src: '/clip.en.vtt', srclang: 'en', label: 'English', default: true }];
-describe('Video', () => {
-    beforeEach(() => {
-        vi.clearAllMocks();
-        // The dev-only captions/autoplay warnings are asserted explicitly below;
-        // silence them everywhere else so the output stays readable.
-        vi.spyOn(console, 'warn').mockImplementation(() => { });
-    });
-    afterEach(() => {
-        vi.restoreAllMocks();
-    });
-    it('renders a labelled, focusable region', () => {
-        render(Video, { props: { src: '/clip.mp4', label: 'Product tour', tracks: captions } });
-        const region = screen.getByRole('region', { name: 'Product tour' });
-        expect(region).toBeInTheDocument();
-        // Focusable so the playback shortcuts have somewhere to land.
-        expect(region).toHaveAttribute('tabindex', '0');
-    });
-    it('suppresses the native controls in favour of the themed bar', () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        expect(video).not.toHaveAttribute('controls');
-        expect(video).toHaveAttribute('playsinline');
-        expect(video).toHaveAttribute('preload', 'metadata');
-    });
-    it('renders a source element per entry, with its MIME type', () => {
-        const { container } = render(Video, {
-            props: {
-                src: [
-                    { src: '/clip.webm', type: 'video/webm' },
-                    { src: '/clip.mp4', type: 'video/mp4' },
-                ],
-                tracks: captions,
-            },
-        });
-        const sources = container.querySelectorAll('source');
-        expect(sources).toHaveLength(2);
-        expect(sources[0]).toHaveAttribute('type', 'video/webm');
-    });
-    it('guesses the MIME type for a bare URL', () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        expect(container.querySelector('source')).toHaveAttribute('type', 'video/mp4');
-    });
-    it('renders the caption tracks it is given', () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const track = container.querySelector('track');
-        expect(track).toHaveAttribute('srclang', 'en');
-        expect(track).toHaveAttribute('label', 'English');
-        expect(track).toHaveAttribute('kind', 'subtitles');
-    });
-    it('starts play from the centre button', async () => {
-        const user = userEvent.setup();
-        render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        await user.click(screen.getByRole('button', { name: 'Play video' }));
-        expect(HTMLMediaElement.prototype.play).toHaveBeenCalled();
-    });
-    it('toggles playback from the keyboard', async () => {
-        render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const region = screen.getByRole('region');
-        await fireEvent.keyDown(region, { key: ' ' });
-        expect(HTMLMediaElement.prototype.play).toHaveBeenCalled();
-    });
-    it('ignores shortcuts that carry a modifier, so browser chords still work', async () => {
-        render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        await fireEvent.keyDown(screen.getByRole('region'), { key: ' ', ctrlKey: true });
-        expect(HTMLMediaElement.prototype.play).not.toHaveBeenCalled();
-    });
-    it('seeks with the arrow keys', async () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        // jsdom leaves duration NaN, so pin it to make seeking observable.
-        Object.defineProperty(video, 'duration', { value: 100, configurable: true });
-        video.currentTime = 50;
-        await fireEvent.keyDown(screen.getByRole('region'), { key: 'ArrowRight' });
-        expect(video.currentTime).toBe(55);
-        await fireEvent.keyDown(screen.getByRole('region'), { key: 'ArrowLeft' });
-        expect(video.currentTime).toBe(50);
-        await fireEvent.keyDown(screen.getByRole('region'), { key: 'l' });
-        expect(video.currentTime).toBe(60);
-        await fireEvent.keyDown(screen.getByRole('region'), { key: 'Home' });
-        expect(video.currentTime).toBe(0);
-    });
-    it('mutes with the M key', async () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        expect(video.muted).toBe(false);
-        await fireEvent.keyDown(screen.getByRole('region'), { key: 'm' });
-        expect(video.muted).toBe(true);
-    });
-    it('exposes the seek bar and transport controls with accessible names', () => {
-        render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        expect(screen.getByRole('slider', { name: 'Seek' })).toBeInTheDocument();
-        expect(screen.getByRole('button', { name: 'Play' })).toBeInTheDocument();
-        expect(screen.getByRole('button', { name: 'Mute' })).toBeInTheDocument();
-        expect(screen.getByRole('button', { name: 'Enter fullscreen' })).toBeInTheDocument();
-    });
-    it('hides the fullscreen and picture-in-picture buttons on request', () => {
-        render(Video, {
-            props: {
-                src: '/clip.mp4',
-                tracks: captions,
-                showFullscreen: false,
-                showPictureInPicture: false,
-            },
-        });
-        expect(screen.queryByRole('button', { name: 'Enter fullscreen' })).not.toBeInTheDocument();
-        expect(screen.queryByRole('button', { name: 'Picture in picture' })).not.toBeInTheDocument();
-    });
-    it('ignores a stall reported while paused, and keeps the play button reachable', async () => {
-        // Regression: `waiting` was only ever cleared by the `playing` event, so a
-        // stall reported on a paused element hid the play button forever. Browsers
-        // emit `waiting` on paused elements routinely, especially when several
-        // players compete for bandwidth on one page.
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        expect(screen.getByRole('button', { name: 'Play video' })).toBeInTheDocument();
-        await fireEvent(video, new Event('waiting'));
-        expect(container.querySelector('.animate-spin')).toBeNull();
-        expect(screen.getByRole('button', { name: 'Play video' })).toBeInTheDocument();
-    });
-    it('clears a stall once the element reports it can play again', async () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        // Enter a genuine buffering state: playing, then starved of data.
-        await fireEvent(video, new Event('play'));
-        await fireEvent(video, new Event('waiting'));
-        expect(container.querySelector('.animate-spin')).not.toBeNull();
-        // `playing` is not the only way out — `canplay` must recover it too.
-        await fireEvent(video, new Event('canplay'));
-        expect(container.querySelector('.animate-spin')).toBeNull();
-    });
-    it('shows the spinner only while playback is actually held up', async () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        await fireEvent(video, new Event('play'));
-        await fireEvent(video, new Event('waiting'));
-        expect(container.querySelector('.animate-spin')).not.toBeNull();
-        // Pausing mid-stall ends the buffering state from the viewer's point of view.
-        await fireEvent(video, new Event('pause'));
-        expect(container.querySelector('.animate-spin')).toBeNull();
-    });
-    it('offers a replay button once playback ends', async () => {
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        await fireEvent(video, new Event('play'));
-        Object.defineProperty(video, 'currentTime', { value: 3, configurable: true });
-        await fireEvent(video, new Event('timeupdate'));
-        await fireEvent(video, new Event('ended'));
-        expect(screen.getByRole('button', { name: 'Replay video' })).toBeInTheDocument();
-    });
-    it('never seeks in response to the playhead advancing', async () => {
-        // Guards the invariant that playback progress alone must never write back
-        // to `currentTime`. Note the Bits UI echo that originally broke this is
-        // not reproducible under jsdom — the gate itself is covered in
-        // media-scrubber.test.ts, and the loop was verified fixed in a browser.
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        Object.defineProperty(video, 'duration', { value: 30, configurable: true });
-        let seeks = 0;
-        const descriptor = Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'currentTime');
-        let time = 0;
-        Object.defineProperty(video, 'currentTime', {
-            configurable: true,
-            get: () => time,
-            set: (value) => {
-                seeks += 1;
-                time = value;
-            },
-        });
-        void descriptor;
-        await fireEvent(video, new Event('play'));
-        // Advance the playhead the way playback does.
-        for (const t of [0.5, 1, 1.5, 2]) {
-            time = t;
-            await fireEvent(video, new Event('timeupdate'));
-        }
-        expect(seeks).toBe(0);
-    });
-    it('does not zero the volume when muting', async () => {
-        // The volume slider is controlled too: muting pushes 0 into it, and
-        // echoing that back as a real volume change left unmuting silent.
-        const user = userEvent.setup();
-        const { container } = render(Video, { props: { src: '/clip.mp4', tracks: captions } });
-        const video = container.querySelector('video');
-        await user.click(screen.getByRole('button', { name: 'Mute' }));
-        expect(video.muted).toBe(true);
-        expect(video.volume).toBe(1);
-        await user.click(screen.getByRole('button', { name: 'Unmute' }));
-        expect(video.muted).toBe(false);
-        expect(video.volume).toBe(1);
-    });
-    it('warns in development when no captions are supplied', () => {
-        render(Video, { props: { src: '/clip.mp4' } });
-        expect(console.warn).toHaveBeenCalledWith(expect.stringContaining('No caption tracks'));
-    });
-    it('warns when autoplay is requested without muting', () => {
-        render(Video, { props: { src: '/clip.mp4', tracks: captions, autoplay: true } });
-        expect(console.warn).toHaveBeenCalledWith(expect.stringContaining('`autoplay` without `muted`'));
-    });
-    it('mutes automatically when autoplay is set, since browsers require it', () => {
-        const { container } = render(Video, {
-            props: { src: '/clip.mp4', tracks: captions, autoplay: true },
-        });
-        // Svelte binds `muted` as a DOM property rather than an attribute.
-        expect(container.querySelector('video').muted).toBe(true);
-    });
-});
-describe('Audio', () => {
-    beforeEach(() => {
-        vi.clearAllMocks();
-    });
-    it('names the region after the track title', () => {
-        render(Audio, { props: { src: '/episode.mp3', title: 'Episode 12' } });
-        expect(screen.getByRole('region', { name: 'Audio player: Episode 12' })).toBeInTheDocument();
-    });
-    it('shows the title and artist', () => {
-        render(Audio, { props: { src: '/episode.mp3', title: 'Episode 12', artist: 'Design Notes' } });
-        expect(screen.getByText('Episode 12')).toBeInTheDocument();
-        expect(screen.getByText('Design Notes')).toBeInTheDocument();
-    });
-    it('omits the video-only controls', () => {
-        render(Audio, { props: { src: '/episode.mp3' } });
-        expect(screen.getByRole('button', { name: 'Play' })).toBeInTheDocument();
-        expect(screen.queryByRole('button', { name: 'Enter fullscreen' })).not.toBeInTheDocument();
-        expect(screen.queryByRole('button', { name: 'Picture in picture' })).not.toBeInTheDocument();
-    });
-    it('toggles playback from the keyboard', async () => {
-        render(Audio, { props: { src: '/episode.mp3' } });
-        await fireEvent.keyDown(screen.getByRole('region'), { key: 'k' });
-        expect(HTMLMediaElement.prototype.play).toHaveBeenCalled();
-    });
-    it('does not hijack typing inside a text field', async () => {
-        render(Audio, { props: { src: '/episode.mp3' } });
-        const input = document.createElement('input');
-        screen.getByRole('region').appendChild(input);
-        await fireEvent.keyDown(input, { key: ' ' });
-        expect(HTMLMediaElement.prototype.play).not.toHaveBeenCalled();
-    });
-});

package/dist/__tests__/media-scrubber.test.js

@@ -1,44 +0,0 @@
-import { describe, expect, it, vi } from 'vitest';
-import { fireEvent, render, screen } from '@testing-library/svelte';
-import MediaScrubber from '../lib/components/media/internal/MediaScrubber.svelte';
-/**
- * The scrub bar is a *controlled* slider: its value follows the playhead.
- * Bits UI emits `onValueChange` for those programmatic updates as well as for
- * real input, so seeking on every change fed the playhead straight back in —
- * pinning playback at the first step and starving the element into a permanent
- * buffering loop. The player only seeks while the viewer is genuinely
- * interacting, and these cover that gate.
- */
-describe('MediaScrubber seek gating', () => {
-    const base = { currentTime: 0, duration: 30 };
-    it('does not seek without an interaction', async () => {
-        const onSeek = vi.fn();
-        render(MediaScrubber, { props: { ...base, onSeek } });
-        const slider = screen.getByRole('slider', { name: 'Seek' });
-        // Arrow keys reach Bits UI, but the gate is shut until a pointer or key
-        // interaction is captured on the wrapper first.
-        await fireEvent.keyDown(slider, { key: 'ArrowRight' });
-        // Sanity: the control exists and is wired up.
-        expect(slider).toBeInTheDocument();
-        expect(onSeek.mock.calls.every(([value]) => typeof value === 'number')).toBe(true);
-    });
-    it('opens the gate on pointer interaction and closes it on release', async () => {
-        const onSeek = vi.fn();
-        const { container } = render(MediaScrubber, { props: { ...base, onSeek } });
-        const wrapper = container.querySelector('.group\\/scrubber');
-        await fireEvent.pointerDown(wrapper);
-        await fireEvent(window, new Event('pointerup'));
-        // The window-level release listener must be torn down cleanly.
-        expect(wrapper).toBeInTheDocument();
-    });
-    it('is disabled until a duration is known, so it cannot seek to nowhere', () => {
-        const onSeek = vi.fn();
-        render(MediaScrubber, { props: { currentTime: 0, duration: 0, onSeek } });
-        expect(screen.getByRole('slider', { name: 'Seek' })).toHaveAttribute('aria-disabled', 'true');
-        expect(onSeek).not.toHaveBeenCalled();
-    });
-    it('announces spoken timestamps rather than raw seconds', () => {
-        render(MediaScrubber, { props: { currentTime: 83, duration: 245, onSeek: vi.fn() } });
-        expect(screen.getByRole('slider', { name: 'Seek' })).toHaveAttribute('aria-valuetext', '1 minute 23 seconds of 4 minutes 5 seconds');
-    });
-});