Playwright reload page after navigation if certain status code

Question

I am in a situation where I need my functional browser tests to check the returned status code of all page responses, and if I get a 503, attempt to reload the page X number of times before failing.

I have attempted to use Playwright network events, but it seems that altering the Page state (i.e. triggering a reload) breaks any future interaction and you end up with Execution context was destroyed, most likely because of a navigation. errors.

For example:

page.on('response', async (response) => {
  if (response.request().resourceType() !== 'document') return;

  if (response.status() === 503) {
    await page.reload();
  }
}

(I have ommitted the retry attempts logic for simlicity)

After this code has executed, any attempts to interact with the page will result in the Execution context was destroyed error.

I'm not 100% sure this is the right way to approach this problem. Any ideas?

Where are you getting that error?

hardkoded
– hardkoded

2020-08-21 13:10:13 +00:00
Commented Aug 21, 2020 at 13:10 — hardkoded
– hardkoded, Commented Aug 21, 2020 at 13:10

Dima Dorogonov · Accepted Answer · 2023-01-04 16:59:51Z

5

For me this part only was needed when searching for how to reload the page with Playwright:

await page.reload();

answered Jan 4, 2023 at 16:59

Dima Dorogonov

2,5931 gold badge26 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

arjunattam · Accepted Answer · 2020-08-21 17:15:16Z

4

This is an interesting scenario. If response was available at BrowserContext, your approach would work. Since that is not the case, "reload" needs to be done via opening a new page.

This can be achieved with a helper method that "returns page after retries". This method would retry page creation and navigation for error status code.

const {chromium} = require('playwright');

const pageAfterRetries = async (context, url, maxRetries) => {
    if (!maxRetries) return;

    const page = await context.newPage();
    const [_, response] = await Promise.all([
        page.goto(url),
        page.waitForEvent('response', response => response.request().resourceType() === 'document')
    ]);
    if (response.status() === 503) {
        // Retry if this happens
        await page.close();
        return pageAfterRetries(context, url, maxRetries - 1);
    }
    return page;
}

(async() => {
    const browser = await chromium.launch({headless: false});
    const context = await browser.newContext();
    const page = await pageAfterRetries(context, 'https://www.google.com', 3);

    // Use page for remaining script
    console.log(page);
})();

answered Aug 21, 2020 at 17:15

arjunattam

2,85920 silver badges24 bronze badges

2 Comments

David Ambler Over a year ago

Yes this works for logic where I am performing a hard navigation, i.e. doing a page.goto(url) type call. It doesn't work for navigations that occur due to user action like clicking a link. I'm trying to do a 'catch all' type method for retrying these page loads, but I'm not sure it's possible.

user18541276 Over a year ago

@arjunattam can you answer my question? stackoverflow.com/questions/71601470/…

Rohithsingh Thakur · Accepted Answer · 2023-03-30 11:49:05Z

1

it's working fine to me when I have written

await page.reload({waitUntil:'load'});

answered Mar 30, 2023 at 11:49

Rohithsingh Thakur

111 bronze badge

Collectives™ on Stack Overflow

Playwright reload page after navigation if certain status code

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related