javascript - Inconsistent ArrayBuffer prototype in content script in Firefox extension

Question

In a Firefox browser extension I am writing, I wish to make a request from a content script in the context of a page (same cookies and authorizations, no CORS issues…). This section of the MDN mentions that I can use content.fetch and content.XMLHttpRequest to do that, though I can find no documentation on those or on content itself. When getting an ArrayBuffer from the response of content.fetch, I obtain a value which looks and acts like an ArrayBuffer but is not instanceof ArrayBuffer.

My assumption is that I am somehow dealing with an ArrayBuffer from the page context in the context of my content script, and that this value would have a different ArrayBuffer constructor. Is this something I can fix by messing with wrappedJSObject or something else? Or am I dealing with a browser bug?

More concretely, the following code behaves unexpectedly. The issue occurs even when this is the only code in the content script.

(async function () {
  const response = await content.fetch("./");
  console.log("response type", response instanceof Response);
  const blob = await response.blob();
  console.log("blob type", blob instanceof Blob);
  const arrayBuffer = await blob.arrayBuffer();
  console.log("array buffer", arrayBuffer);
  console.log("array buffer type", arrayBuffer instanceof ArrayBuffer);
})();

I expect this code to print this. (Last word is true.)

response type true
blob type true
array buffer ArrayBuffer { byteLength: … }
array buffer type true

In practice I get this. (Last word is false.)

response type true
blob type true
array buffer ArrayBuffer { byteLength: … }
array buffer type false

question from:https://stackoverflow.com/questions/65907553/inconsistent-arraybuffer-prototype-in-content-script-in-firefox-extension

Answer 1

Waitting for answers