Puppeteer: How to listen to a specific response?

Question

I'm tinkering with the headless chrome node api called puppeteer.

I'm wondering how to listen to a specific request response and how to act in consequence.

I have look at events requestfinish and response but it gives me all the request/responses already performed in the page.

How can I achieve commented behaviour?

Answer 1

One option is to do the following:

  page.on('response', response => {
    if (response.url().endsWith("your/match"))
      console.log("response code: ", response.status());
      // do something here
  });

This still catches all requests, but allows you to filter and act on the event emitter.

https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#event-response

Answer 2

Filtered response (wait up to 11 seconds) body parsed as JSON with initially requested PATCH or POST method every time you will be call that:

const finalResponse = await page.waitForResponse(response => 
  response.url() === urlOfRequest 
  && (response.request().method() === 'PATCH' 
  || response.request().method() === 'POST'), 11);
let responseJson = await finalResponse.json();
console.log(responseJson);

Answer 3

Since puppeteer v1.6.0 (I guess) you can use page.waitForResponse(urlOrPredicate[, options])

Example usage from docs:

const firstResponse = await page.waitForResponse('https://example.com/resource');
const finalResponse = await page.waitForResponse(response =>
  response.url() === 'https://example.com' && response.status() === 200
);
return finalResponse.ok();