Application Insights JavaScript API seems to be changing and breaking much with new versions.
The ai.0.js (and ai.1.0.js) version did two things well
Tracked the operation and dependencies (e.g. outgoing AJAX calls) grouped well.
Showed the operation in the performance tab (though doesn't handle state routing)
With the latest version ai.2.js, the operation and its dependent AJAX calls show up at the same level (no nesting / grouping)
and the operation does not show the page name, though samples are available to navigate to the performance view
I want to look at making it work with AngularJS to demarcate operations on state based routing, but since I don't see the basic feature working, I am wondering if I am missing something.
I have not used NPM mode, but placed the script from the AppInsights-JS repo inside the head element:
https://github.com/microsoft/ApplicationInsights-JS#snippet-setup-ignore-if-using-npm
The ai.0.js is from the writeup for the legacy script: https://github.com/microsoft/ApplicationInsights-JS/blob/master/legacy_README.md#use-js-snippet-and-initialize-dynamically-download-full-application-insights-script-from-cdn
I did look at the telemetry data going across in the "track" api call and saw that 2.0.0 did not carry the "operation.name" attribute, but I did not find an easy way to apply this attribute.
The plain HTML example availabe in the repo doesn't work, there are javascript errors on clicking the buttons. https://github.com/microsoft/ApplicationInsights-JS#examples
When I corrected the JS errors by using the latest script ai.2.0, I noticed the same behavior with the example too.
If anyone has any experience getting this working, that will help, else I will need to dig deeper to understand if I am going wrong somewhere.