8

I am trying to figure out how to make webdriver.io wait until all ajax requests have finished after clicking a button.

Unfortunately the document.readyState is always = 'complete' , and there is nothing "unique" about the webpage except that it has some slightly different data in it.

is there some other way I can test to see if the javascript functions are complete in the page..? 

    await this.browser.waitUntil(function () {
        return this.execute(function () {
            if (document.readyState === 'complete')
                return true;
        })
    });
Martin Thompson
  • 3,415
  • 10
  • 38
  • 62
  • This may help you https://www.npmjs.com/package/webdriverajax – Aswin Ramesh Jan 03 '18 at 05:32
  • Instead of waiting on all/some requests it's better to wait for a specific request to complete. You can use https://webdriver.io/docs/api/browser/mock.html to spy on particular request and then wait for it to be requested https://webdriver.io/docs/api/expect-webdriverio.html#toberequested – Mike G. Jan 20 '21 at 09:09
  • @MikeG. normally we don't care as much about an API being requested, but waiting for it to be completed, regardless of a status. Using your proposal I still don't see how to achieve this – Sergey Pleshakov Oct 26 '21 at 15:19
  • @SergeyPleshakov can you please clarify your question? What exactly are you trying to achieve? – Mike G. Oct 26 '21 at 22:42
  • so all requests go through several steps - initiated, might be redirected, but eventually completed (actual terminology may be different). How I read this question was, the user wants to wait until a request is completed, what you suggested was to wait when it's just initiated. Did I understand it right @MikeG. – Sergey Pleshakov Oct 27 '21 at 14:13
  • This one works well for the scenario you expect: https://webdriver.io/docs/api/expect-webdriverio/ It allows waiting for a request to be completed. To be more specific, it waits for a response to be received. You can not just wait for a response but also verify the response itself (body, headers, etc). @SergeyPleshakov – Mike G. Oct 27 '21 at 18:13

1 Answers1

0

In WDIO 5.x and above, a new third-party plugin called "Intercept Service" was introduced to help with this.

You need to install as dev dependency the service package wdio-intercept-service and declare that in wdio.config.js as services: ['intercept']

You can set up the interceptor for capturing xhr requests like below.

browser.setupInterceptor();  // start capturing xhr requests

After the interceptor has been set up, you can declare some expectations about the requests and get those requests using their index (order of declaration of expectation).

browser.expectRequest('GET', '/api/foo', 200); // expect GET request to /api/foo with 200 statusCode
var request = browser.getRequest(0);
assert.equal(request.method, 'GET');
assert.equal(request.response.headers['content-length'], '42');

You can find more information on their Github page: Intercept Service

Prateek Bagrecha
  • 31
  • 4