Attach to a puppeteer page and collect network request stats.
npm install puppeteer-network-stats
Example below:
-
captures data for all requests
-
request URLs based on the
Network.requestWillBeSent
event -
response status based on the
Network.responseReceived
event -
all event data is merged based on request ids
const PuppeteerNetworkStats = require('puppeteer-network-stats');
const config = {
requestWillBeSent: ({request: {url}}) => ({url}),
responseReceived: ({response: {status}}) => ({status})
};
const networkStats = new PuppeteerNetworkStats(config);
// const browser = await puppeteer.launch();
// const page = browser.newPage();
await networkStats.attach(page); // creates CDP session, registers listeners
// await page.goto(url);
networkStats.getRequests(); // gives you an map of all request data by id
networkStats.clearRequests(); // clears all captured requests
await networkStats.detach(page); // detaches CDP session
A similar configuration allows capturing data from any Network.* events.
As an example for debugging we can just log all event data easily:
const config = [
'requestWillBeSent',
'requestServedFromCache',
'loadingFinished',
'loadingFailed',
'responseReceived'
].map(
(event) => ({
[event]: (params) => ({[event]: params})
})
).reduce(
(result, item) => ({...result, ...item}), {}
)