← Back to Discord Forum

The network tab (an am-I-doing-this-right thread)

I've been writing front-end-only tests for a while, but my coworkers asked me today to monitor network responses during a certain test. I have playwright.dev/docs/network in front of me, but I'm also starting this thread for all the situation-specific questions that might pop up while I'm working.

First question: I found this example for auto-tracking requests and responses from the page.

page.on('response', response => console.log('<<', response.status(), response.url()));```
Is there a way to filter this for only requests/responses that contain a certain string?

This thread is trying to answer question "How to filter and monitor network responses that contain a certain string using playwright.dev?"

4 replies

if you know what network request you’re waiting for and what triggers it you can use - https://playwright.dev/docs/api/class-page#page-wait-for-response

I don't exactly though. Could I use a regex in that code instead of a full URL?


What's the intent of monitoring the requests? You could also make use of page.route, which allows a filter. https://playwright.dev/docs/network#handle-requests

One of the site devs wants me to record the time and status of any response that appears in a certain search.


Sure, you can filter network responses based on a specific string during your tests with Playwright. This is done using the page.waitForResponse() method.

This method accepts a predicate function as an argument. The function receives a Response object, allowing you to set conditions for filtering responses. You can check properties of the response, like the URL or headers, to see if they contain the string you're looking for.

Here's a quick example:

const responsePromise = page.waitForResponse(response => response.url().includes('ray.run'));
await page.getByText('Update').click();
const response = await responsePromise;

In this code, we're waiting for a response with a URL that contains 'ray.run'. When we get the response, it's stored in the response variable for further use.

This technique lets you filter requests/responses based on specific criteria. It's a great way to monitor and handle network traffic in a more detailed way during your tests.

Remember, this is just one example. There may be other scenarios or variations that this doesn't cover. If you need more details or have other questions, don't hesitate to ask.

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.