setname.mdx

title	type	shortDescription	tags	metaDescription	redirects	freshnessValidatedDate
setName (SPA API)	apiDoc	Sets the name and trigger of a SPA's browser interaction regardless of the type of interaction.	Browser Browser monitoring Browser agent and SPA API	SPA API call with browser to set the name and trigger of a browser interaction that is not a route change or URL change.	/docs/browser/new-relic-browser/browser-agent-apis/browser-spa-api-newrelicinteractionsetname /docs/browser/new-relic-browser/browser-agent-spa-api/browser-spa-api-newrelicinteractionsetname /docs/browser/new-relic-browser/browser-agent-spa-api/newrelicinteractionsetname-browser-spa-agent-api /docs/browser/new-relic-browser/browser-agent-spa-api/spa-set-name /docs/browser/new-relic-browser/browser-agent-spa-api/setname-browser-spa-api	never

Syntax

newrelic.interaction().setName(string $name[, string $trigger])

Sets the name and trigger of a SPA's browser interaction that is not a route change or URL change.

Requirements

• Browser Pro+SPA agent (v963 or higher)

• If you're using npm to install the browser agent, you must enable the spa feature when instantiating the BrowserAgent class. In the features array, add the following:

  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.

Description

This SPA monitoring method sets the name and trigger of a browser interaction. The name will be exposed as the browserInteractionName attribute in the BrowserInteraction event. It will also be used for grouping in the UI.

By default, browserInteractionName is named after an associated URL or route. Use setName() when you want to record an interaction that is not a route change or URL change.

The setCurrentRouteName() method also names the current route. When you use both:

• setName() takes precedence for naming the interaction.
• The previousRouteName and targetRouteName attributes are still set with values passed to setCurrentRouteName().

Using these methods together allows many options for filtering and grouping in the UI. For example, you can:

• Filter down to interactions of a certain type, such as LikeButtonClick.
• Then, group by targetRouteName to see what routes have the most LikeButtonClick interactions.

This API call applies to data in [SPA page views](/docs/browser/single-page-app-monitoring/get-started/introduction-single-page-app-monitoring) in browser and the [`BrowserInteraction`](/docs/insights/insights-data-sources/default-data/browser-default-events-attributes-insights#browserinteraction-attributes) event type. To set a custom name for standard page views and the **PageView** event type, see [`setPageViewName`](/docs/browser/new-relic-browser/browser-agent-spa-api/set-pageview-name). Using both calls together is recommended.

Parameters

  <th>
    Description
  </th>
</tr>

Parameter

`$name` _string_ </td> <td> Required. If null, the name will be set using the [`targetGroupedUrl` attribute](/docs/insights/explore-data/attributes/browser-default-attributes-insights#target-groupedurl). If not null, this will set the [`browserInteractionName`](/docs/insights/explore-data/attributes/browser-default-attributes-insights#interaction-name) attribute in the `BrowserInteraction` event. </td> </tr> <tr> <td> `$trigger` _string_ </td> <td> Optional. If not null, this will set the [`TRIGGER`](/docs/insights/explore-data/attributes/browser-default-attributes-insights#trigger) attribute on the `BrowserInteraction` event. </td> </tr>

Return values

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

Examples

document.getElementById('subscribe').addEventListener('submit', () => {
  newrelic.interaction().setName('createSubscription');
  createSubscription();
});