feat(frontend): replace iframe with PDF.js viewer (#39)

- Install pdfjs-dist v5 and add optimizeDeps pre-bundle config
- New PdfViewer.svelte component: renders each page on a <canvas> with
  correct device-pixel-ratio scaling, overlays a text layer (enables
  text selection; foundation for annotations in #40), prev/next
  navigation, zoom controls, and lazy page rendering (only current ±1
  pre-fetched — avoids freezing on multi-page documents)
- Replace the <iframe> in documents/[id]/+page.svelte with PdfViewer;
  image attachments continue to use <img>; detection now uses
  doc.contentType instead of filename extension
- Unit tests for navigation controls and page counter (pdfjs mocked)
- E2E tests: PDF renders as canvas (not iframe), nav controls visible,
  image fallback stays as <img>; minimal.pdf fixture for upload tests

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/e2e/documents.spec.ts

@@ -1,4 +1,5 @@
 import { test, expect } from '@playwright/test';
+import path from 'path';
 
 /**
  * Document management E2E tests.
@@ -142,3 +143,78 @@ test.describe('Document edit', () => {
 		await page.screenshot({ path: 'test-results/e2e/document-edit-date-error.png' });
 	});
 });
+
+// ─── PDF Viewer ───────────────────────────────────────────────────────────────
+
+const PDF_FIXTURE = path.resolve(__dirname, 'fixtures/minimal.pdf');
+
+test.describe('PDF viewer', () => {
+	let pdfDocHref: string;
+
+	test.beforeAll(async ({ browser }) => {
+		// Create a document and upload the PDF fixture so later tests have a
+		// real file attached.  Runs once for the whole describe block.
+		const ctx = await browser.newContext();
+		const p = await ctx.newPage();
+
+		await p.goto('/documents/new');
+		await p.waitForSelector('[data-hydrated]');
+		await p.getByLabel('Titel').fill('E2E PDF Viewer Test');
+		await p.getByRole('button', { name: /Speichern/i }).click();
+		await p.waitForURL(/\/documents\/[^/]+$/);
+
+		// Upload the PDF on the edit page
+		const href = p.url().replace(/\/$/, '');
+		pdfDocHref = href;
+		await p.goto(`${href}/edit`);
+		await p.waitForSelector('[data-hydrated]');
+		await p.locator('input[type="file"][name="file"]').setInputFiles(PDF_FIXTURE);
+		await p.getByRole('button', { name: /Speichern/i }).click();
+		await p.waitForURL(/\/documents\/[^/]+$/);
+
+		await ctx.close();
+	});
+
+	test('PDF renders in the custom viewer — canvas is present instead of iframe', async ({
+		page
+	}) => {
+		await page.goto(pdfDocHref);
+		await page.waitForSelector('[data-hydrated]');
+
+		// There must be NO iframe — we replaced it with PDF.js canvas rendering.
+		await expect(page.locator('iframe')).not.toBeAttached();
+
+		// At least one canvas element must be visible (one per rendered page).
+		await expect(page.locator('canvas').first()).toBeVisible({ timeout: 15000 });
+
+		await page.screenshot({ path: 'test-results/e2e/pdf-viewer-canvas.png' });
+	});
+
+	test('page navigation controls are visible', async ({ page }) => {
+		await page.goto(pdfDocHref);
+		await page.waitForSelector('[data-hydrated]');
+		await page.locator('canvas').first().waitFor({ state: 'visible', timeout: 15000 });
+
+		await expect(page.getByRole('button', { name: /prev|previous|zurück|vorige/i })).toBeVisible();
+		await expect(page.getByRole('button', { name: /next|weiter|nächste/i })).toBeVisible();
+
+		await page.screenshot({ path: 'test-results/e2e/pdf-viewer-nav.png' });
+	});
+
+	test('non-PDF attachment renders as an img element, not canvas', async ({ page }) => {
+		// The seed document "Urlaubspostkarte Ostsee" has a .jpg original filename.
+		// Navigate to it and confirm an <img> is used (no canvas, no iframe).
+		await page.goto('/');
+		await page.waitForSelector('[data-hydrated]');
+		await page.goto('/?q=Urlaubspostkarte');
+		const link = page.getByRole('link', { name: /Urlaubspostkarte/i }).first();
+		const href = await link.getAttribute('href');
+		await page.goto(href!);
+		await page.waitForSelector('[data-hydrated]');
+
+		// No canvas — this is an image document
+		await expect(page.locator('canvas')).not.toBeAttached();
+
+		await page.screenshot({ path: 'test-results/e2e/pdf-viewer-image-fallback.png' });
+	});
+});

frontend/e2e/fixtures/minimal.pdf

@@ -0,0 +1,21 @@
+%PDF-1.4
+1 0 obj
+<</Type/Catalog/Pages 2 0 R>>
+endobj
+2 0 obj
+<</Type/Pages/Kids[3 0 R]/Count 1>>
+endobj
+3 0 obj
+<</Type/Page/MediaBox[0 0 612 792]/Parent 2 0 R>>
+endobj
+xref
+0 4
+0000000000 65535 f 
+0000000009 00000 n 
+0000000054 00000 n 
+0000000105 00000 n 
+trailer
+<</Size 4/Root 1 0 R>>
+startxref
+170
+%%EOF