Initial commit: mumh5, a modern Mumble client
Electron desktop app with a Svelte 5 interface for any Mumble server. - Mumble protocol core: TLS, handshake, channels, users, text, plugin data, client-side pacing of Murmur's rate limits - Voice: WebCodecs Opus over the TCP tunnel, voice activity, push to talk, always-on, devices, per-user volume and local mute - Several servers at once, voice on one; server rail with icons and ordering - Chat: channels, direct messages, side chat, file sharing through f0ckm, inline images without it, click-to-play YouTube - Profiles with rich descriptions, registration, rename, nicknames, connection information and moderation menus - Identity wizard, multiple identities, PKCS#12 import/export, desktop Mumble certificate import, certificate pinning and viewer - Tray icon with voice state - Unit, server and end-to-end tests against a real Murmur Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Claude Opus 5.5
@@ -0,0 +1,137 @@
|
||||
// Generates the README screenshots in docs/screenshots from a scripted scene.
|
||||
// docker run -d --name mumh5-shots -p 64740:64738 -e MUMBLE_SUPERUSER_PASSWORD=shots \
|
||||
// -e MUMBLE_CONFIG_AUTOBANATTEMPTS=0 -e "MUMBLE_CONFIG_WELCOMETEXT=Welcome to the community voice server." \
|
||||
// mumblevoip/mumble-server
|
||||
// npm run build && MUMBLE_TEST_HOST=localhost:64740 MUMBLE_SUPERUSER_PASSWORD=shots npm run screenshots
|
||||
import { _electron as electron } from 'playwright-core';
|
||||
import electronPath from 'electron';
|
||||
import { mkdtempSync, mkdirSync } from 'node:fs';
|
||||
import { tmpdir } from 'node:os';
|
||||
import path from 'node:path';
|
||||
import { createCodec } from '../../src/core/proto.ts';
|
||||
import { MumbleClient } from '../../src/core/client.ts';
|
||||
import type { Transport } from '../../src/core/transport.ts';
|
||||
import { openTls } from '../../electron/tls-transport.ts';
|
||||
import { generateIdentity } from '../../electron/identity.ts';
|
||||
|
||||
const target = process.env.MUMBLE_TEST_HOST;
|
||||
const superPw = process.env.MUMBLE_SUPERUSER_PASSWORD;
|
||||
if (!target || !superPw) {
|
||||
console.log('Set MUMBLE_TEST_HOST and MUMBLE_SUPERUSER_PASSWORD');
|
||||
process.exit(1);
|
||||
}
|
||||
const [host, port] = target.split(':');
|
||||
const root = path.resolve(import.meta.dirname, '../..');
|
||||
const out = path.join(root, 'docs', 'screenshots');
|
||||
mkdirSync(out, { recursive: true });
|
||||
const wait = (ms: number) => new Promise(r => setTimeout(r, ms));
|
||||
|
||||
function headless(username: string, password = ''): Promise<MumbleClient> {
|
||||
const id = generateIdentity(username);
|
||||
const client = new MumbleClient(createCodec());
|
||||
const t: Transport = { onData: null, onClose: null, send: b => conn.send(b), close: () => conn.close() };
|
||||
const conn = openTls(host, Number(port), id.certPem, id.keyPem, {
|
||||
onSecure: () => {}, onData: c => t.onData?.(c), onClose: r => t.onClose?.(r)
|
||||
});
|
||||
client.connect(t, { username, password, os: 'Linux' });
|
||||
return new Promise((res, rej) => { client.on('synced', () => res(client)); client.on('close', rej); });
|
||||
}
|
||||
|
||||
const byName = (c: MumbleClient, name: string) => [...c.channels.values()].find(x => x.name === name)!;
|
||||
|
||||
// ─── Server scene ─────────────────────────────────────────────────────────────
|
||||
const admin = await headless('SuperUser', superPw);
|
||||
// Start from an empty tree when the server is reused
|
||||
for (const c of [...admin.channels.values()]) if (c.id !== 0 && c.parent === 0) admin.send('ChannelRemove', { channel_id: c.id });
|
||||
await wait(500);
|
||||
admin.send('ChannelState', { parent: 0, name: 'Lobby', position: 0, description: '<p><b>Welcome!</b> Hang out, say hi, and drop your clips here.</p><p>Be nice. Push to talk is appreciated in busy rooms.</p>' });
|
||||
admin.send('ChannelState', { parent: 0, name: 'Gaming', position: 1 });
|
||||
admin.send('ChannelState', { parent: 0, name: 'Music', position: 2, description: 'Listening parties every Friday.' });
|
||||
admin.send('ChannelState', { parent: 0, name: 'AFK', position: 3 });
|
||||
await wait(1500);
|
||||
admin.send('ChannelState', { parent: byName(admin, 'Gaming').id, name: 'Minecraft' });
|
||||
admin.send('ChannelState', { parent: byName(admin, 'Gaming').id, name: 'Valorant' });
|
||||
await wait(1500);
|
||||
const lobby = byName(admin, 'Lobby').id;
|
||||
admin.disconnect();
|
||||
|
||||
const sarah = await headless('sarah');
|
||||
const max = await headless('max');
|
||||
const jonas = await headless('jonas');
|
||||
const lena = await headless('lena');
|
||||
sarah.joinChannel(lobby);
|
||||
max.joinChannel(lobby);
|
||||
await wait(300);
|
||||
jonas.joinChannel(byName(jonas, 'Minecraft').id);
|
||||
lena.joinChannel(byName(lena, 'Music').id);
|
||||
await wait(1200);
|
||||
lena.setSelfMute(true);
|
||||
max.setSelfDeaf(true);
|
||||
sarah.setComment('<p><b>sarah</b> <span style="color:#e8b23c">streamer, night owl</span></p><p>Mostly playing <i>Minecraft</i> and <i>Valorant</i>. Ask me about modpacks.</p><ul><li>EU evenings</li><li>Push to talk</li></ul>');
|
||||
|
||||
// ─── App ──────────────────────────────────────────────────────────────────────
|
||||
const { ELECTRON_RUN_AS_NODE, ...env } = process.env;
|
||||
const app = await electron.launch({
|
||||
executablePath: electronPath as unknown as string,
|
||||
args: [root, `--user-data-dir=${mkdtempSync(path.join(tmpdir(), 'mumh5-e2e-'))}`, '--ozone-platform=x11',
|
||||
'--use-fake-device-for-media-stream', '--use-fake-ui-for-media-stream'],
|
||||
env: env as Record<string, string>
|
||||
});
|
||||
const page = await app.firstWindow();
|
||||
await page.setViewportSize({ width: 1440, height: 900 });
|
||||
|
||||
await page.getByRole('button', { name: /Create a new identity/ }).click();
|
||||
await page.getByLabel('Name').fill('kibi');
|
||||
await page.getByRole('button', { name: 'Create', exact: true }).click();
|
||||
await page.getByRole('button', { name: 'Skip for now' }).click();
|
||||
await page.getByRole('button', { name: 'Done' }).click();
|
||||
|
||||
await page.getByTitle('Settings').click();
|
||||
await page.getByRole('tab', { name: 'Chat and files' }).click();
|
||||
await page.getByLabel('YouTube links').selectOption('thumbnail');
|
||||
await page.getByRole('tab', { name: 'Voice' }).click();
|
||||
await page.getByRole('radio', { name: /Always on/ }).click();
|
||||
await page.getByRole('button', { name: 'Done', exact: true }).click();
|
||||
|
||||
await page.getByTitle('Add a server').click();
|
||||
await page.getByLabel('Address').fill(host);
|
||||
await page.getByLabel('Port').fill(port);
|
||||
await page.getByLabel('Username').fill('kibi');
|
||||
await page.getByLabel('Label').fill('Community');
|
||||
await page.getByRole('button', { name: 'Save and connect' }).click();
|
||||
await page.getByText(/Connected/).first().waitFor();
|
||||
await page.locator('.channel .name', { hasText: 'Lobby' }).dblclick();
|
||||
await page.locator('.me .who span', { hasText: 'Lobby' }).waitFor();
|
||||
await wait(800);
|
||||
|
||||
sarah.sendText({ channels: [lobby] }, 'anyone up for a round later?');
|
||||
await wait(1200);
|
||||
max.sendText({ channels: [lobby] }, 'yes, after dinner. 8pm?');
|
||||
await wait(1200);
|
||||
await page.getByLabel('Message').fill('works for me. meanwhile, a classic: https://www.youtube.com/watch?v=dQw4w9WgXcQ');
|
||||
await page.getByLabel('Message').press('Enter');
|
||||
await wait(1200);
|
||||
sarah.sendText({ channels: [lobby] }, '<b>no.</b> not again <i>(ok it is a good song)</i>');
|
||||
await wait(3000);
|
||||
|
||||
await page.screenshot({ path: path.join(out, 'main.png') });
|
||||
|
||||
await page.locator('.sidebar .user', { hasText: 'sarah' }).click();
|
||||
await page.locator('.panel .html', { hasText: 'streamer' }).waitFor();
|
||||
await wait(500);
|
||||
await page.screenshot({ path: path.join(out, 'profile.png') });
|
||||
|
||||
await page.getByTitle('Settings').click();
|
||||
await wait(800);
|
||||
await page.screenshot({ path: path.join(out, 'voice-settings.png') });
|
||||
await page.getByRole('button', { name: 'Done', exact: true }).click();
|
||||
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
await page.locator('.scrim').first().click().catch(() => {});
|
||||
await wait(500);
|
||||
await page.screenshot({ path: path.join(out, 'mobile.png') });
|
||||
|
||||
await app.close();
|
||||
for (const c of [sarah, max, jonas, lena]) c.disconnect();
|
||||
console.log(`Screenshots written to ${out}`);
|
||||
process.exit(0);
|
||||
Reference in New Issue
Block a user