Closed Bug 1779227 Opened 1 year ago Closed 1 year ago

Canvas2d font API doesn't work on a disconnected element


(Core :: Graphics: Canvas2D, defect)




104 Branch
Tracking Status
firefox104 --- fixed


(Reporter: jfkthame, Assigned: jfkthame)


(Regressed 1 open bug, )



(2 files)

CanvasRenderingContext2D::SetFontInternal returns an error if the canvas does not currently have a PresShell (e.g. because a canvas element has been created via script, and not [yet] added to the document). It should be possible to perform drawing operations on such a "disconnected" canvas, and in general this works, but trying to set the .font attribute throws an error.

See for an example; it should show two copies of the same content, one drawn directly on an in-document <canvas> element, the other drawn on a disconnected canvas and then copied as a blob image.

The example works in Safari; in Chrome, it doesn't throw an error but the text fails to render in the second canvas. In Firefox, we throw an error on the font setter, so the second image doesn't appear at all.

Setting .font on a disconnected canvas element that has no PresShell/PresContext is similar to setting it on an offscreenCanvas, where these objects are not present. So I think we can handle this by pulling the version of SetFontInternal from OffscreenCanvasRenderingContext2D back into the base CanvasRenderingContext2D class, and adapting it slightly; instead of using this version only for offscreen-canvas, we'll use it any time there's no PresShell (instead of throwing an error, as CanvasRenderingContext2D::SetFontInternal currently does).

With this change, the jsfiddle example renders as expected.

Assignee: nobody → jfkthame

Here's a simple reftest that fails before the patch here is landed. (The testcase completely fails to render.) It's somewhat fuzzy because we get different antialiasing (at least on Windows) between the blob-image rendering and the canvas that is directly in the document, but the differences are only in the gray levels of the edge pixels; the actual text is still correct.

Pushed by
Enable the font attribute to be set on a disconnected <canvas> element without throwing an error. r=aosmond
Add a WPT reftest. r=aosmond
Created web-platform-tests PR for changes under testing/web-platform/tests
Regressions: 1779336
Closed: 1 year ago
Resolution: --- → FIXED
Target Milestone: --- → 104 Branch
Upstream PR merged by moz-wptsync-bot
Regressions: 1840363
You need to log in before you can comment on or make changes to this bug.