Subscriber: error() method

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The error() method of the Subscriber interface closes the subscription and notifies observers of an error.

Syntax

js
error(error)

Parameters

error

A value representing the error. This can be any JavaScript value, but is typically an Error object.

Return value

None (undefined).

Description

Calling this method sets active to false, aborts signal, and runs the registered teardown callbacks. It then synchronously invokes each observer's error callback, as supplied in the observer object passed to Observable.subscribe(), passing the error value. The observers' complete callbacks are not invoked.

Note: This shared-subscription behavior may change. A proposal to give each observer its own Subscriber would make each subscription start a separate execution instead of reusing an active subscription.

If an observer has no error callback, the error is reported to the global object. Calling error() on an already inactive subscriber also reports the error to the global object. Calling this method does not throw the error back to the caller or stop execution of the producer's code.

Examples

An observable value checker

This example uses a custom observable to check that each string in an array is nonempty and contains only ASCII digits (0–9).

We first define a custom observable using the Observable() constructor. This defines a regular expression that matches a string containing only ASCII digits, then uses a for...of loop to process each value in a values array. Each value is tested against the regex:

  • If the value is nonempty and contains only ASCII digits, it is passed into a Subscriber.next() call.
  • If the value is empty or contains non-digit characters, it is inserted into an error message and passed into an error() call. We then return from the producer callback to stop processing further values.

Finally, after all the values are processed, Subscriber.complete() is called to complete the stream of values.

js
const observable = new Observable((subscriber) => {
  const regex = /^\d+$/;
  for (const value of values) {
    if (!subscriber.active) {
      return;
    }
    if (regex.test(value)) {
      subscriber.next(value);
    } else {
      subscriber.error(`Error: "${value}" must contain ASCII digits only`);
      return;
    }
  }

  subscriber.complete();
});

Next, we define a values array that the producer callback reads when the observable is subscribed to. In this case, we define an array containing only strings of ASCII digits, which will all pass the regex test:

js
const values = ["1234", "354567", "87654", "007", "98765", "999"];

Finally, we subscribe to the observable using an Observable.subscribe() call. Inside, we define next(), error(), and complete() callbacks, which log a value to the console as appropriate:

js
observable.subscribe({
  next(value) {
    console.log(value);
  },
  error(error) {
    console.log(error);
  },
  complete() {
    console.log("Checking complete. No errors found.");
  },
});

When the above code is run, all the values pass the regex test, so they are all logged to the console as per the next() callback. When all values have been tested, the observer's complete() callback runs, which logs "Checking complete. No errors found." to the console.

Success case result

The final console output will look something like this:

1234
354567
87654
007
98765
999
Checking complete. No errors found.

An error case

So what happens when one of the strings passed into the array contains non-digit characters? In such a case, subscriber.error() closes the subscription and invokes the observer's error() callback. The subsequent return stops the loop, so the other values are never processed and subscriber.complete() is never called. The active check also stops processing if the observer unsubscribes while handling a value.

For example, if the values array is defined as follows:

js
const values = ["1234", "354567", "87654", "gg567", "007", "98765"];

The final console output will look something like this:

1234
354567
87654
Error: "gg567" must contain ASCII digits only

Specifications

Specification
Observable
# dom-subscriber-error

Browser compatibility

See also