[Bug]: Chromium Playwright >= 1.49.0 stuck at loading pages

[pandel]

Version

Works: up to 1.48.0, does not work: anything newer

Steps to reproduce

I am capturing Grafana panels via Playwright Chromium in headless mode and noticed, that beginning with Playwright>=1.49.0, which uses the newest Chromium tech (microsoft/playwright#33566), I am no longer able to acquire Grafana's login page or anything else.

Expected behavior

Headless browser loads Grafana pages and takes screenshot.

Did this work before?
Yes, up to Playwright version 1.48.0 flawlessly.

Actual behavior

Use my test script. With >=1.49 it will stop at "Enter username".

Additional context

How do we reproduce it?

pip install playwright==1.49.0
playwright install-deps && playwright install chromium
Use added Python file to test: python playwright_browser_test.py -u -p -url
i.e.: python playwright_browser_test.py -u admin -p admin -url http://my.instance.url:3000

With Playwright<1.49.0 the script will go through a complete login process and return with the headless browser closed. With >=1.49 it will stop at "Enter username".

playwright_browser_test.py.txt

I did also check with the people from Grafana and it seems they ran into the same issue: grafana/grafana#103483

Environment

Grafana: 11.6.0
OS: Debian 12
Browser: Chromium headless v131 (coming via playwright install chromium)

Grafana platform?
Docker

[ltsuda]

Please, could you try using the new headless mode? https://playwright.dev/python/docs/browsers#chromium-new-headless-mode

browser = await playwright.chromium.launch(headless=True, channel="chromium")

Optionally, install with this --no-shell to not download the old chromium headless shell.

playwright install --no-shell chromium (--with-deps)

[pandel]

@ltsuda Did you ever take a look at my test script that I provided? I did already!

browser = await playwright.chromium.launch(headless=True)

And that is exactly the problem. Don't know why I should test things which lead exactly to my bug report...

[aspiringVegetarian]

@pandel

browser = await playwright.chromium.launch(headless=True)

is not the same as

browser = await playwright.chromium.launch(headless=True, channel="chromium")

I was hitting this same condition and using the "chromium" channel fixed the issue.

[pandel]

@aspiringVegetarian OH WOW! I did read everything about browser selection again in the Playwright Docs but did absolutely not recognize this to be something different. And as I only installed "chromium" via playwright install chromium I would never have expected that one has to address this on top of that!

MANY MANY THANKS! And my apologies for being a bit rude. The whole problem was sooo frustrating at times! There should be definitely a hint or something in the docs that people can avoid potential problems using this channel= parameter.

[mxschmitt]

This still looks like a bug to me. headless: true should behave the same as channel: 'chromium'. Happy to investigate further on our side, esp. if it was working in previous versions.

I tried to repro but for me it is always stuck at Wait for selector .page-dashboard which I consider it works as expected?

I created a Grafana instance via this: https://grafana.com/docs/grafana/latest/setup-grafana/installation/docker/ - did docker run and created a password and nothing else. Is more configuration needed on Grafana side? Since I had the impression that it stopped at Enter username.

[pandel]

@mxschmitt If it is stuck at Wait for selector .page-dashboard, then the page has loaded, Playwright was able to enter the password but couldn't find the CSS selector, which is not that big deal.

If you chose to use my testscript, then simply replace the line

await page.wait_for_selector('.page-dashboard', timeout=30000)

with

selector = "data-testid navigation mega-menu"
await page.locator(f'[data-testid^="{selector}"]').wait_for(timeout=30000)

You can find more about Grafana standard page element selectors here, if that does not work with your Grafana version:
https://github.com/grafana/grafana/tree/main/packages/grafana-e2e-selectors/src/selectors

[aspiringVegetarian]

This still looks like a bug to me. headless: true should behave the same as channel: 'chromium'. Happy to investigate further on our side, esp. if it was working in previous versions.

I tried to repro but for me it is always stuck at Wait for selector .page-dashboard which I consider it works as expected?

I created a Grafana instance via this: https://grafana.com/docs/grafana/latest/setup-grafana/installation/docker/ - did docker run and created a password and nothing else. Is more configuration needed on Grafana side? Since I had the impression that it stopped at Enter username.

My understanding of the new chromium headless mode is that it is opt-in... https://playwright.dev/python/docs/browsers#chromium-new-headless-mode

So headless: true uses the "old" headless mode - chromium-headless-shell - while headless: true & channel: 'chromium' uses the "new" headless mode?

[mxschmitt]

So headless: true uses the "old" headless mode - chromium-headless-shell - while headless: true & channel: 'chromium' uses the "new" headless mode?

Yes.

Ideally headless "old" / aka. chromium-headless-shell and headless new aka. channel: 'chromium' behave the same.

I'd still love to dig deeper into this but as per #2820 (comment) it looks like I wasn't able to reproduce.

(I'd otherwise close this issue since Grafana users seem satisfied with the workaround?)