[Question] How to wait for several responses that differs only with body?

After clicking button multiple requests to GraphQL are made. URL is the same, only body is different. I tried the following:

async uploadFile() {
    const [fileChooser] = await Promise.all([
        this.page.waitForEvent('filechooser'),
        this.page.click(this.elements.csvInput)
    ]);
    await fileChooser.setFiles('./resources/upload_findings.csv');
    await this.page.click(this.elements.uploadButton);
}

async function waitForFindingUpload(page, findingName) {
    return await page.waitForResponse(async (response) => {
        let body = await response.text();
        return body.includes(findingName)
    }, {
        timeout: 10000
    });
}
const [response1, response2] = await Promise.all([
    waitForFindingUpload(page, "Name of Finding 1"),
    waitForFindingUpload(page, "Name of Finding 2"),
    uploadFindingsPage.uploadFile()
])

These response1, response2 are both either “Name of Finding 1” or “Name of Finding 2”. I can not get both responses. How can I do this ?

[GetafixIT]

Would rather use async/await but this seems to work on a graphql query for the time being:

await this.page.waitForResponse((resp) => {
      return resp.text().then((body) => {
        return body.indexOf("someTextFromTheResponseBody") > -1;
      });
    });

[dgozman]

I think the issue here is that waitForResponse does not support an async predicate. So it treats the returned promise as truthy, and always returns the response that comes first, for both waitForResponse calls. We should fix that.