Skip to content

feat: add docs about debugging the browser agent #20938

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: develop
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
---
title: How to debug the New Relic Browser Agent
type: troubleshooting
tags:
- Browser
- Browser monitoring
- Troubleshooting
metaDescription: Learn how to debug the New Relic Browser Agent live in your browser.
freshnessValidatedDate: never
---

## Problem

You need to debug an issue with the New Relic Browser Agent and want to to better understand live agent behaviors and data collection.

## Solution

If your application is instrumented with [<InlinePopover type="browser"/>](/docs/browser/new-relic-browser/installation-configuration/troubleshooting-browser-monitoring-installation) and you want to inspect agent activity, follow these steps:

<Steps>

<Step>

## Enable debug logging [#enable-debug-logging]

To get more insight into the agent's activity, [enable debug logging](/docs/browser/browser-monitoring/browser-pro-features/browser-logs/get-started/).

The browser agent emits warning codes using `console.debug`, and this setting will capture those logs to your New Relic browser application, helping you track agent activity and problems.

## Inspect agent logs [#inspect-agent-logs]

To inspect locally, open your browser's developer console and look for `debug` messages prefixed with `New Relic Warning:`. These messages indicate agent issues, tied to known [warning codes](https://github.com/newrelic/newrelic-browser-agent/blob/main/docs/warning-codes.md).

To inspect agent logs across all instances of your web application, [check your logs](/docs/browser/browser-monitoring/browser-pro-features/browser-logs/view-browser-logs/logs-of-a-browser-app/) on [one.newrelic.com](https://one.newrelic.com).

These logs can help you identify known issues with the browser agent and its configuration within your pages.

</Step>

<Step>

## Monitor network requests [#monitor-network-requests]

Use the Network tab in your browser's developer tools to monitor requests sent by the agent. Look for calls to domains like `bam.nr-data.net` or `js-agent.newrelic.com`.

If you see failed requests or errors, check for network issues, ad blockers, or CSP rules that might be interfering with agent communication.

Expected endpoints under `js-agent.newrelic.com`:
- PageView: `/`
- AjaxRequest, BrowserInteraction, PageViewTiming: `/events`
- PageAction, BrowserPerformance, UserAction, Custom Events: `/ins`
- Log: `/browser/logs`
- JavaScriptError, Ajax Timeslice Metrics: `/jserrors/`
- SessionReplay, SessionTrace: `browser/blobs`

</Step>

<Step>

## Use inspection events for troubleshooting [#use-inspection-events]

The agent emits inspection events that can be captured for deeper troubleshooting. To listen for these events, you can add a listener in your console:

```js
document.addEventListener('newrelic', function(e) {
console.log('NR Inspection Event:', e.detail);
});
```

This will log inspection events emitted by the agent, providing details about feature status, errors, lifecycles, harvesting and configuration.

**Note:** Inspection events are available in agent versions 1.285.0 and higher. Inspection events are emitted immediately upon creation in the agent, any events emitted by the agent before the above event listener is created on the end-user machine will be missed.

</Step>

</Steps>

<Callout variant="tip">
If you need further assistance with debugging or interpreting inspection events, or debugging problems with your web application and New Relic, visit [support.newrelic.com](https://support.newrelic.com) for help.
</Callout>
2 changes: 2 additions & 0 deletions src/nav/browser.yml
Original file line number Diff line number Diff line change
Expand Up @@ -235,6 +235,8 @@ pages:
path: /docs/browser/single-page-app-monitoring/troubleshooting/angular-truncated-copy-paste-snippet
- title: Data doesn't match other tools
path: /docs/browser/new-relic-browser/troubleshooting/browser-data-doesnt-match-other-analytics-tools
- title: Debugging the browser agent
path: /docs/browser/new-relic-browser/troubleshooting/how-to-debug-browser-agent
- title: Google Indexing 404 Paths
path: /docs/browser/new-relic-browser/troubleshooting/google-indexing-unknown-paths
- title: GraphQL metadata is not found on AjaxRequests
Expand Down