Your data. Anywhere you go.

New Relic for iOS or Android


Download on the App Store    Android App on Google play


New Relic Insights App for iOS


Download on the App Store


Learn more

Close icon

Relic Solution: Insights Dashboard for Browser: Part 2 - JS Errors

browser
insights
levelup
js-errors

#1

Introduction

With the launch of Beta JS Errors, you can now use JavaScriptError event attributes to run NRQL queries and create dashboards to view or share.

With this Level Up post, I will provide quick and easy steps on generating an Insights Dashboard on JS Errors. This dashboard will have a FACET widget where you can link the items in that widget to a pre-filtered dashboard of information relevant to just that facet, or filter the results of your existing dashboard.

Prerequisites

Dashboard Details

Required Products: APM
Level of Effort: Low
This dashboard will work on the standard New Relic data models and does not require any custom attributes or events.

Settings
Use the gear button to edit your dashboard and configure the following settings:

  • Dashboard Filter: Enabled
  • Enabled Event Types: NrAuditEvent
  • Enabled Attributes: all

Queries

In this section, we’ll go into the details on the purpose of each of the charts. We’ll also show you the query (NRQL) that you can cut/paste into your Insights query bar.

JS Errors by Error Class

SELECT count(*) from JavaScriptError FACET errorClass

JS Errors compared with past JS error trends

SELECT count(*) from JavaScriptError TIMESERIES AUTO compare with 1 week ago

JS Errors by App Name

SELECT count(*) from JavaScriptError FACET appName

JS Errors by Error Message

SELECT count(*) from JavaScriptError FACET errorMessage

JS Errors by Release ID’s

SELECT count(*) FROM JavaScriptError FACET releaseIds

JS Errors by Browser

SELECT count(*) FROM JavaScriptError FACET userAgentName

JS Errors by OS

SELECT count(*) FROM JavaScriptError FACET userAgentOS

JS Errors by Device Type

SELECT count(*) FROM JavaScriptError FACET deviceType

JS Errors by Request URI

SELECT count(*) FROM JavaScriptError FACET requestUri

Extra Credit - Share your dashboard with the community!

Want to be a super “NeRD” (New Relic Developer)?
Use the API Explorer (US), or the API Explorer (EU) to create your Dashboard. Then share your dashboard below and increase your international NeRD cred! (And you’ll earn a cool badge for your community profile!) Here are some quick tips on how to do this.

  1. Copy the Dashboard json below and click here (US) or here (EU)
  2. Paste the JSON into the dashboard textbox with your Admin API key

User%20Dashboard

Once the parameters are filled in, click Send Request, you should receive a 200 OK response.

  1. Go to Insights Dashboards and search for the `JS Errors Dashboard’.

Dashboard Definition

{
  "dashboard": {
    "id": 668824,
    "title": "JS Errors Dashboard",
    "description": null,
    "icon": "bar-chart",
    "visibility": "all",
    "editable": "editable_by_all",
    "metadata": {
      "version": 1
    },
    "widgets": [
      {
        "visualization": "facet_bar_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 1,
          "column": 1
        },
        "widget_id": 6110641,
        "data": [
          {
            "nrql": "SELECT count(*) from JavaScriptError FACET errorClass"
          }
        ],
        "presentation": {
          "title": "JS Errors by Error Class",
          "notes": null,
          "drilldown_dashboard_id": 539020
        }
      },
      {
        "visualization": "comparison_line_chart",
        "layout": {
          "width": 2,
          "height": 1,
          "row": 1,
          "column": 2
        },
        "widget_id": 6110642,
        "data": [
          {
            "nrql": "SELECT count(*) from JavaScriptError TIMESERIES AUTO compare with 1 week ago"
          }
        ],
        "presentation": {
          "title": "JS Errors compared with past JS error trends",
          "notes": null
        }
      },
      {
        "visualization": "facet_bar_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 2,
          "column": 1
        },
        "widget_id": 6110643,
        "data": [
          {
            "nrql": "SELECT count(*) from JavaScriptError FACET appName"
          }
        ],
        "presentation": {
          "title": "JS Errors by App Name",
          "notes": null,
          "drilldown_dashboard_id": 396548
        }
      },
      {
        "visualization": "facet_bar_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 2,
          "column": 2
        },
        "widget_id": 6110644,
        "data": [
          {
            "nrql": "SELECT count(*) from JavaScriptError FACET errorMessage"
          }
        ],
        "presentation": {
          "title": "JS Errors by Error Message",
          "notes": null,
          "drilldown_dashboard_id": 396548
        }
      },
      {
        "visualization": "facet_bar_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 2,
          "column": 3
        },
        "widget_id": 6110645,
        "data": [
          {
            "nrql": "SELECT count(*) FROM JavaScriptError FACET releaseIds"
          }
        ],
        "presentation": {
          "title": "JS Errors by Release ID's",
          "notes": null,
          "drilldown_dashboard_id": 396548
        }
      },
      {
        "visualization": "facet_pie_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 3,
          "column": 1
        },
        "widget_id": 6110646,
        "data": [
          {
            "nrql": "SELECT count(*) FROM JavaScriptError FACET userAgentName"
          }
        ],
        "presentation": {
          "title": "JS Errors by Browser",
          "notes": null,
          "drilldown_dashboard_id": null
        }
      },
      {
        "visualization": "facet_pie_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 3,
          "column": 2
        },
        "widget_id": 6110647,
        "data": [
          {
            "nrql": "SELECT count(*) FROM JavaScriptError FACET userAgentOS"
          }
        ],
        "presentation": {
          "title": "JS Errors by OS",
          "notes": null,
          "drilldown_dashboard_id": null
        }
      },
      {
        "visualization": "facet_bar_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 3,
          "column": 3
        },
        "widget_id": 6110648,
        "data": [
          {
            "nrql": "SELECT count(*) FROM JavaScriptError FACET deviceType"
          }
        ],
        "presentation": {
          "title": "JS Errors by Device Type",
          "notes": null,
          "drilldown_dashboard_id": 539020
        }
      },
      {
        "visualization": "facet_bar_chart",
        "layout": {
          "width": 1,
          "height": 1,
          "row": 4,
          "column": 1
        },
        "widget_id": 6110649,
        "data": [
          {
            "nrql": "SELECT count(*) FROM JavaScriptError FACET requestUri"
          }
        ],
        "presentation": {
          "title": "JS Errors by Request URI",
          "notes": null,
          "drilldown_dashboard_id": 396548
        }
      }
    ],
    "filter": {
      "event_types": [
        "JavaScriptError"
      ],
      "attributes": []
    }
  }
}

More information

Check out our Help Centre for more information on the topics in this post:


Part 1

Dashboard for Pageviews:

Part 3

Part 3 Dashboard for Ajax Requests


Relic Solution: Insights Dashboard for Browser: Part 3 - Ajax Request
Best Practice Guide: Browser
#2

@ddoyle You may want to add to your step by step guide, that users with an account in the EU region, have to go here to create a Dashboard though the API Explorer: https://rpm.eu.newrelic.com/api/explore/dashboards/create

Here’s my example Dashboard that was created through the above-mentioned URL:

https://insights.eu.newrelic.com/accounts/2131211/dashboards/1491


#3

Great feedback Frank - I’ve updated Darren’s post (with his permission :stuck_out_tongue: ) to include the EU endpoint in the API explorer.