release: 0.120.1 (bug/files-thumb-webkit)

CHANGELOG.md

@@ -7,6 +7,12 @@ edit the release notes and re-run the generator.
 
 Upgrading, pinning a version and rolling back: [docs/self-hosting.md](docs/self-hosting.md#upgrading).
 
+## 0.120.1 — 2026-11-14
+
+### Fixed
+
+- On an iPad, the pictures in the Files list show the whole poster again, not a blurred close-up of a small part of it.
+
 ## 0.120.0 — 2026-11-14
 
 ### New

VERSION

@@ -1 +1 @@
-0.120.0
+0.120.1

frontend/e2e/files.spec.ts

@@ -24,6 +24,52 @@ test.describe("Files", () => {
     await expect(dialog(page)).toBeHidden();
   });
 
+  // WebKit (every iPad browser) cannot resolve a percentage height against a box whose height comes
+  // from aspect-ratio inside a table cell: the picture took its own full height and the 16:9 box
+  // showed a native-size sliver of it, a blur of colour. The library is stubbed with one file whose
+  // poster is a tall picture, the case that shows it most.
+  test("a row's picture fits its box", async ({ page }) => {
+    const file = {
+      id: 990001,
+      status: "done",
+      progress: 100,
+      created_at: "2026-11-14T10:00:00+00:00",
+      source_kind: "youtube",
+      source_ref: "e2e-thumb",
+      source_url: null,
+      poster_url: "/api/downloads/990001/poster.jpg",
+      display_name: "A tall poster",
+      display_uploader: null,
+      extra_links: [],
+      can_download: true,
+      job_kind: "download",
+      folder_id: null,
+      kept: false,
+      expires_at: null,
+      shared: false,
+      source_key: "youtube",
+      asset: { media_kind: "video", duration_s: 60, size_bytes: 2048 },
+    };
+    await page.route(/\/api\/files(\?|$)/, (route) => route.fulfill({ json: [file] }));
+    await page.route(/\/api\/downloads\/990001\/poster\.jpg/, (route) =>
+      route.fulfill({
+        contentType: "image/svg+xml",
+        body: '<svg xmlns="http://www.w3.org/2000/svg" width="1080" height="1920"><rect width="1080" height="1920" fill="#3a6"/></svg>',
+      }),
+    );
+    // Wide enough that the picture column shows beside a pinned rail (an iPad Pro in landscape).
+    await page.setViewportSize({ width: 1366, height: 1024 });
+    await openApp(page);
+    await gotoPage(page, "files");
+    const picture = page.getByRole("row", { name: /A tall poster/ }).locator("img");
+    await expect(picture).toBeVisible();
+    const fit = await picture.evaluate((img) => {
+      const box = img.parentElement!.getBoundingClientRect();
+      return { img: img.getBoundingClientRect().height, box: box.height };
+    });
+    expect(fit.img).toBeLessThanOrEqual(fit.box);
+  });
+
   test("a link pasted onto a page (not into a field) opens the download dialog", async ({
     page,
   }) => {

frontend/src/content/release-notes/en.json

@@ -1,4 +1,12 @@
 [
+  {
+    "version": "0.120.1",
+    "date": "2026-11-14",
+    "new": [],
+    "fixed": [
+      "On an iPad, the pictures in the Files list show the whole poster again, not a blurred close-up of a small part of it."
+    ]
+  },
   {
     "version": "0.120.0",
     "date": "2026-11-14",

frontend/src/content/release-notes/hu.json

@@ -1,4 +1,12 @@
 [
+  {
+    "version": "0.120.1",
+    "date": "2026-11-14",
+    "new": [],
+    "fixed": [
+      "iPaden a Fájlok listájában a képek újra a teljes posztert mutatják, nem egy elmosódott, felnagyított részletet."
+    ]
+  },
   {
     "version": "0.120.0",
     "date": "2026-11-14",

frontend/src/modules/files/Files.tsx

@@ -465,10 +465,13 @@ export default function Files() {
       // A narrow table (a pinned rail beside it) gives its fixed columns' room to the name: with the
       // picture and the date in, the name had none left.
       narrowHidden: true,
+      // A fixed height, not aspect-video: in a table cell WebKit (every iPad browser) resolves the
+      // picture's h-full against an aspect-ratio height as its own natural height, and the box then
+      // shows a native-size sliver of the poster. 20 × 11.25 is the same 16:9.
       render: (f) => (
         <JobThumb
           job={f}
-          box="w-20 aspect-video shrink-0 rounded-md overflow-hidden bg-surface border border-border"
+          box="w-20 h-11.25 shrink-0 rounded-md overflow-hidden bg-surface border border-border"
         />
       ),
     },