feat: make media inspection progressive

tests/browser/operation-matrix.spec.ts

@@ -31,6 +31,9 @@ async function importMedia(
   await mediaInput(page).setInputFiles(names.map((name) => fixture(name)));
   for (const name of names) {
     const card = page.locator('.media-card').filter({ hasText: name });
+    await page
+      .getByRole('button', { name: `Inspect details for ${name}` })
+      .click();
     await expect(card.locator('.phase--ready')).toBeVisible({
       timeout: 120_000,
     });
@@ -210,6 +213,11 @@ test.describe.serial('real ffmpeg.wasm operation matrix', () => {
     await test.step('queues a second browser job, cancels the active job and runs the waiting job after recovery', async () => {
       const sourceName = basename(cancellationFixture.filePath);
       await mediaInput(page).setInputFiles(cancellationFixture.filePath);
+      await page
+        .getByRole('button', {
+          name: `Inspect details for ${sourceName}`,
+        })
+        .click();
       await expect(
         page
           .locator('.media-card')
@@ -1055,6 +1063,11 @@ test.describe.serial('real ffmpeg.wasm operation matrix', () => {
         mimeType: 'video/x-matroska',
         buffer: readFileSync(muxed.filePath),
       });
+      await page
+        .getByRole('button', {
+          name: 'Inspect details for subtitled-source.mkv',
+        })
+        .click();
       await expect(
         page
           .locator('.media-card')