1841972 - createImageBitmap doesn't create an image with a svg file

Status: NEW

(Core :: Graphics: Canvas2D, defect)

Description

[Calixte Denizet (:calixte)]

Attachment: plop.html

STR:

• open the attached file
• click on the button and select a svg file

Nothing is drawn and an exception is thrown:
DOMException: An attempt was made to use an object that is not, or is no longer, usable

Comment 1

[Mayank Bansal]

FWIW, Chrome also throws an exception:
[Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'nonce-GdhAIOgbCtF5sswOrLmFNBwaerZ9WyLcjWjssQXmarcMauKQ' 'unsafe-inline' https://www.google-analytics.com". Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.
Uncaught (in promise) DOMException: The source image could not be decoded.

Comment 2

[Robert Longson [:longsonr]]

What SVG image are you using? Does it have height and width attributes on the root element that are not percentages?

Comment 3

[Calixte Denizet (:calixte)]

Attachment: logo-word-hor.96f28a0f9ae6.svg

Here's the image I used, width and height are absolute and set on the root element.

Comment 4

[Robert Longson [:longsonr]]

Current trunk outputs this in the log...

WARNING: 'NS_FAILED(rv)', file <elided>/dom/canvas/ImageBitmap.cpp:1929
WARNING: 'NS_FAILED(rv)', file <elided>/dom/canvas/ImageBitmap.cpp:1972
WARNING: 'NS_FAILED(aStatus)', file <elided>/dom/canvas/ImageBitmap.cpp:2132
JavaScript error: , line 0: InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable

Comment 5

[Timothy Nikkel (:tnikkel)]

Looks like this call is failing

https://searchfox.org/mozilla-central/rev/1cbb3aa1ce39581528eb75b08848fe85dd481f20/dom/canvas/ImageBitmap.cpp#2043

because DecodeImageAsync only supports RasterImages, and further the mimetype being passed is empty, either the code that calls DecodeImageAsync or DecodeImageAsync itself will have to be taught to figure out it's a vector image and get the mime type.

Comment 6

[Robert Longson [:longsonr]]

If you read the https://mimesniff.spec.whatwg.org/#mime-type-sniffing-algorithm though, it's not supposed to sniff SVG, it only sniffs raster images so it does look like we're doing the right thing by the appropriate specifications. Sniffing SVG is quite hard as there's no specific start bytes you can look at (it may start with a doctype, it may not etc).

Chrome doesn't support this either, so I'm inclined to close this bug as invalid.

Comment 7

[Calixte Denizet (:calixte)]

I think we should at least provide a useful and meaningful error message because the current one is, from my pov, a bit cryptic.

Comment 8

[Robert Longson [:longsonr]]

The specification says...

Rejects the promise with an "InvalidStateError" DOMException if the source image is not in a valid state (e.g., an img element that hasn't loaded successfully, an ImageBitmap object whose [[Detached]] internal slot value is true, an ImageData object whose data attribute value's [[ViewedArrayBuffer]] internal slot is detached, or a Blob whose data cannot be interpreted as a bitmap image).

See https://searchfox.org/mozilla-central/source/dom/base/domerr.msg#19

I.e. we're throwing what we're supposed to throw as cryptic as it might be.