New AbortController() returning empty object

Viewed 436

I'm currently developing a react native application and I intend to use AbortController to cancel requests when necessary. The way I'm doing this is basically the simplest example available in the MDN docs, which is basically this:

const controller = new window.AbortController()
const signal = controller.signal

fetch(url, {signal})

However, for some reason, the creation of the controller object is not working properly, and if I console.log that object, I can see that it's being created as an empty object ({}).

But it gets weirder. If I use the Debug tool in react native dev tools, the controller object gets created as expected.

Any idea what might be the issue here?

1 Answers

AbortController is part of the DOM spec, and not the ECMAScript Spec. This makes it a browser feature, not a JavaScript language feature. As a result, AbortController isn't something available by default with the JavaScript runtime that runs on a device.

When using the Debug tool, all JavaScript code runs within Chrome itself, communicating with native code via WebSockets. Chrome uses V8 as its JavaScript engine, which is a browser-based engine, and so has access to all of the DOM APIs - including AbortController. This is why you will see it working in Debug mode, as your JS code is being interpreted by V8, rather than the runtime on your device (likely JavaScriptCore, if you haven't enabled Hermes).

tl;dr - AbortController isn't part of the JS runtime on the device, so it won't work.

Related