Application error monitoring

In this article, we'll learn how to monitor the error rate in our production Angular applications.

Prerequisites

• Install and Configure Polaris

Implement Angular ErrorHandler

We will use Angular's ErrorHandler to catch and log errors in our application. We will create a new class that implements the ErrorHandler interface and use it to log errors to Polaris.

  class PolarisErrorHandler implements ErrorHandler {

    constructor(private readonly polaris: PolarisService) {}

    handleError(error: any): void {
      this.polaris.logMeasurement(
        'app-error',
        MeasurementResult.FAILURE,
        0,
        { error }
      );
    }
  }

Let's review the code above:

• We create a new class PolarisErrorHandler that implements the ErrorHandler interface.
• We inject the PolarisService into the constructor.
• We implement the handleError method and invoke the logMeasurement method on the PolarisService.
• We pass the app-error measurement name, FAILURE result, and the error object to the logMeasurement method.
• Note that we pass 0 as the duration since we don't have a duration for the error.

Register the PolarisErrorHandler

We need to register the PolarisErrorHandler as the global error handler in our application.

  import { providePolaris } from '@getpolaris.ai/sdk-angular';

  bootstrapApplication(AppComponent, {
    providers: [
      providePolaris({
        apiKey: API_KEY,
      }),
      {
        provide: ErrorHandler,
        useClass: PolarisErrorHandler,
        deps: [PolarisService],
      },
    ],
  });

Let's review the code above:

• We import the providePolaris function from the @getpolaris.ai/sdk-angular package.
• We call the providePolaris function and pass the `apiKey
• We register the PolarisErrorHandler as the global error handler by providing it in the bootstrapApplication providers array.

If you are using modules in Angular, we'll configure PolarisErrorHandler in the AppModule:

  import { PolarisModule } from '@getpolaris.ai/sdk-angular';

  @NgModule({
    imports: [
      PolarisModule.forRoot({
        apiKey: API_KEY,
      }),
    ],
    providers: [
      {
        provide: ErrorHandler,
        useClass: PolarisErrorHandler,
        deps: [PolarisService],
      },
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent],
  })
  export class AppModule {}

Let's review the code above:

• We import the PolarisModule from the @getpolaris.ai/sdk-angular package.
• We configure the PolarisModule with the forRoot method and pass the `apiKey
• We register the PolarisErrorHandler as the global error handler by providing it in the AppModule providers array.

Create Indicators

Next, we'll create an indicator to measure the error rate of the API.

1. Create a new indicator in Polaris.
2. Provide an indicator name. In this example, we'll use App Error Rate.
3. Select the desired window of time for the indicator.
4. Provide the following predicate function that will filter the measurements based on the interceptor's configured event name.

  function filter(measurement) {
    return measurement.eventName === 'app-error'
      && measurement.result === 'FAILURE';
  }

We recommend creating multiple indicators with different time windows to monitor the error rate at different levels of granularity.

Create Objectives

Finally, we'll create objectives to monitor the error rate of the application.

Let's create an acceptable error rate objective.

1. Create a new objective in Polaris.
2. Provide an objective name. In this example, we'll use App Errors / Acceptable.
3. Select the App Error Rate indicator we created earlier.
4. Set the desired target for the objective. In this example, we'll use a Lower Threshold with the value 0.01. This threshold establishes an error budget of 1%.
5. Select the desired percentile for the objective. In this example, we'll use the 95th percentile.

Now, let's create an aspiration error rate objective.

1. Create a new objective in Polaris.
2. Provide an objective name. In this example, we'll use App Errors / Aspiration.
3. Select the App Error Rate indicator we created earlier.
4. Set the desired target for the objective. In this example, we'll use a Lower Threshold with the value 0.005. This threshold establishes an error budget of 0.5%.
5. Select the desired percentile for the objective. In this example, we'll use the 95th percentile.

Next Steps

• Configure application webhooks