-
Notifications
You must be signed in to change notification settings - Fork 440
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Mirage-overridden fetch cannot download an image binary blob #1915
Comments
You know I think these issues might be related...
Haven't had time to dig yet but it's possible they all have the same root cause. Would be great to get to the bottom of it. |
I tried to debug this problem a little bit because we are facing the following issue: miragejs/miragejs#339 I think our issue involves even more "problems" but for the binary data problem I found out, that when I do the following in the fetch implementation of https://github.com/pretenderjs/pretender everything works fine 🙂 // inside fetch(input, init)
if (xhr.url.indexOf('.wasm') !== -1) {
xhr.responseType = 'arraybuffer';
} The main problem I face is, that I do not know how to set the correct |
@skarger I found a workaround that works for us 🙂we use MirageJS without Ember-CLI but maybe it helps you to find a workaround for you as well. The details are here: miragejs/miragejs#339 (comment) |
I think this is related to this bug in |
Mirage has a bug when using the
fetch
API to download an imageBlob
.Here is a repo that reproduces the problem: https://github.com/skarger/mirage-blob-fetch.
It's a simple Ember app that can be run with
yarn start
.The Mirage-overridden
fetch
function seems to return a text version of the image's bytes, instead of the desiredBlob
. Same problem if trying to access the image as anArrayBuffer
.The fetched data is corrupt, and also larger. I believe it's larger because the text representation of the image's bytes is UTF-8 encoded, and therefore each of its "characters" may expand in width from 1 byte to up to 4 bytes.
There are a few players in the mix:
Mirage
Pretender
, which Mirage uses to mock thefetch
function.whatwg-fetch
, a polyfill forwindow.fetch
, which Pretender uses tooverwrite the browser's native
fetch
function.I believe the bug only happens when using Mirage.
I've confirmed it does not happen when only using
whatwg-fetch
.The example app's index route provides a demo that reproduces the problem.
Clicking the buttons will show the returned blob type and byte sizes when using
the native
fetch
function and when using the Mirage-overriddenfetch
.You can see they are different. Clicking these buttons prompts console logging as well.
Demo app screenshot:
![mirage-blob-fetch](https://user-images.githubusercontent.com/1040764/77693005-06de0f00-6f7e-11ea-830c-ca18501356f0.png)
In order to make this demo, I used an Ember application initializer to capture
the native
fetch
function aswindow.nativeFetch
. Otherwise I would have no way to accessnative
fetch
because Mirage / Pretender overrides it.The text was updated successfully, but these errors were encountered: