TS: Absence of AbortController in TypeScript

I encountered an issue while attempting to utilize AbortController in TypeScript.

Here is the code snippet I used:

const controller = new AbortController();

The TypeScript compiler reported the following error:

src/testAbort.ts:1:24 - error TS2304: Cannot find name 'AbortController'.

1 const controller = new AbortController();
                         ~~~~~~~~~~~~~~~

Although TypeScript provides documentation about AbortController, there was also an issue on Github that has since been resolved with a pull request containing the necessary type definitions for AbortController.

In my tsconfig.json file, I have specified:

{
  "compilerOptions": {
    "target": "ES2018",
    "lib": ["ES2018"],
    "allowSyntheticDefaultImports": true,
    "moduleResolution": "node",
    "baseUrl": "src"
  },
  "exclude": ["node_modules"],
  "include": ["src/**/*", "__tests__/**/*", "index.ts"],
  "typeRoots": ["./node_modules"]
}

Approaches I have taken to resolve this:

  • Upgraded TypeScript to version 3.7.5
  • Set both lib and target options in tsconfig to "ESNext".
  • Tried accessing it through global.AbortController.

Answer №1

The reason for the issue is that the value DOM is not included in the lib array of your tsconfig.json file. You can verify this information by visiting the AbortController section on the official TypeScript repository here!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The disappearance of ngx-charts lines is observed when the chart is rendered within a PrimeNG dialog that gets closed and reopened

In my TypeScript Angular application, I am currently incorporating PrimeNG. Specifically, I am utilizing the dialog component from PrimeNG to display charts using ngx-charts, specifically the ngx-charts-line-chart module. Initially, when I open the dialo ...

Utilizing state as a prop in React router v6 with the power of TypeScript

Excuse my lack of knowledge, as I am still getting the hang of React router v6 and Typescript. I'm attempting to pass both a state and a function that can update the state through the data flow of my application. const [playerSystem, setPlayerSystem] ...

Is it possible to enforce a certain set of parameters without including mandatory alias names?

My inquiry pertains to handling required parameters when an alias is satisfied, which may seem complex initially. To illustrate this concept, let's consider a practical scenario. If we refer to the Bing Maps API - REST documentation for "Common Param ...

Ensuring consistency between TypeScript .d.ts and .js files

When working with these definitions: https://github.com/borisyankov/DefinitelyTyped If I am using angularJS 1.3.14, how can I be certain that there is a correct definition for that specific version of Angular? How can I ensure that the DefinitelyTyped *. ...

Change (EU Time) date format of dd/mm/yyyy hh:mm:ss to a timestamp

Is there a way to convert time into a timestamp? I attempted to use .getTime(), but it seems to be switching the day and month. const date = new Date('01-02-2003 01:02:03'); console.log(date.getTime()); It appears to be converting to the US Tim ...

The reason for my inability to include a fresh method in String.prototype using typescript

I attempted to extend the String.prototype with a new method, but I encountered an issue. interface String { newMethod(): void } String.prototype.newMethod = function() {} Although there were no errors in the typescriptlang.org playground, I received ...

What is the process for creating a coverage report for a TypeScript extension in vscode?

It appears that generating coverage reports with coveralls is not feasible for a VSCode extension built with TypeScript. Currently, I am incorporating test cases into our project https://github.com/PicGo/vs-picgo/pull/42. Despite exploring various methods ...

Failure of React to connect event handlers

LATEST UPDATE: After removing the output entry from my webpack configuration, the React event listeners are now functioning correctly. Currently, I am diving into the world of hand-rolling webpack configurations for a React/TypeScript application for the ...

What could be causing the lack of updates to my component in this todo list?

Based on my understanding, invoking an action in MobX should trigger a rerender for the observer. However, when I call the handleSubmit method in my AddTask component, it doesn't cause the TaskList observer to rerender. Should I also wrap AddTask in a ...

Tips for organizing an NPM package containing essential tools

Currently facing the challenge of creating an NPM package to streamline common functionality across multiple frontend projects in our organization. However, I am uncertain about the correct approach. Our projects are built using Typescript, and it seems th ...

Exploring the inner workings of Angular v4.4 and gaining insight into the roles of platformBrowserDynamic and PlatformRef

Recently, I have come into possession of an Angular 4.4 application that utilizes Webpack v3.5 and TypeScript v2.3.3. Struggling to decipher the imported code, I am at a loss understanding its functionality and correctness. To simplify matters for analysis ...

Parameters for constructing classes in TypeScript

I've been exploring different coding styles in TypeScript recently. When it comes to initializing an object from a class, what are the advantages and disadvantages of these two code styles in TypeScript? class Class3 { // members private rea ...

What is the best way to define types for a module that relies on path-based imports?

Currently, I am utilizing an NPM package that necessitates the importation of React components with this specific format: import Component from 'module-name/lib/components/Component'; import AnotherComponent from 'module-name/lib/components ...

Component in Angular2 encountering a null value

Unexpected situations may arise where "this" becomes null within a component. So far, I have encountered it in two scenarios: 1) When the promise is rejected: if (this.valForm.valid) { this.userService.login(value).then(result => { ...

What is the best way to execute a sequence of http requests only after the previous one has been completed successfully, while also addressing any

Working with Angular/rxjs 6 has brought me to a challenge. I'm struggling to get an observable sequence to run smoothly as intended. Here's the concept of what I'm trying to achieve: Request received to change systems: Check permissions Fe ...

The type 'undefined' cannot be assigned to the type 'string | Buffer | { key: string | Buffer; passphrase: string; } | GetPublicKeyOrSecret'

Verification Code for JWT This function is used to verify a jwt using typescript. public verify( token: string, secretOrPublicKey?: string | Buffer, options?: jwt.VerifyOptions ): Promise<object | string> { if (!secretOrPublicKey) { ...

Using TypeScript with generic parameters allows for flexibility while still being able to verify if a specific property is present

I am in the process of gradually converting a large SvelteKit application to TypeScript, focusing on refining the API layer. Currently, I am grappling with a function that has two generics: // Function that either performs a POST or a PUT export function s ...

connect validation of the form to a separate component from the current one

Currently, I am working on creating a searchable-dropdown component that I intend to use in multiple components. However, I am facing an issue with binding form validation to this component. For instance, I have a form for creating a user and I need to bi ...

`Is there a way to effectively test an @Input component in Angular?`

Despite multiple successful attempts in the past, I am facing some difficulty getting this to function properly. Within my component, I have an input @Input data: Data, which is used in my template to conditionally display certain content. Oddly enough, du ...

No errors encountered during compilation for undefined interface object types

Hey there, I'm currently exploring the Vue composition API along with Typescript. I'm facing an issue where I am not receiving any errors when an interface does not align with the specified types for that interface. Although my IDE provides aut ...