I've set up my angular 6 App with a modified version of the AngularJS snippet to monitor it. I believe it basically does the same thing the snippet does (see below).
But i'm not seeing the navigations of the user through the app (in the web pages tab of my RUM monitor). Only the first page/url is listed.
Is it possible to show all user navigation/paths in the web pages tab?.
@Injectable()
export class Site24x7Service {
private site24x7RumBeacon: HTMLScriptElement;
private readonly onLoadCallback: EventListenerObject;
private router: Router;
constructor(private readonly winRef: WindowRef) {
this.onLoadCallback = this.handleSite24x7Loaded.bind(this);
}
init(router: Router) {
this.router = router;
if (environment.site24x7RumKey && window.performance && window.performance.timing && window.performance.navigation) {
this.winRef.nativeWindow.rumMOKey = environment.site24x7RumKey;
this.site24x7RumBeacon = document.createElement('script');
this.site24x7RumBeacon.async = true;
this.site24x7RumBeacon.setAttribute('src', '//static.site24x7rum.com/beacon/site24x7rum.js?appKey=' + environment.site24x7RumKey);
this.site24x7RumBeacon.addEventListener('load', this.onLoadCallback);
document.getElementsByTagName('head')[0].appendChild(this.site24x7RumBeacon);
}
}
private handleSite24x7Loaded() {
this.site24x7RumBeacon.removeEventListener('load', this.onLoadCallback);
const site24x7rum = this.winRef.nativeWindow['site24x7rum'];
const insightRUM = this.winRef.nativeWindow['insightRUM'];
const changes = {time: performance.now()};
site24x7rum.routeChanges.push(changes);
insightRUM.storeLastAjax('spa');
this.router.events.pipe(
observableFilter(value => value instanceof NavigationStart),
observableMap(value => value as NavigationStart)
).subscribe(value => {
const changes = {
time: performance.now(),
url: value.url
};
site24x7rum.routeChanges.push(changes);
insightRUM.storeLastAjax('spa');
});
}
}