Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG] Playwright Firefox (nightly) and webkit won't open popup and stuck at about:blank #23147

Closed
1 task
sanbornsen opened this issue May 18, 2023 · 9 comments
Closed
1 task

[BUG] Playwright Firefox (nightly) and webkit won't open popup and stuck at about:blank #23147

sanbornsen opened this issue May 18, 2023 · 9 comments

Comments

@sanbornsen
Copy link

sanbornsen commented May 18, 2023 •
edited
Loading

System info

  • Playwright Version: [v1.33.0]
  • Operating System: [macOS 13.2, ]
  • Browser: [All, Firefox, WebKit]
  • Other info: It works fine on chromium but not on firefox or webkit. This started happening when I upgraded @playwright/test from 1.27.0 to 1.33.0

Source code

const [popup] = await Promise.all([page.waitForEvent('popup'), page.click(onClickSelector)]);

  let timeout = 0;
  while (!popup.url().includes('http') && timeout < 10) {
    console.log(popup.url());
    await popup.waitForTimeout(1000);
    timeout++;
  }

Where popup.url() is always about:blank.

  • I provided exact source code that allows reproducing the issue locally.
@sanbornsen
Copy link
Author

It could a problem with Nightly version being used. I see for @playwright/test 1.27.1 the Nightly version is 105.0.1 but for @playwright/test 1.33.0 the Nightly version is 112.0. Is there a way I can specify Nightly version in Playwright?

@dgozman
Copy link
Contributor

dgozman commented May 19, 2023

@sanbornsen Playwright only works with the bundled Firefox version, so you cannot specify your own Nightly.

Unfortunately, I cannot reproduce the issue given the short snippet above, and so we cannot fix it. If you could provide a self-contained repro that we can just run, that would be great. Otherwise I'll have to close this issue.

@sanbornsen
Copy link
Author

Okay. I'll try to create a complete code example, give me a day.

@sanbornsen
Copy link
Author

This is my sample page

<html>
    <button data-testid="button" id="btn">Click me</button>
</html>

<script>
    function createWindowRef() {
        try {
            const windowRef = window.open('', '_blank');
            if (!windowRef) {
            return null;
            }
            const metaTag = windowRef.document.createElement('meta');
            metaTag['name'] = 'viewport';
            metaTag['content'] = 'width=device-width, initial-scale=1';
            windowRef.document.getElementsByTagName('head')[0].appendChild(metaTag);

            windowRef.document.body.innerHTML = '<p>Loading</p>';

            return windowRef;
        } catch (_) {
            return null;
        }
    }

    document.getElementById('btn').addEventListener('click', () => {
        const windowRef = createWindowRef();
        try {
            // TODO: windowRef might be null! Consider providing a fallback or the browser tab might crash.
            console.log(windowRef);
            if (windowRef) {
                windowRef.location.assign('https://www.faa.gov/sites/faa.gov/files/regulations_policies/policy_guidance/envir_policy/airquality_handbook/Air_Quality_Handbook_Tutorial.pdf');
                notify('Successfully downloaded label', 'success');
            }
            
        } catch (e) {
            notify(
            e instanceof Error && e.message
                ? e.message
                : 'An error was encountered downloading the label',
            'error',
            );
        }
    })
</script>

This can be run on an HTTP server. Let's say we run it on http://127.0.0.1:8081/

This is my spec file

// @ts-check
const { test, expect } = require('@playwright/test');


test('check popup link', async ({ page }) => {
  await page.goto('http://127.0.0.1:8081/');
  const [popup] = await Promise.all([page.waitForEvent('popup'), page.click('[data-testid="button"]')]);
  
  let timeout = 0;
  while (!popup.url().includes('http') && timeout < 10) {
    // Wait for the PDF to load into the popup window
    // eslint-disable-next-line no-await-in-loop
    await popup.waitForTimeout(1000);
    timeout++;
  }

  // Log out the URI to the PDF
  // eslint-disable-next-line no-console
  console.log(popup.url());
  expect(popup.url()).toBe('https://www.faa.gov/sites/faa.gov/files/regulations_policies/policy_guidance/envir_policy/airquality_handbook/Air_Quality_Handbook_Tutorial.pdf')
});

@sanbornsen
Copy link
Author

I pushed it to GH in case you want to avoid setting up

https://github.com/sanbornsen/playwright-test

@dgozman
Copy link
Contributor

dgozman commented May 22, 2023

@sanbornsen Thank you for the repro! There are known inconsistencies between browsers and headed/headless mode when opening/downloading PDFs. Merging into #7822.

@dgozman dgozman closed this as completed May 22, 2023
@fabiogoshippo
Copy link

fabiogoshippo commented May 25, 2023 •
edited
Loading

@sanbornsen I have exactly the same issue for the same reason (migrating from 1.27 to the latest). Any suggestion on how to fix this? We open and download the pdf then give it to a npm package to extract the text and then assert its content

@fasatrix
Copy link

@sanbornsen I have exactly the same issue for the same reason (migrating from 1.27 to the latest). Any suggestion on how to fix this? We open and download the pdf then give it to a npm pagage to extract the text and then assert its content

+1 I would like to have a workaround at least for this. Moved to latest Playwright and got the4 problem

@sanbornsen
Copy link
Author

I tried listening on the 'response' even and that worked.

const [popup] = await Promise.all([page.waitForEvent('popup'), page.click('button-selector')]);
  let targetUrl = '';
 
  popup.on('response', (response) => {
    targetUrl = response.url();
  });

  let timeout = 0;
  while (!targetUrl && timeout < 10) {
    // Wait for the PDF to load into the popup window
    // eslint-disable-next-line no-await-in-loop
    await popup.waitForTimeout(1000);
    timeout++;
  }

  // Log out the URI to the PDF
  // eslint-disable-next-line no-console
  console.log(targetUrl);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@sanbornsen @dgozman @fasatrix @fabiogoshippo