← Back to Discord Forum

Get network requests and responses after a button click.

Hello, i need to get all the network action and the responses from that networks requests after making a button click. Is it possible?

This thread is trying to answer question "Is it possible to get all the network action and the responses from that networks requests after making a button click?"

4 replies

You should be able to intercept the network traffic, but not sure if it would be better to use waitForResponse() to capture specific traffic. Sorry not sure what your use case is. In typeScript, I have to wrap the button click in a promise all. My pythin is a bit rusty. The issue I found is you have to start listening for the network traffic prior to the click event else you might miss the traffic since the speed of execution.

not sure you can get ALL the responses, but if you know what you're looking for you can waitForResponse(/regexurl/)

const response = page.waitForResponse(/url/) // note do not await, this starts the wait
await button.click()
const responseJson = await (await response).json // resolves after the click

oh I just noticed Python... my syntax is JS/TS

Discaimer: I use PW for Node.js Seems like you can intercept all network request using page.route and collect the requests and response there. These two subroutines look helpful for what you're trying to achieve:

  1. https://playwright.dev/python/docs/api/class-route#route-continue
  2. https://playwright.dev/python/docs/api/class-route#route-fetch


Sure, you can handle network interactions in Playwright after a button click. Here's how:

Waiting for a Response

Use page.waitForResponse() to wait for a response after a button click. This method lets you specify a URL pattern or a predicate function that takes in a Response object.

const responsePromise = page.waitForResponse('https://ray.run/api/fetch_data');
await page.getByText('Update').click();
const response = await responsePromise;

Handling Requests

Playwright lets you handle requests with page.route(). This method intercepts network requests and lets you decide how they should be handled.

await page.route('https://ray.run/*', route => {
  const headers = route.request().headers();
  delete headers['X-Secret'];
  route.continue({ headers });

Aborting Requests

You can abort certain types of requests using route.abort().

await page.route('https://ray.run/*', route => {
  return route.request().resourceType() === 'image' ? route.abort() : route.continue();

Modifying Responses

If you need to modify responses from your server-side scripts or APIs during testing scenarios, use APIRequestContext along with route.fulfill().

These are just some examples of what you can do with Playwright's networking capabilities. Depending on your specific needs, there might be more advanced techniques available within Playwright.

Related Discord Threads

AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.