fix(downloads): a row whose remote picture fails too falls back to its glyph

The remote thumbnail was the last resort with no fallback of its own, so a dead CDN link drew the
browser's broken-image mark. A failed remote URL is remembered like a failed poster, and the row
shows its film / music glyph.
This commit is contained in:
2026-09-27 14:54:28 +02:00
parent 3372626e34
commit 52c15adaf2
2 changed files with 20 additions and 2 deletions
@@ -5,7 +5,7 @@
// render when present and be absent when the asset has no container yet (queued/running before the worker
// fills it). i18n is key-passthrough here.
import { describe, it, expect, afterEach, vi } from "vitest";
import { render, screen, cleanup } from "@testing-library/react";
import { render, screen, cleanup, fireEvent } from "@testing-library/react";
vi.mock("react-i18next", async (importOriginal) => {
const actual = await importOriginal<typeof import("react-i18next")>();
@@ -255,4 +255,16 @@ describe("DownloadRow · no picture", () => {
);
expect(audio.querySelector("svg.lucide-music")).not.toBeNull();
});
// E28 review C5: the remote thumbnail was the last resort with no fallback of its own — when it
// failed too (a dead CDN link), the row drew the browser's broken-image mark.
it("falls back to the glyph when the remote picture fails too", () => {
const { container } = render(
<DownloadRow job={withAsset("mp4", { thumbnail_url: "https://cdn.example/dead.jpg" })} />,
);
const img = container.querySelector("img")!;
expect(img.getAttribute("src")).toBe("https://cdn.example/dead.jpg");
fireEvent.error(img);
expect(container.querySelector("img")).toBeNull();
expect(container.querySelector("svg.lucide-film")).not.toBeNull();
});
});