@webship.co/workspace 1.0.0-beta1 → 1.0.0-rc1

package/core/workspace-app/tests/unit/assistant-views.test.js

@@ -0,0 +1,146 @@
+/**
+ * How the assistant is shown: sidebar, wide, floating, full page — plus the switch that closes it.
+ *
+ * Modelled on Drupal AI's own chatbot (a toggle in the admin toolbar, a menu in the panel header
+ * carrying Clear history and Close, an expand control, and the state on the document element), so
+ * what is checked here is the part that would break quietly: the state must be applied BEFORE first
+ * paint, the view must be a default rather than an override, and the full-page view must not leave
+ * two copies of one conversation on the screen.
+ */
+
+const assert = require('node:assert');
+const { test } = require('node:test');
+const fs = require('fs');
+const path = require('path');
+
+const app = path.join(__dirname, '..', '..');
+const server = fs.readFileSync(path.join(app, 'server.js'), 'utf8');
+const ui = fs.readFileSync(path.join(app, 'public', 'ui.js'), 'utf8');
+const css = fs.readFileSync(path.join(app, 'public', 'css', 'components', 'assistant-views.css'), 'utf8');
+const { styleSettings } = require(path.join(app, 'workspaces'));
+
+test('the view and the open state are settings, with a fallback rather than a blank panel', () => {
+  const s = styleSettings();
+  assert.ok(['sidebar', 'wide', 'float', 'full'].includes(s.assistantView), s.assistantView);
+  assert.ok(['yes', 'no'].includes(s.assistantOpen), s.assistantOpen);
+});
+
+test('the state is applied before first paint, and a stored choice wins over the setting', () => {
+  const head = server.slice(server.indexOf("var d=document.documentElement"), server.indexOf('</script>'));
+  // Read through wsPref: the stored choice is a cookie on the hub domain, so it is the same choice on
+  // every workspace subdomain rather than one per origin.
+  assert.match(head, /wsPref\('ws-assistant-view',null\)\|\|'\$\{style\.assistantView\}'/,
+    'the setting is the default, the stored choice wins — as with style.mode');
+  assert.match(head, /indexOf\(v\)<0\)v='sidebar'/, 'an unknown view must fall back, not render nothing');
+  assert.match(head, /d\.dataset\.assistantView=v/);
+  assert.match(head, /classList\.add\('assistant-closed'\)/);
+  // The panel is 25rem of the layout: deciding this in the deferred ui.js would draw the page one
+  // way and reflow it a frame later, which is the bug the rail's own pre-paint line exists for. So
+  // ui.js may only CHANGE the class, from the one function a click reaches.
+  const setsClosed = ui.match(/classList\.toggle\('assistant-closed'/g) || [];
+  assert.strictEqual(setsClosed.length, 1, 'only setAssistantOpen may write that class');
+  const fn = ui.slice(ui.indexOf('function setAssistantOpen'), ui.indexOf('function setAssistantOpen') + 400);
+  assert.match(fn, /classList\.toggle\('assistant-closed', !open\)/, 'and that is where it lives');
+});
+
+test('the panel header carries the menu, wider and close — and the menu carries the rest', () => {
+  // Up to the close button: the avatar's own menu (when it is on) comes first and is long.
+  const from = server.indexOf('class="assistant-controls"');
+  const head = server.slice(from, server.indexOf('assistant-hide', from) + 200);
+  assert.match(head, /assistant-ctl[^>]*Assistant options/, 'the kebab');
+  assert.match(head, /assistant-wider/, 'wider');
+  assert.match(head, /assistant-hide/, 'close');
+  // The items themselves are one function, since the toolbar hangs the same menu.
+  const menu = server.slice(server.indexOf('function assistantMenuItemsHtml'), server.indexOf('const AI_MARK'));
+  assert.match(menu, /hx-post="\/actions\/chat-reset"[\s\S]*?hx-trigger="confirmed-remove"/,
+    'New chat must ask first, like every other action that throws something away');
+  assert.match(menu, /class="assistant-view-pick" data-view="\$\{v\}"/, 'the views are rendered from a list');
+  assert.match(menu, /assistant-close-pick/, 'and closing it is offered where the views are');
+  for (const [v, label] of [['sidebar', 'Sidebar'], ['wide', 'Wide'], ['float', 'Floating'], ['full', 'Full page']]) {
+    assert.match(menu, new RegExp(`\\['${v}', '${label}'`), `no way to choose ${v}`);
+  }
+});
+
+test('the control is in the rail, not in the toolbar', () => {
+  // The toolbar is the corner the brand and the page identity own. The rail is where the things that
+  // apply to whatever page you are on live, which is exactly what this is.
+  const left = server.slice(server.indexOf('<div class="uk-navbar-left">'), server.indexOf('<div class="uk-navbar-right">'));
+  assert.ok(!/assistant-toggle|assistant-switch/.test(left), 'the toolbar must not carry the switch');
+  const rail = server.slice(server.indexOf("label: 'Go'"), server.indexOf("] });", server.indexOf("label: 'Go'")));
+  assert.match(rail, /<button type="button" class="action-btn actions-assistant/,
+    'the rail row is the control, and a real button — UIKit puts aria-haspopup on whatever precedes the '
+    + 'dropdown, and that attribute is not allowed on a span');
+  assert.match(rail, /\$\{assistantMenuItemsHtml\(\)\}/, 'and it carries the whole menu');
+});
+
+test('show and hide are two items the stylesheet picks between', () => {
+  const menu = server.slice(server.indexOf('function assistantMenuItemsHtml'), server.indexOf('const AI_MARK'));
+  assert.match(menu, /assistant-when-closed[\s\S]*?assistant-open-pick/, 'Show, for when it is hidden');
+  assert.match(menu, /assistant-when-open[\s\S]*?assistant-close-pick/, 'Hide, for when it is not');
+  // Neither needs a script to rename itself: which applies is a state the stylesheet already knows.
+  assert.match(css, /html\.assistant-closed \.assistant-when-open,\s*\n\s*html:not\(\.assistant-closed\) \.assistant-when-closed \{ display: none; \}/);
+});
+
+test('the full-page view is a place, not a layout', () => {
+  assert.match(ui, /if \(view === 'full'\)[\s\S]*?window\.location\.href = '\/assistant'/,
+    'choosing it must go there');
+  assert.match(ui, /window\.location\.pathname === '\/assistant'[\s\S]*?referrer/,
+    'leaving it must leave the page too — /assistant has no sidebar to become');
+  assert.match(server, /pathname === '\/assistant'/, 'the page itself');
+  // Two panels on one screen would be two views of one conversation, both live.
+  assert.match(server, /context === 'assistant' \? '' : `<aside class="assistant-side">/,
+    'the page must not also carry the docked panel');
+  assert.match(css, /html\[data-assistant-view="full"\] \.assistant-side \{ display: none; \}/);
+});
+
+test('the full-page view is escapable from an ordinary page', () => {
+  // In that view no page but /assistant draws a panel, so the panel's own menu is not there to use.
+  // The toolbar carries the same menu, or picking Full page and then navigating anywhere would leave
+  // no way back to a sidebar — the tile alone only leads back to /assistant.
+  assert.match(server, /function assistantMenuItemsHtml\(\)/, 'one menu, hung from two places');
+  // To the end of the control, not a fixed window: the comments around it grow, and a slice that is
+  // one character short reads as the menu having been taken away.
+  const railStart = server.indexOf('class="uk-inline actions-assistant-wrap"');
+  const rail = server.slice(railStart, server.indexOf('</div>`', railStart));
+  assert.match(rail, /\$\{assistantMenuItemsHtml\(\)\}/, 'the rail carries the menu, so any page can change the view');
+  const header = server.slice(server.indexOf('class="uk-inline assistant-menu"'), server.indexOf('class="uk-inline assistant-menu"') + 600);
+  assert.match(header, /\$\{assistantMenuItemsHtml\(\)\}/, 'and it must be the same menu, not a second copy');
+});
+
+test('showing it does not pretend to open a page that is already open', () => {
+  // On /assistant the assistant IS the page: writing a closed/open state there set something nobody
+  // could see, which then decided the panel on the next ordinary page for no reason the user gave.
+  const handler = ui.slice(ui.indexOf("e.target.closest('.assistant-open-pick')"), ui.indexOf("e.target.closest('.assistant-open-pick')") + 500);
+  assert.match(handler, /if \(window\.location\.pathname === '\/assistant'\) return;/);
+  assert.ok(handler.indexOf("pathname === '/assistant'") < handler.indexOf('setAssistantOpen'),
+    'it must return before writing the open state');
+  assert.match(handler, /assistantView\(\) === 'full'[\s\S]*?window\.location\.href = '\/assistant'/,
+    'and in the full-page view showing it means going there');
+});
+
+test('the floating panel can be moved, and only that one', () => {
+  // Where a floating panel should sit depends on what is under it, and that changes page by page.
+  assert.match(ui, /function draggableAssistant/);
+  assert.match(ui, /dataset\.assistantView !== 'float'\) return;/, 'only the floating view is draggable');
+  // A drag that began on the close button would close the panel on release.
+  assert.match(ui, /e\.target\.closest\('button, a, input, select, \.assistant-dropdown'\)\) return;/,
+    'the header is the handle, minus its controls');
+  assert.match(ui, /const maxX = Math\.max\(0, window\.innerWidth - r\.width\)/, 'it is clamped into the viewport');
+  assert.match(ui, /window\.addEventListener\('resize', applyStored\)/,
+    'a window that got smaller must not leave it off-screen');
+  // Leftover inline positions would fight the stylesheet in every other view.
+  assert.match(ui, /el\.style\.left = el\.style\.top = el\.style\.bottom = el\.style\.right = '';/);
+  assert.match(css, /html\[data-assistant-view="float"\] \.assistant-side \.assistant-head \{\s*\n\s*cursor: grab;/,
+    'and it has to say it can be dragged');
+});
+
+test('the launcher is the way back in, in every view', () => {
+  // The control lives in the rail now, and a collapsed rail is an icon strip a newcomer has no reason
+  // to search — so a closed assistant must leave something on the page that opens it.
+  assert.match(css, /\.assistant-launcher \{ display: none; \}/, 'not while the panel is open');
+  assert.match(css, /html\.assistant-closed \.assistant-launcher \{/, 'and in every view when it is closed');
+  assert.ok(!/html\[data-assistant-view="float"\]\.assistant-closed \.assistant-launcher \{/.test(css),
+    'not the floating view alone any more');
+  assert.match(ui, /closest\('\.assistant-launcher'\)[\s\S]*?assistantView\(\) === 'full'[\s\S]*?'\/assistant'/,
+    'and in the full-page view it leads to the page, since there is no panel to show');
+});

package/core/workspace-app/tests/unit/assistant-working-indicator.test.js

@@ -0,0 +1,49 @@
+const { test } = require('node:test');
+const assert = require('node:assert');
+const fs = require('fs');
+const path = require('path');
+
+const app = (f) => fs.readFileSync(path.join(__dirname, '../..', f), 'utf8');
+const ui = app('public/ui.js');
+const css = app('public/css/components/working-indicators.css');
+
+test('the Send button shows three animated dots while the assistant works, in place of the arrow', () => {
+  assert.ok(ui.includes(':host([data-assistant-working]) .input-button.inside-end::after'));
+  assert.ok(ui.includes('animation: ws-dots 1.2s ease-in-out infinite;'));
+  assert.ok(ui.includes(':host([data-assistant-working]) .input-button.inside-end svg { opacity: 0; }'));
+  assert.equal((ui.match(/radial-gradient\(circle, var\(--text-inverse\) 2\.4px/g) || []).length, 3, 'three dots, in the theme token and not a colour');
+});
+
+test('deep-chat\'s own dots on the button are hidden so only one animation shows', () => {
+  assert.ok(ui.includes(':host([data-assistant-working]) .loading-submit-button { display: none !important; }'));
+});
+
+test('the dots bounce one after another', () => {
+  const frames = ui.slice(ui.indexOf('@keyframes ws-dots'), ui.indexOf('@keyframes ws-dots') + 500);
+  const raised = [...frames.matchAll(/(\d+)% \{ background-position: ([^;]+);/g)].filter((m) => m[1] !== '0').map((m) => m[2].split(',').map((p) => p.trim()).findIndex((p) => p.endsWith('30%')));
+  assert.deepEqual(raised.filter((i) => i >= 0), [0, 1, 2]);
+});
+
+test('the panel header pulses the avatar and sweeps a light while it works', () => {
+  assert.ok(css.includes('.assistant-panel[data-working] .assistant-head::after'));
+  assert.ok(css.includes('.assistant-panel[data-working] .assistant-avatar { animation: assistant-pulse'));
+  assert.ok(css.includes('@keyframes assistant-sweep') && css.includes('@keyframes assistant-pulse'));
+});
+
+test('motion is switched off for people who prefer reduced motion', () => {
+  assert.ok(ui.includes('@media (prefers-reduced-motion: reduce) { :host([data-assistant-working]) .input-button.inside-end::after { animation: none; } }'));
+  assert.match(css, /prefers-reduced-motion: reduce\) \{\s*\.assistant-panel\[data-working\] \.assistant-head::after,\s*\.assistant-panel\[data-working\] \.assistant-avatar \{ animation: none; \}/);
+});
+
+test('working starts when a message is sent and ends on the answer, a reply of any kind, an error, or after a time limit', () => {
+  assert.ok(ui.includes("if (message.role === 'user') { conversationEmpty = false; narrator.cancel(); playSendAnimation(); setWorking(true); }"));
+  assert.ok(ui.includes('else setWorking(false);'), 'an assistant message ends it');
+  assert.ok(ui.includes('el.onError = () => setWorking(false, true);'), 'an error ends it, and says it failed');
+  assert.ok(ui.includes('    setWorking(false);\n    if (response && response.html)'), 'the response interceptor ends it');
+  assert.ok(ui.includes('setTimeout(() => setWorking(false), 16 * 60 * 1000)'), 'a request that never answers cannot leave it running for ever');
+});
+
+test('the state is on the panel and the chat, so both the page and the shadow styles can read it', () => {
+  assert.ok(ui.includes("el.toggleAttribute('data-assistant-working', on)"));
+  assert.ok(ui.includes("document.querySelectorAll('.assistant-panel').forEach((p) => p.toggleAttribute('data-working', on))"));
+});

package/core/workspace-app/tests/unit/assistant.test.js

@@ -0,0 +1,61 @@
+/**
+ * The assistant's page context: the part that reaches into the rest of the app.
+ *
+ * Every branch of it names something from another module, and a name that is not imported throws
+ * only when somebody asks a question from that page. That is not theoretical — after the module
+ * split the settings and workspace branches referenced `listSettingsFiles`, `CONFIG_DIR`,
+ * `findBuilderScripts` and `listBackups` without importing any of them, so the assistant worked on
+ * the home page and returned HTTP 500 on every workspace page and on settings.
+ *
+ * These tests call it for every context the dashboard can send. They cost nothing (no agent is
+ * spawned) and they fail on a missing import rather than leaving it for a person to find.
+ */
+
+const { test } = require('node:test');
+const assert = require('node:assert');
+
+const { pageContextFor } = require('../../assistant');
+const { loadWorkspaces, findBuilderScripts, commandFlags } = require('../../workspaces');
+
+test('every context the dashboard sends produces a context line', () => {
+  const keys = Object.keys(loadWorkspaces());
+  assert.ok(keys.length, 'there is at least one workspace to ask about');
+  const contexts = ['home', 'settings', 'commands',
+    ...keys.map((k) => `workspace:${k}`), ...keys.map((k) => `backups:${k}`)];
+  for (const ctx of contexts) {
+    const out = pageContextFor(ctx);
+    assert.equal(typeof out, 'string', `${ctx} should produce a string`);
+    assert.ok(out.length > 20, `${ctx} produced nothing useful: ${out}`);
+  }
+});
+
+test('the settings context names the files but never a secret', () => {
+  const out = pageContextFor('settings');
+  assert.match(out, /Settings page/);
+  assert.match(out, /settings\.yml/);
+  // It has to TELL the agent not to reveal a secret — that instruction is the safeguard.
+  assert.match(out, /NEVER print, echo, cat, grep/);
+});
+
+test('a workspace context names that workspace and its builders', () => {
+  // NOT `Object.keys(...)[0]`: the first workspace is whichever one the cards are ordered to put
+  // first, which is a setting somebody can drag. When `designs` was moved to the top this test began
+  // failing on a Penpot builder that has no --install — a true statement about the wrong workspace.
+  // Pick one that actually has a builder taking --install, which is what the assertion is about.
+  const all = loadWorkspaces();
+  const key = Object.keys(all).find((k) => {
+    const dir = all[k].dir;
+    return dir && findBuilderScripts(dir).some((b) => commandFlags(dir, b).some((f) => f.long === '--install'));
+  });
+  assert.ok(key, 'some workspace builds something with --install');
+  const out = pageContextFor(`workspace:${key}`);
+  assert.ok(out.includes(all[key].label), `should name ${all[key].label}`);
+  // The AI Context carries each command's real flag contract, not just names.
+  assert.match(out, /Command contract/);
+  assert.match(out, /--install \(-i\)/);
+});
+
+test('an unknown workspace falls back to the home context rather than throwing', () => {
+  assert.match(pageContextFor('workspace:no-such-workspace'), /home page/);
+  assert.match(pageContextFor('nonsense'), /home page/);
+});

package/core/workspace-app/tests/unit/audio-player.test.js

@@ -0,0 +1,147 @@
+/**
+ * The audio workspace and its sound player.
+ *
+ * A voice or a sound is opened from the same list a recording is, so the listing, the play route and
+ * the file route have to agree on what plays. The behavioural half starts the real server on a spare
+ * port against a temp tree, because a Play button that answers 404 is exactly what source checks miss.
+ */
+
+const { test, before, after } = require('node:test');
+const assert = require('node:assert');
+const fs = require('fs');
+const os = require('os');
+const path = require('path');
+const { spawn } = require('child_process');
+
+const APP = path.join(__dirname, '../..');
+const REPO = path.join(APP, '../..');
+const { copyConfig } = require('./_isolated-config');
+const { AUDIO_RE, VIDEO_RE } = require('../../format');
+const fb = require('../../files-browser');
+const types = require('../../workspace-types');
+
+const read = (...p) => fs.readFileSync(path.join(...p), 'utf8');
+
+test('AUDIO_RE is the set of sound the browser plays, and no video is among it', () => {
+  for (const n of ['a.mp3', 'a.WAV', 'a.ogg', 'a.oga', 'a.opus', 'a.m4a', 'a.aac', 'a.flac', 'a.weba']) {
+    assert.ok(AUDIO_RE.test(n), n);
+    assert.ok(!VIDEO_RE.test(n), `${n} is not a video`);
+  }
+  for (const n of ['a.mp4', 'a.webm', 'a.txt', 'a.mp3.txt', 'mp3']) assert.ok(!AUDIO_RE.test(n), n);
+});
+
+test('audio is a registered workspace: listed, typed as media, presented and routed', () => {
+  assert.match(read(REPO, 'core/config/settings.yml'), /^workspaces:[\s\S]*?\n {2}- audio\n/m);
+  assert.match(read(REPO, 'core/config/workspace.audio.settings.yml'), /^type: media$/m);
+  assert.match(read(REPO, 'core/config/workspace.audio.settings.yml'), /^ {2}name: audio$/m);
+  assert.strictEqual(types.resolveType('audio', undefined, 'files'), 'media');
+  assert.match(read(APP, 'workspaces.js'), /audio:\s+\{ icon: 'tabler:headphones', subtitle: 'Voices & Sounds', noun: 'sound', kind: 'files' \}/);
+  assert.match(read(APP, '.ddev/config.yaml'), /- "\*\.audio\.workspace"/);
+  for (const f of ['README.md', 'AGENTS.md', 'CLAUDE.md']) assert.ok(fs.existsSync(path.join(REPO, 'audio', f)), f);
+});
+
+test('the audio folder is browsable and a sound row gets the music icon', () => {
+  assert.ok(fb.BROWSABLE.has('audio'));
+  for (const n of ['a.mp3', 'a.opus', 'a.flac', 'a.weba']) assert.strictEqual(fb.kindIcon(n), 'tabler:music', n);
+});
+
+test('the sound player controls act on the audio in their own card', () => {
+  const ui = read(APP, 'public/media-player.js');
+  assert.match(ui, /\[data-sound-speed\]/);
+  assert.match(ui, /media\.playbackRate = r/);
+  assert.match(ui, /\[data-sound-loop\]/);
+  assert.match(ui, /media\.loop = e\.target\.checked/);
+  assert.ok(fs.existsSync(path.join(APP, 'public/css/components/sound-player.css')));
+});
+
+// ---- the running server ------------------------------------------------------------------------
+
+let proc;
+let base;
+let root;
+
+function free() {
+  return new Promise((resolve) => {
+    const s = require('net').createServer().listen(0, '127.0.0.1', () => { const p = s.address().port; s.close(() => resolve(p)); });
+  });
+}
+
+before(async () => {
+  root = fs.mkdtempSync(path.join(os.tmpdir(), 'ws-audio-'));
+  fs.mkdirSync(path.join(root, 'core'), { recursive: true });
+  copyConfig(path.join(REPO, 'core/config'), path.join(root, 'core/config'));
+  fs.symlinkSync(path.join(REPO, 'core/scripts'), path.join(root, 'core/scripts'));
+  fs.symlinkSync(APP, path.join(root, 'core/workspace-app'));
+  fs.mkdirSync(path.join(root, 'audio/voices'), { recursive: true });
+  fs.writeFileSync(path.join(root, 'audio/voices/hello.mp3'), Buffer.alloc(5000, 1));
+  fs.writeFileSync(path.join(root, 'audio/chime.wav'), Buffer.alloc(300, 2));
+  fs.writeFileSync(path.join(root, 'audio/notes.txt'), 'not a sound');
+  fs.writeFileSync(path.join(root, 'secret.mp3'), 'outside the workspace');
+  const port = await free();
+  base = `http://127.0.0.1:${port}`;
+  proc = spawn(process.execPath, ['server.js'], { cwd: APP, env: { ...process.env, PORT: String(port), WORKSPACE_ROOT: root }, stdio: ['ignore', 'pipe', 'pipe'] });
+  await new Promise((resolve, reject) => {
+    const t = setTimeout(() => reject(new Error('server did not start')), 15000);
+    proc.stdout.on('data', (d) => { if (/listening/.test(String(d))) { clearTimeout(t); resolve(); } });
+    proc.on('exit', (c) => { clearTimeout(t); reject(new Error(`server exited ${c}`)); });
+  });
+});
+
+after(() => {
+  if (proc) proc.kill();
+  if (root) fs.rmSync(root, { recursive: true, force: true });
+});
+
+const get = (p, headers) => fetch(base + p, { headers, redirect: 'manual' });
+
+test('the page lists the folder and its sound, each with a Play button', async () => {
+  const top = await (await get('/fragments/audio/items')).text();
+  assert.match(top, /items\?path=voices/);
+  assert.match(top, /title="Play chime\.wav/);
+  assert.match(top, /hx-get="\/fragments\/audio\/play\/chime\.wav"/);
+  assert.ok(!/Play notes\.txt/.test(top), 'a text file gets no Play button');
+  const sub = await (await get('/fragments/audio/items?path=voices')).text();
+  assert.match(sub, /hx-get="\/fragments\/audio\/play\/voices\/hello\.mp3"/);
+});
+
+test('the play route answers a sound with an audio player, speed and loop', async () => {
+  const r = await get('/fragments/audio/play/voices/hello.mp3');
+  assert.strictEqual(r.status, 200);
+  const html = await r.text();
+  assert.match(html, /<audio class="sound-player" controls preload="metadata" src="\/files\/audio\/voices\/hello\.mp3">/);
+  const rates = ['0.5', '0.75', ...Array.from({ length: 17 }, (_, i) => String(1 + i * 0.25))];
+  for (const rate of rates) assert.ok(html.includes(`data-sound-speed="${rate}"`), rate);
+  assert.strictEqual((html.match(/data-sound-speed=/g) || []).length, 19, 'every quarter step from 1x to 5x, and the two slower ones');
+  assert.match(html, /data-sound-loop/);
+  assert.ok(!/<video/.test(html));
+});
+
+test('the play route refuses a file that is not a sound, a missing one, and a path out of the workspace', async () => {
+  assert.strictEqual((await get('/fragments/audio/play/notes.txt')).status, 404);
+  assert.strictEqual((await get('/fragments/audio/play/voices/none.mp3')).status, 404);
+  assert.strictEqual((await get('/fragments/audio/play/..%2Fsecret.mp3')).status, 400);
+  assert.strictEqual((await get('/files/audio/..%2Fsecret.mp3')).status, 400);
+});
+
+test('a sound is served with an audio type and byte ranges, so it can be seeked', async () => {
+  const full = await get('/files/audio/voices/hello.mp3');
+  assert.strictEqual(full.status, 200);
+  assert.strictEqual(full.headers.get('content-type'), 'audio/mpeg');
+  assert.strictEqual(full.headers.get('accept-ranges'), 'bytes');
+  const part = await get('/files/audio/voices/hello.mp3', { Range: 'bytes=100-199' });
+  assert.strictEqual(part.status, 206);
+  assert.strictEqual(part.headers.get('content-range'), 'bytes 100-199/5000');
+  assert.strictEqual((await part.arrayBuffer()).byteLength, 100);
+  assert.strictEqual((await get('/files/audio/voices/hello.mp3', { Range: 'bytes=9000-' })).status, 416);
+  assert.strictEqual((await get('/files/audio/chime.wav')).headers.get('content-type'), 'audio/wav');
+});
+
+test('a video is still played as a video', async () => {
+  fs.mkdirSync(path.join(root, 'videos'), { recursive: true });
+  fs.writeFileSync(path.join(root, 'videos/demo.mp4'), Buffer.alloc(400, 3));
+  const html = await (await get('/fragments/videos/play/demo.mp4')).text();
+  assert.match(html, /<video class="video-player"/);
+  assert.ok(!/<audio/.test(html));
+  for (const rate of ['0.5', '1', '1.75', '2.25', '3.5', '4.75', '5']) assert.ok(html.includes(`data-sound-speed="${rate}"`), `video speed ${rate}`);
+  assert.match(html, /data-sound-loop/);
+});