Rayrun
← Back to Discord Forum

Usage of waitForResponse()

kateryna.qaposted in #help-playwright
Open in Discord
kateryna.qa

Hello, everyone! I am new in Playwright and have one question. Is it possible to use waitForResponse() for waiting page is fully loaded?

Example: await this.page.waitForResponse(/get-team-recent-files/);

Thank you!

This thread is trying to answer question "Is it possible to use waitForResponse() in Playwright for waiting until a page is fully loaded? Are there any downsides to using this method?"

2 replies

Hard to say, depending on what you are automating, what if the page gets 'x' requests behind the scene? Would suggest you need to find what for your use case indicates a given page is fully loaded.

kateryna.qa

Hello, @dand33 ! Thank you for answering. My case is : After entering the credentials on Login page I am been redirected to Dashboard page of my app. And I need to wait until dashboard page is loaded to execute the futher actions . Previously I have used "waitForLoadState('networkidle')" but for now I have got random error like "Error: page.waitForLoadState: Navigation failed because page was closed!" . Then I have also tried to use 'load' and 'domcontentloaded' states , but tests are continue to be flaky.
Also the waitForURL() has been used https://playwright.dev/docs/api/class-page#page-wait-for-url but it also did not helped in 100%.

For now I have tried https://playwright.dev/docs/api/class-page#page-wait-for-response for the request I need to wait. And looks like is helped me. But I am afraid of if there are some 'minuses' for using this method?

Answer

Using waitForResponse() in Playwright

Yes, you can use waitForResponse() in Playwright to wait until a page is fully loaded. This method waits for a network response after an action like a button click. You can use it with a glob URL pattern, RegExp, or a predicate taking a Response object.

Here's an example:

// Use a glob URL pattern. Note no await.
const responsePromise = page.waitForResponse('https://ray.run/api/fetch_data');
await page.getByText('Update').click();
const response = await responsePromise;

But, there's a catch. waitForResponse() may not be suitable if the page loading involves multiple network requests and responses. It waits for one specific network response and doesn't guarantee that all resources on the page have been fully loaded.

Playwright also offers waitForLoadState(). This function returns when the required load state has been reached. It might be more appropriate if you want to ensure that the entire page has been loaded.

await page.getByRole('button').click(); // Click triggers navigation.
await page.waitForLoadState(); // The promise resolves after 'load' event.

Playwright also performs actionability checks on elements before making actions. It auto-waits for all relevant checks (like ensuring element is attached to DOM, visible, stable etc.) to pass and only then performs the requested action.

So, while waitForResponse() can be useful in certain scenarios, it may not always be suitable when you need assurance that an entire webpage has completely loaded. Other methods provided by Playwright such as waitForLoadState() or automatic actionability checks could potentially serve better in those cases.

Related Discord Threads

TwitterGitHubLinkedIn
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.