---
title: onEnd (SPA API)
source: https://docs.newrelic.com/docs/browser/new-relic-browser/browser-apis/onend
---

## Syntax

```js
newrelic.interaction().onEnd(function $callback)
```

Change the values associated with a SPA interaction before the interaction is saved.

## Requirements

-   Browser Pro+SPA agent (v963 or higher)
-   If you're installing the browser agent via npm and building a custom agent with selected features, you must enable the `spa` feature when creating the `Agent` instance. In the `features` array, add the following:

    ```js
    import { Spa } from '@newrelic/browser-agent/features/spa';

    const options = {
      info: { ... },
      loader_config: { ... },
      init: { ... },
      features: [
        Spa
      ]
    }
    ```

    For more information, see the [npm browser installation documentation](https://www.npmjs.com/package/@newrelic/browser-agent#new-relic-browser-agent).

## Description

This call provides the same object as [`getContext()`](https://docs.newrelic.com/docs/browser/new-relic-browser/browser-agent-apis/browser-spa-api-newrelicinteractiongetcontext). When this is called, you can make final adjustments to the interaction before it's recorded. For example, you could add additional [attributes](https://docs.newrelic.com/docs/using-new-relic/welcome-new-relic/getting-started/glossary#attribute) based on the context values.

Other methods for modifying the interaction include:

-   [`setName()`](https://docs.newrelic.com/docs/browser/new-relic-browser/browser-agent-apis/browser-spa-api-newrelicinteractionsetname)
-   [`save()`](https://docs.newrelic.com/docs/browser/new-relic-browser/browser-agent-apis/browser-spa-api-newrelicinteractionsave)
-   [`ignore()`](https://docs.newrelic.com/docs/browser/new-relic-browser/browser-agent-apis/browser-spa-api-newrelicinteractionignore)
-   [`setAttribute()`](https://docs.newrelic.com/docs/browser/new-relic-browser/browser-agent-apis/browser-spa-api-newrelicinteractionsetattribute)

## Parameters

| Parameter              | Description                                                                                                                     |
| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------- |
| `$callback` _function_ | Required. This function is called when the interaction ends. It is called with one parameter, which is the interaction context. |

## Return values

This method returns the same API object created by `interaction()`.

## Examples

```js
// router.js
router.addRoute('/dashboard', () => {
  const interaction = newrelic.interaction().onEnd(ctx => {
    interaction.setAttribute(
      'averageChartLoadTime',
      ctx.totalChartLoadTime / ctx.chartLoadCount
    );
  });
  getCharts().forEach(loadChart);
});

// chart-loader.js
function loadChart(chart) {
  const start = Date.now();
  chart.load().then(() => {
    const loadTime = Date.now() - start;
    interaction.getContext(ctx => {
      ctx.totalChartLoadTime = (ctx.totalChartLoadTime || 0) + loadTime;
      ctx.chartLoadCount += (ctx.chartLoadCount || 0) + 1;
    });
  })
}
```