1241127 - createImageBitmap fails with blobs

Status: RESOLVED DUPLICATE of bug 1420223

(Core :: DOM: Core & HTML, defect)

Description

[github]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.111 Safari/537.36

Steps to reproduce:

I created a small sample to test createImageBitmap. Initially I used a worker with this code:

self.onmessage = function (evt) {

  // Fetch the image.
  fetch(evt.data).then(function(response) {

    // Grab a blob.
    response.blob()

      // Turn it into an ImageBitmap.
      .then(function(blobData) {
        return createImageBitmap(blobData);
      })

      // Post it back to main thread.
      .then(function(imageBitmap) {
        self.postMessage(imageBitmap);
      }, function(err) {
        self.console.log(err);
      });
  });
}



Actual results:

I got an exception:

[Exception... "Component is not available"  nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)"  location: "native frame :: <unknown filename> :: <TOP_LEVEL> :: line 0"  data: no]

Tested in 45.0a2 (Firefox Developer Edition)


Expected results:

I moved the code to main thread and I still ran into an error, and the workaround is to create an Image(), set the src to an Object URL around the blob, and then call createImageBitmap. So in both cases using a blob (which I believe should work: https://html.spec.whatwg.org/multipage/webappapis.html#dom-createimagebitmap) fails, but there's no Image in a worker context so the workaround is impossible there.

Comment 1

[Loic]

Any self-working testcase that I can run directly in Firefox?

Comment 2

[github]

Absolutely. I pushed the code to https://dl.dropboxusercontent.com/u/2272348/codez/createImageBitmap/index.html, though it only shows the exception when I run the code on localhost. Is that a security / privacy thing, perhaps? In any case, the same code works in Chrome Canary (with --experimental-canvas-features enabled), and so far as I know it's all spec-compliant.

Comment 3

[github]

A bit more info. Now I can't get it to repro with the error :-/ But I have noticed that if it's set to be a transferable it doesn't work (worker -> main copy seems to work, though):

self.postMessage(imageBitmap, [imageBitmap]); // Doesn't work

self.postMessage(imageBitmap); // Does work

Comment 4

[Loic]

I tried with Nightly on Win 7, it seems to work normally: http://i.imgur.com/ClBmIox.jpg

Comment 5

[Olli Pettay [:smaug][[e-mail]]]

kaku, could you check if there is something going wrong here?

Comment 6

[Olli Pettay [:smaug][[e-mail]]]

(In reply to github from comment #2)
> Absolutely. I pushed the code to
> https://dl.dropboxusercontent.com/u/2272348/codez/createImageBitmap/index.
> html
In general would be great if minimal testcases could be loaded to bugzilla using
'Add an attachment'. That way having a testcase doesn't depend on external service to stay around.

> In any case, the same code
> works in Chrome Canary (with --experimental-canvas-features enabled), and so
> far as I know it's all spec-compliant.
( It has issues in Workers )

Comment 7

[github]

(In reply to Olli Pettay [:smaug] (expect slower than usual review time for couple of days) from comment #6)
> (In reply to github from comment #2)
> > Absolutely. I pushed the code to
> > https://dl.dropboxusercontent.com/u/2272348/codez/createImageBitmap/index.
> > html
> In general would be great if minimal testcases could be loaded to bugzilla
> using
> 'Add an attachment'. That way having a testcase doesn't depend on external
> service to stay around.

My bad, I'm not used to Bugzilla etiquette! Would you like me to upload a zip?

> 
> > In any case, the same code
> > works in Chrome Canary (with --experimental-canvas-features enabled), and so
> > far as I know it's all spec-compliant.
> ( It has issues in Workers )

Does it? I'll happily file them! :) Funnily enough, Canary seems to fail on this code when you _don't_ transfer the ImageBitmap, Firefox Dev Edition fails if you _do_.

Comment 8

[Tzuhao Kuo [:kaku]]

(In reply to Olli Pettay [:smaug] (expect slower than usual review time for couple of days) from comment #5)
> kaku, could you check if there is something going wrong here?
Sure and I am in a sense that I might have faced the same issue while I was debugging the bug 1239752 with blobs.

Comment 9

[Tzuhao Kuo [:kaku]]

(In reply to github from comment #7)
> My bad, I'm not used to Bugzilla etiquette! Would you like me to upload a zip?
Yes, please! Also, it would be much better if the test case is simplified. Thanks.

Comment 10

[Tzuhao Kuo [:kaku]]

Quick update, I cannot reproduce this bug in the nightly (on Mac) also.

Comment 11

[c3249011]

I have this issue too. This page fails to create an "ImageBitmap" object with all files I tried (https://my.mixtape.moe/tjkuba.htm):

<!doctype HTML>

<meta charset = "UTF-8" />

<title>Test</title>

<input id = "file" type = "file" />

<script>
	document.querySelector("#file").addEventListener("change", function (event) {
		createImageBitmap(this.files[0]).then(function (result) {
			alert("OK");
		}, function (reason) {
			alert("Fail");
		});
	});
</script>

This code works with the same images in Chromium, but Firefox 49.0 on Linux Mint and Firefox 49.0.1 on Archlinux reject the promise.

At the same time, I can load an image with this code in the web console on the "about:blank" page:

let fileNode = document.body.appendChild(document.createElement("input"));
fileNode.type = "file";
fileNode.addEventListener("change", function (event) {
	createImageBitmap(this.files[0]).then(function (result) {
		alert("OK");
	}, function (reason) {
		alert("Fail");
	});
});