Release 0.5.0

tests/ui.e2e.ts

@@ -486,22 +486,108 @@ test('inbox, archive and administration stay concise', async ({ page }) => {
 	expect(boxes[1]?.y).toBe(boxes[2]?.y);
 });
 
-test('live preview retains its existing readable controls', async ({ page }) => {
+test('live control persists state and exposes only explicit presentation data', async ({
+	page,
+	browser
+}, testInfo) => {
 	await page.setViewportSize({ width: 1280, height: 900 });
-	await page.goto('/live');
+	await page.goto('/fundus?q=kleine+Konsole');
+	await page.getByRole('heading', { name: 'Die kleine Konsole mit dem großen Dreh' }).click();
+	const png = Buffer.from(
+		'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=',
+		'base64'
+	);
+	await page.getByLabel('Bild', { exact: true }).setInputFiles({
+		name: 'live-konsole.png',
+		mimeType: 'image/png',
+		buffer: png
+	});
+	await page.getByLabel('Alternativtext').fill('Kleine Konsole im Live-Bild');
+	await page.getByRole('button', { name: 'Bild hochladen' }).click();
+
+	await page.goto('/live?show=show-october');
+	await expect(page.getByText('Noch nicht gestartet.')).toBeVisible();
+	await page.getByRole('button', { name: 'Sendung starten' }).click();
+	await expect(page.locator('#current-title')).toHaveText('Die kleine Konsole mit dem großen Dreh');
+	await expect(
+		page.getByText('Herstellerangaben gegen unabhängige Tests prüfen')
+	).not.toBeVisible();
 
-	await expect(page.getByText('Vorschau · Live-Modus', { exact: true })).toBeVisible();
-	await expect(page.getByText('Eine Kurbel, ein gelber Knopf und sehr viel Charme')).toBeVisible();
 	const before = await page
 		.locator('.live-current')
 		.evaluate((element) => getComputedStyle(element).getPropertyValue('--prompt-size'));
 	await page.getByRole('button', { name: 'Schrift vergrößern' }).click();
-	const after = await page
+	await page.reload();
+	const restored = await page
 		.locator('.live-current')
 		.evaluate((element) => getComputedStyle(element).getPropertyValue('--prompt-size'));
-	expect(after).not.toBe(before);
-	await page.getByText('Recherche öffnen').click();
+	expect(restored).not.toBe(before);
+	await page.getByText('Manuelle Recherche öffnen').click();
 	await expect(page.locator('.research-details')).toHaveAttribute('open', '');
+
+	const [popup] = await Promise.all([
+		page.waitForEvent('popup'),
+		page.getByRole('button', { name: 'Präsentationsfenster öffnen' }).click()
+	]);
+	await popup.waitForURL(/\/heinzlive\/[A-Za-z0-9_-]+$/);
+	const outputUrl = popup.url();
+	const anonymous = await browser.newContext();
+	const output = await anonymous.newPage();
+	await output.goto(outputUrl);
+	await expect(
+		output.getByRole('heading', { name: 'Bereit für den nächsten Inhalt' })
+	).toBeVisible();
+
+	await page.getByRole('button', { name: 'Präsentieren', exact: true }).click();
+	await expect(
+		output.getByRole('heading', { name: 'Die kleine Konsole mit dem großen Dreh' })
+	).toBeVisible({
+		timeout: 10_000
+	});
+	await expect(output.getByText('Weniger Leistung, mehr Idee.')).toBeVisible();
+	await expect(output.getByAltText('Kleine Konsole im Live-Bild')).toBeVisible();
+	await output.screenshot({ path: testInfo.outputPath('heinzlive-output.png'), fullPage: true });
+	const outputHtml = await output.content();
+	expect(outputHtml).not.toContain('Herstellerangaben');
+	expect(outputHtml).not.toContain('Erst Formfaktor zeigen');
+	expect(outputHtml).not.toContain(adminEmail);
+	expect(outputHtml).not.toContain('live-konsole.png');
+	const outputState = await anonymous.request.get(`${outputUrl}/state`);
+	expect(outputState.status()).toBe(200);
+	const outputJson = await outputState.text();
+	expect(outputJson).toContain('Weniger Leistung');
+	expect(outputJson).not.toContain('Herstellerangaben');
+	expect(outputJson).not.toContain('Moderationsstichpunkte');
+	expect(outputJson).not.toContain('live-konsole.png');
+
+	await page.getByRole('button', { name: 'Als Nächstes' }).click();
+	await expect(page.locator('.next-card')).toContainText('Pixelart');
+	await page.getByRole('button', { name: 'Erledigen und weiter' }).click();
+	await expect(page.locator('.live-current')).toContainText('Pixelart');
+	await page.getByRole('button', { name: 'Überspringen' }).click();
+	await page.getByRole('button', { name: 'Zurück' }).click();
+	await expect(page.locator('.live-current')).toContainText('Pixelart');
+	await output.route('**/state', (route) => route.abort());
+	await expect(output.getByText('Verbindung unterbrochen')).toBeVisible({ timeout: 5_000 });
+	await output.unroute('**/state');
+	await expect(output.getByText('Verbunden')).toBeVisible({ timeout: 5_000 });
+	await page.setViewportSize({ width: 390, height: 844 });
+	await expectNoHorizontalOverflow(page);
+	await page.screenshot({
+		path: testInfo.outputPath('live-controller-mobile.png'),
+		fullPage: true
+	});
+	await page.setViewportSize({ width: 1280, height: 900 });
+
+	await page.evaluate(() => {
+		window.open = () => null;
+	});
+	await page.getByRole('button', { name: 'Präsentationsfenster öffnen' }).click();
+	await expect(
+		page.getByText('Popup blockiert. Bitte Popups erlauben und erneut öffnen.')
+	).toBeVisible();
+	await anonymous.close();
+	await popup.close();
 	await expectNoHorizontalOverflow(page);
 });