Background

In my JavaScript application I make several service calls.

1. First Call = GET request to “SERVICE_1”
2. Second/Third/…./nth = POST request to “SERVICE2”, the request body contains the text “TEXT1” and an ID which will be different for every post request. The response body will also contain “TEXT1” and the ID in JSON format.

I do not know how many of request (2) there will be, and I do not know the IDs that will be in the POST body.

I am using Playwright to tests my application. In my tests, I need to wait for request (1) to complete and ALL of the request (2)’s to complete.

I know how to wait for a GET request

page.waitForResponse('http://my/server/SERVICE_1)

I know I can wait for a POST request containing TEXT1 in its body, using a function

function myFunction() {
    await page.waitForResponse(async (response) => {
        return response.url().includes('http://my/server')
            && response.status() === 200
            && (await response.text()).response.text().includes('TEXT1')            
    });
}

Issue

How do I wait for ALL of these post requests? I want to wait until there are no more POST requests to my URL with “TEXT1” in the body.

Things I looked at

I did look at promise.all and can see how I can wait for requests (1) and (2) but this will stop as soon as it finds one of the second request, not all of the POST requests.

const promisesArr = await Promise.all([
    page.waitForResponse('http://my/server/SERVICE_1),
    page.waitForResponse(myFunction),                 
]);

I did wonder if expect.poll is something that might help.

Note

I do not want to just wait for all network activity to complete (i.e. below) as there could be other network calls that will just cause my tests to take ages if i wait for all of them.

await page.waitForLoadState('networkidle')