Merge pull request #21021 from Snuffleupagus/PDFThumbnailView-unconditional-OffscreenCanvas

Use `OffscreenCanvas` unconditionally in the `web/pdf_thumbnail_view.js` file
This commit is contained in:
Tim van der Meij 2026-04-03 17:57:04 +02:00 committed by GitHub
commit cc5e30b99c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -21,11 +21,7 @@
// eslint-disable-next-line max-len // eslint-disable-next-line max-len
/** @typedef {import("./pdf_rendering_queue").PDFRenderingQueue} PDFRenderingQueue */ /** @typedef {import("./pdf_rendering_queue").PDFRenderingQueue} PDFRenderingQueue */
import { import { OutputScale, RenderingCancelledException } from "pdfjs-lib";
FeatureTest,
OutputScale,
RenderingCancelledException,
} from "pdfjs-lib";
import { RenderableView, RenderingStates } from "./renderable_view.js"; import { RenderableView, RenderingStates } from "./renderable_view.js";
import { AppOptions } from "./app_options.js"; import { AppOptions } from "./app_options.js";
@ -55,26 +51,16 @@ const THUMBNAIL_WIDTH = 126; // px
* mode. * mode.
*/ */
class TempImageFactory { function getTempCanvas(width, height) {
static getCanvas(width, height) { const canvas = new OffscreenCanvas(width, height);
let tempCanvas;
if (FeatureTest.isOffscreenCanvasSupported) {
tempCanvas = new OffscreenCanvas(width, height);
} else {
tempCanvas = document.createElement("canvas");
tempCanvas.width = width;
tempCanvas.height = height;
}
// Since this is a temporary canvas, we need to fill it with a white // Since this is a temporary canvas, we need to fill it with a white
// background ourselves. `#getPageDrawContext` uses CSS rules for this. // background ourselves. `#getPageDrawContext` uses CSS rules for this.
const ctx = tempCanvas.getContext("2d", { alpha: false }); const ctx = canvas.getContext("2d", { alpha: false });
ctx.save(); ctx.save();
ctx.fillStyle = "rgb(255, 255, 255)"; ctx.fillStyle = "rgb(255, 255, 255)";
ctx.fillRect(0, 0, width, height); ctx.fillRect(0, 0, width, height);
ctx.restore(); ctx.restore();
return [tempCanvas, ctx]; return [canvas, ctx];
}
} }
class PDFThumbnailView extends RenderableView { class PDFThumbnailView extends RenderableView {
@ -364,10 +350,6 @@ class PDFThumbnailView extends RenderableView {
image.setAttribute("data-l10n-id", "pdfjs-thumb-page-canvas"); image.setAttribute("data-l10n-id", "pdfjs-thumb-page-canvas");
image.setAttribute("data-l10n-args", this.#getPageL10nArgs()); image.setAttribute("data-l10n-args", this.#getPageL10nArgs());
imageContainer.classList.remove("missingThumbnailImage"); imageContainer.classList.remove("missingThumbnailImage");
if (!FeatureTest.isOffscreenCanvasSupported) {
// Clean up the canvas element since it is no longer needed.
reducedCanvas.width = reducedCanvas.height = 0;
}
} }
async draw() { async draw() {
@ -506,7 +488,7 @@ class PDFThumbnailView extends RenderableView {
} }
// drawImage does an awful job of rescaling the image, doing it gradually. // drawImage does an awful job of rescaling the image, doing it gradually.
let [reducedWidth, reducedHeight] = this.#getReducedImageDims(canvas); let [reducedWidth, reducedHeight] = this.#getReducedImageDims(canvas);
const [reducedImage, reducedImageCtx] = TempImageFactory.getCanvas( const [reducedImage, reducedImageCtx] = getTempCanvas(
reducedWidth, reducedWidth,
reducedHeight reducedHeight
); );