Get XHR response and parse it

How can I read an XHR response and parse it?

I currently use a workaround way of testing responsiveness of my app: I use various waitForElement_*_() commands in order to measure loading time of various elements.

I would like to get more specific and measure the duration of network requests (that can be seen in DevTools - network traffic).

Can it be done?

Well, if you want to measure API response times, you should send the request itself :slight_smile: waitFor… methods can measure total time (including response time, do the magic stuff on frontend and render the element).

And I am pretty confident that wait methods aren’t as accurate as should be - they verify the presence of the element every 250ms or so. It means, that if you request takes 260ms, wait method would say it takes 500ms. It is absolutely fine for functional testing, but not so good for performance testing.

But it’s possible to get API response time, ResponseObject class contains getWaitingTime() method. This would be the time you see in Network console.

* there is also getElapsedTime(), which should include everything what is required to send and receive data (including waiting time).

1 Like

@Marek_Melocik

A rewritten version of that post (with all the api calls, the js required etc) would make a great Tips & Tricks post, Marek.

Thanks Marek.

However, I would prefer not to send the WS request, because part of the URL is a value I can get only by querying the database. The thing (“test”) I’m trying to create should be able to read the DevTools network traffic without additional tools used.

It should be possible in WebDriver using BrowserMob proxy, but I’d still recommend using WS approach. This is kinda overhead, but still a valid approach. I haven’t tried it, but you should get HAR file(s) and you can parse the timings out.

https://www.testingexcellence.com/how-to-capture-network-traffic-and-http-requests-from-webdriver/

@Russ_Thomas I will, I’ve already thought about that. :wink:

I will see what I can come up with.

@Russ_Thomas Can something like this be done by executing a JavaScript script?

I’m trying to parse the response JSON, but how do I get it without using Web Service requests?

If I’m understanding what you’re trying to achieve correctly, most certainly yes.

JSON (obviously) “is” JS, so assuming you have a way to get that payload, JS doesn’t care where it came from, you can certainly read (and write) it at will.

Using fetch/ajax APIs, you can also get it in JS. I can picture one call from your Groovy code that enters a JS routine and returns a simple boolean (true it worked, false it failed), or returns a structured object (yeah, another json object) with your “parsed results”. Something as “wordy” as this, for example.:

{
  "timing": "not so good",
  "latency": "average",
  "total bytes": 1234,
  ...
}

Hope I understood correctly.

This is what I’m trying to do. To get that payload, but without directly targeting the API (API call to get that payload involves using a value I can get only from the database).

Do you know if there is something like getXHR() or something like that?

And of course:

https://api.jquery.com/jQuery.ajax/

1 Like

Thanks!

Looks I’ve got some reading to do…

I think my confusion was because you said…

Now I think I understand better - you meant, without using the Katalon WS APIs… right?

So, to be clear, you still need to make webservice requests, but you can make the request in JS and deal with the result directly in JS.

But correct me if I’m wrong!

I don’t mind using the Katalon WS APIs. It is just that the URL I would be hitting consists of a particular id number I cannot get from examining the DOM. I would need to run a db query, and I’m trying not to do that.

(I’m using web-automation not to test - not in this case - but to get a performance metric in colaboration with our sysadmin. And he wouldn’t want to query the db but instead to figure out another way of doing that.)