XHR request made through a timer isn't reflecting on user actions

[KiranAIR]

I have a timer observable in angular in the following manner,

this.xyz$ = timer(1,1000*60*15).pipe( //Runs  every 15 mins and makes service calls

        switchMap(() => {

          return this.loadMyXHRCall();

        }),

        retry(),

        share(),

    );
I have a panel component that initiates the subscription to this timer. I am unable to see that xhr user action when the xhr call is made via timer. If I directly call "this.loadMyXHRCall()" , this does get detected.

Am I missing any setting to be enabled?

[Julius_Loman]

@KiranAIR  - So this XHR call is initiated without user input? If this is true, then it won't be detected as user action. User action are - as the name says it - actions initiated by a user. If it's on a background, it's not (typically) a user action.

So if you want this XHR call detected become a user action you have several options:

• call the dtrum api explicitly in your timer (I'd prefer doing it this way) (enterXHRaction / leaveXHRaction)
• use cux=1 parameter for the RUM JavaScript as described here.

[KiranAIR]

Hey Julius,
This XHR call is initiated on the panel creation. On click of a button, In

ngOnInit() on the panel where I subscribe to the timer. Unfortunately, I am injecting the script tag dynamically so that its only used in our Production Environment.
Like below,

 let dynatraceScript = document.createElement("script");

 dynatraceScript.type = this.configService.config.dynatraceScript.type;

 dynatraceScript.crossOrigin = this.configService.config.dynatraceScript.crossOrigin;

 dynatraceScript.src = this.configService.config.dynatraceScript.src;

 document.getElementsByTagName('head')[0].appendChild(dynatraceScript);
So I am unable to call the dtrum api or dT_ object directly.

I tried the cux=1 option, works great for subsequent calls made by the timer and also captured some extra xhr actions which weren't done before. It still doesnt capture the first call made by the timer for me.
E.g., 

this.xyz$ = timer(1,1000*60*15).pipe( //Runs  every 15 mins and makes service calls

        switchMap(() => {

          return this.loadMyXHRCall();

        }),

        retry(),

        share(),

    );

In the above timer, the call flow is from 0,15,30,45....and so on. I am able to catpure the call from 15,30,45 but not the first call made when subscribed to the timer at 0 with the cux option.

Thanks,
Kiran

[Julius_Loman · Accepted solution]

I think if you are injecting the RUM before you are creating the panel, then you should be able to call the dtrum API just fine. You need to handle if it's injected anyway. 

For the missing first XHR I can think of two reasons:

• it's already captured in a user action (remember - you clicked a button, so it's initiated by a user)
• it's some timer thing (check if Timeout functionality is enabled for the Web App in Dynatrace)

[KiranAIR]

Hi Julius, 
I will try definitely try the api, I can see the documentation for JavaScript Rum API but no examples on how to  integrate with an application. Do I directly use dtrum or need to import it explicitly and then use? It would be great if you could redirect to any examples.

I do have timeout setting enabled. There was on other user action triggered on the panel (a call made to fetch an icon). For now, I have set that to be primary criteria for creation.

Thanks for your help.

[Julius_Loman · Accepted solution]

If you download the package in your Dynatrace environment (go to Settings -> Web and mobile monitoring -> Advanced setup) it contains API docs (the same as on the web) and also examples. 

You just need to check if the dtrum object is present (e.g. typeof (dtrum) !== "undefined" ) and then call the methods and it should be just fine.