Playwright: [BUG] New tab with redirection, can't verify initial url

[boogie77]

Context:

• Playwright Version: 1.3.0
• Operating System: windows
• Node.js version: v14.2.0
• Browser: chromium
• Extra:

Code Snippet

Test repository to see the bug in action (both server and e2e-tests project are provided):
https://github.com/boogie77/playwright-redirect-detection

Describe the bug

The issue is related to new tab being opened with initial URL /foo that is resolved (status 307, to /bar) with redirection to /bar URL.
Playwright resolves context.waitForEvent('page') too late, and we can't verify the initial URL (/foo). When it's resolved it's already on /bar.

[pavelfeldman]

That's expected - Chromium will create the page after the navigation commits and this commit follows the redirects that are handled in the browser. If you'd like to assert those, you can intercept the network with context.route(). It'll capture the original request to /foo:

context.route('**/*', route =>{
  console.log(route.request().url());
  route.continue();
});

You can do that before you click in your test and save the redirect url chain.

[boogie77]

That's expected - Chromium will create the page after the navigation commits and this commit follows the redirects that are handled in the browser. If you'd like to assert those, you can intercept the network with context.route(). It'll capture the original request to /foo:

context.route('**/*', route =>{
  console.log(route.request().url());
  route.continue();
});

You can do that before you click in your test and save the redirect url chain.

Thanks, I tried exacly this before reporting this "issue" above, but it didn't work in my case.
Seems like network interception is not always reliable when it comes to redirects.

When there are multiple redirects it's not catching all of the requests, example (code https://github.com/boogie77/playwright-redirect-detection/blob/multiple_redirections/server/src/app.js#L18):
Redirect chain:

• / _button click_
• open new tab to url /foo
• response with redirect to /secondJump
• response with redirect to /thirdJump
• response with redirect to /bar
• website content is loaded

What we get from network log:

http://localhost:3000/
http://localhost:3000/foo

In my production app tests I actually don't even get the initial url context.route, meaning I don't even see /foo (chrome extension opening new tab).

Redirects in devtools:

@pavelfeldman Is this expected?

---

PS. Something weird I noticed is that when I enable devtools, the same network log from context.route is actually changed, it outputs only:

http://localhost:3000/

[pavelfeldman]

Yes, you won't get another route attempt because you gave it away to the network stack and network stack handles the redirects. But you can still traverse the redirect chain:

        let request;
        await context.route('**/*', route => {
            if (!request)
                request = route.request();
            route.continue().catch(e => {});
        });
        const [newPage] = await Promise.all([context.waitForEvent('page'), page.click('#myButton')]);
        await context.unroute('**/*');
        for (let r = request; r; r = r.redirectedTo())
            console.log(r.url());

[pavelfeldman]

@boogie77 ^^

[boogie77]

Thanks @pavelfeldman 🍻 for this solution with unrouting the request, seems to be working in my repro repository. I will try to adapt it in our production app tests!