How to call newrelic.setCustomAttribute in React

Hi all! I’ve instrumented a React app using the Browser monitoring agent. I’m already tracking some custom events with Mixpanel but I’d like to do the same just with New Relic. I found that there is a setCustomAttribute method that might send custom events and make afterwards my queries for this goal.

The documentation talks about use the newrelic.setCustomAttribute object but the problem is that it isn’t available into my React app due to the only reference to New Relic I have is injected into the HTML Header as describes there, so what can I do in order to get access to the newrelic object inside my React app? There is the New Relic NPM package which I think is just to instrument NodeJS applications and not to access to New Relic JS api

Otherwise, is there any method to capture the Mixpanel custom events by New Relic?

Thanks.

Hi @joseluisgj

Thanks for reaching out, I hope you are well.

Congrats on your first post in the community, Whoop!

Unfortunately this is outside of my scope, however I am here to help. I am going to reach out to the support engineering team, and have them investigate.

Please note the team will reach out via this post with their findings.

Should you have any additional questions or updates, please do reach out.

Hi @joseluisgj Welcome to New Relic!

If your browser agent is installed properly, and reporting data, then you should have access to the newrelic object in the window of all pages instrumented. Meaning, you should be able to call any of the New Relic Browser API commands from the window.

You can even test the commands out in the JS Console, example:

So, simply calling window.newrelic.setCustomAttribute() should let you add custom attributes as needed.

More details on implementation can be found at the bottom of the following page:

1 Like