Description
Version
1.52.0
Steps to reproduce
- Clone https://github.com/gladykov/playwright-grey-rectanle-video
npm install
npx playwright test && npx playwright show-report
- Open report and download video
Pay attention that new headless mode is used:
projects: [
{
name: 'chromium',
use: {
...devices['Desktop Chrome'],
channel: 'chromium', },
},
],
Expected behavior
Video should record whole web page
Actual behavior
This one is fun. On some web pages (ex. A. - Atlassian login xyz.atlassian.net ) there will be grey rectangle under the video.
But visiting some pages ( ex. B - Google.pl ) will remove grey rectangle:
and on second visit to A, grey rectangle is not visible anymore:
Full video:
video.12.webm
In recorded video (and in repo with repro) I play with viewportSize
to show how it affects grey area, before navigating to B. Without viewport size changes bug also exists.
Additional context
This looks similar to #31242 and #15131
This started to happen when new headless mode was introduced.
Other actions which will clear grey rectangle: successful login to Atlassian Confluence - confirms website is able to reset some browser state, to make it disappear.
Other website which will show rectangle: https://kuba.gladykowski.com/blog/
I tried to enforce html / body height using JS, but it did not change anything.
Let me know if I can assist more. If you feel like this bug does not belong here, let me know and I will be happy to open it against Chromium.
Environment
System:
OS: Linux 6.14 EndeavourOS
CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 5.98 GB / 15.48 GB
Container: Yes
Binaries:
Node: 18.20.8 - ~/.config/nvm/versions/node/v18.20.8/bin/node
Yarn: 1.22.22 - /usr/bin/yarn
npm: 10.8.2 - ~/.config/nvm/versions/node/v18.20.8/bin/npm
Languages:
Bash: 5.2.37 - /usr/bin/bash
npmPackages:
@playwright/test: ^1.52.0 => 1.52.0
XFCE / X11
I can reproduce this also when we run tests on Ubuntu @latest in Github Actions runners