Add page.on('response')

[ankur22]

What?

This implements the page.on('response') API from Playwright. When the handler is created, all subsequent responses will be directed to the handler, where the user can interact with the read only response object. The response is intercepted after it is received from the website under test to the browser.

An example usage is:

import { browser } from 'k6/browser'

export const options = {
  scenarios: {
    ui: {
      executor: 'shared-iterations',
      options: {
        browser: {
          type: 'chromium',
        },
      },
    },
  },
}

export default async function () {
  const page = await browser.newPage()

  // Logs the url that the response comes from (where the request was made to).
  page.on('response', async (response) => {
    console.log(response.url());
  })

  await page.goto('https://quickpizza.grafana.com/', { waitUntil: 'networkidle' })

  await page.close();
}

Why?

This can be useful to:

• retrieve data that is to be used later, such as auth tokens;
• assert certain conditions on an expected response;

Checklist

• I have performed a self-review of my code.
• I have added tests for my changes.
• I have run linter locally (make lint) and all checks pass.
• I have run tests locally (make tests) and all tests pass.
• I have commented on my code, particularly in hard-to-understand areas.

Related PR(s)/Issue(s)

Updates: #4234
Linked to: #4290

[inancgumus]

My comments about this one would be similar to #4290. They are very alike.

[inancgumus]

We start to duplicate this logic in Page.urlTagName, Page.onRequest, and Page.onConsoleAPICalled (although this one differs a little). What do you think about introducing a helper function in #4290?

[ankur22]

Yeah, i had a feeling you were going to point that out 😄 Sure, i think that should be done in a separate refactor PR 👍

[ankur22]

I refactored the test based on comments made in #4290.