AbortController 🛑

Typed AbortController

Table of Contents

• Getting started
• API Reference
  • Type Parameters
  • Methods
  • Examples
• Development
  • Install depenendencies
  • Build the source code
  • ESLint
  • Jest
• Contributing
• Security
• Credits

Getting started

Run the following command to start using abort-controller in your projects:

npm i @alessiofrittoli/abort-controller

or using pnpm

pnpm i @alessiofrittoli/abort-controller

API Reference

The AbortController Class extends the Native Web API AbortController Class, but provides a typed .abort() method and .signal.reason using the AbortError provided by @alessiofrittoli/exception package.

Type Parameters

| Parameter | Default | Description | |-----------|---------|-------------| | TCode | ErrorCode | A custom type assigned to the AbortError.code. Default: ErrorCode. |

Methods

AbortController.abort()

Invoking this method will set this object's AbortSignal's aborted flag and signal to any observers that the associated activity is to be aborted.

| Parameter | Type | Default | Description | |-----------|------|---------|-------------| | reason | string | 'The operation was aborted.' | The abort reason. This will be set to AbortError.message. | | option | AbortErrorOptions<TCode> | - | Custom AbortError options. |

Examples

Listening to abort events

import { AbortController } from '@alessiofrittoli/abort-controller'

const controller  = new AbortController()
const { signal }  = controller

signal.addEventListener( 'abort', event => {
  console.log( 'Aborted at', event.timeStamp )
  console.log( signal.reason ) // `AbortSignal.reason` is now type of `AbortError`
} )

button.addEventListener( 'click', () => {
  controller.abort( 'User aborted the request.' )
} )

Using custom AbortError codes

import { AbortController } from '@alessiofrittoli/abort-controller'

enum CustomAbortErrorCode
{
  REASON_1 = 'ERR:ABORTREASON1',
  REASON_2 = 'ERR:ABORTREASON2',
}

const controller  = new AbortController()
const { signal }  = controller

signal.addEventListener( 'abort', () => {
  switch ( signal.reason.code ) {
    case CustomAbortErrorCode.REASON_1:
      console.log( 'User aborted the request due to button 1 click.' )
      break
    
    case CustomAbortErrorCode.REASON_2:
      console.log( 'User aborted the request due to button 2 click.' )
      break
  
    default:
      console.log( 'User aborted the request due to unknown reason.' )
      break
  }
} )
  
button.addEventListener( 'click', () => {
  controller.abort( 'User clicked button 1.', { code: CustomAbortErrorCode.REASON_1 } )
} )

button2.addEventListener( 'click', () => {
  controller.abort( 'User clicked button 2.', { code: CustomAbortErrorCode.REASON_2 } )
} )

Development

Install depenendencies

npm install

or using pnpm

pnpm i

Build the source code

Run the following command to test and build code for distribution.

pnpm build

ESLint

warnings / errors check.

pnpm lint

Jest

Run all the defined test suites by running the following:

# Run tests and watch file changes.
pnpm test:watch

# Run tests in a CI environment.
pnpm test:ci

• See package.json file scripts for more info.

Run tests with coverage.

An HTTP server is then started to serve coverage files from ./coverage folder.

⚠️ You may see a blank page the first time you run this command. Simply refresh the browser to see the updates.

test:coverage:serve

Contributing

Contributions are truly welcome!

Please refer to the Contributing Doc for more information on how to start contributing to this project.

Help keep this project up to date with GitHub Sponsor.

Security

If you believe you have found a security vulnerability, we encourage you to responsibly disclose this and NOT open a public issue. We will investigate all legitimate reports. Email [email protected] to disclose any security vulnerabilities.

Made with ☕