cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Developer console code is not working under JavaScript of browser monitor

AK
Pro

Hello Folks,

I wanted to use JavaScript event of Browser click path monitor. I developed one code which ultimately returning me a string.

The dilemma is, when I tried to paste that code in JavaScript event space of browser click path it throws lot of syntax error like for example,

var response = await fetch(https://someapi.com/api/);
var data = await response.json();

here it gives Missing ";" before statement

I build a code on developer console of chrome browser. It worked really well there. I generally use it as a terminal to develop and test small JScript and modify (e.g.- console.log will get change to api.info) it according to requirement of HTTP or Browser monitor.

How can I resolve above syntax errors or is it something not at all supported under JavaScript event of Browse click path monitor?

Can someone help here.

Regards,

AK

 

6 REPLIES 6

Julius_Loman
DynaMight Legend
DynaMight Legend

Looks like the editor does not know the await keyword at all and . Using your snippet above gives me the following error:


Exception was thrown by the JavaScript code: await is only valid in async functions and the top level bodies of modules

which probably pretty explains why it is also not working even if you save the JavaScript synthetic event.


If you need to call an external API in your JavaScript event, you can do it this way.

api.startAsyncSyntheticEvent();
fetch('https://randomuser.me/api/').then((resp) => resp.json()).then(function(data) {
    document.getElementById('firstName').value = data.results[0].name.first;
    document.getElementById('lastName').value = data.results[0].name.lastname;
    api.finish();
}).catch(function(error) {
    api.fail('Fetch request to randomuser.me failed');
});

 

Certified Dynatrace Master | Alanata a.s., Slovakia, Dynatrace Master Partner

@Julius_Loman, Will it allow to iterate through multiple fetch call under one JavaScript event like below,

fetch('https://someapi.com/api/'+numbers+'/values')

I wanted to save each value on each iteration of fetch call and use it for further processing.

Julius_Loman
DynaMight Legend
DynaMight Legend

@AK Sure you can do multiple fetch calls in your single JavaScript synthetic event. Just it must finish within a reasonable time ( I think the timeout is 100 seconds for the whole JavaScript event ).

Certified Dynatrace Master | Alanata a.s., Slovakia, Dynatrace Master Partner

@Julius_Loman, yes all my calls could finish in < 1000ms however, my code returns [object Promise] and I'm stuck there. I tried lot of solutions from forums but none them worked.

Have you encountered in such situation and resolve it successfully.

Julius_Loman
DynaMight Legend
DynaMight Legend

I'm lame with JS and promises, but I guess you need something like this if I understood your requirements - fetching multiple APIs in parallel and do something with the data in a browser monitor step:

api.startAsyncSyntheticEvent();
api.info("About to fetch some APIs");
urls = ["https://pokeapi.co/api/v2/pokemon/1", "https://pokeapi.co/api/v2/pokemon/2", "https://pokeapi.co/api/v2/pokemon/3"];
Promise.all(urls.map(url =>
    fetch(url).then(response => response.json())
)).then(responses => {
    responses.map(response => api.info(response.name));
    api.finish();
}, responses => {
    api.fail("Failed to fetch responses");
});




Certified Dynatrace Master | Alanata a.s., Slovakia, Dynatrace Master Partner

@Julius_Loman, I'm able to resolve it. Thank you for your suggestions and taking a time to respond.

Featured Posts