Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

test: scroll on mobile viewport with accelerated compositing

Browse source 
Reference: https://github.com/microsoft/playwright/issues/31551
This commit is contained in:
Yury Semikhatsky 2024-08-02 17:53:54 -07:00
parent 6721cc1746
commit db41e16180
2 changed files with 43 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
tests/assets/input/scrollable-accelerated.html Normal file
View file

@ -0,0 +1,30 @@
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5">
<style>
.transformed {
width: 60px;
height: 60px;
transform: perspective(500px) translate3d(500px, 0, 0px);
background-color: pink;
}
.top {
position: fixed;
z-index: 1000;
top: 0;
left: 0;
right: 0;
height: 50px;
background-color: lightblue;
}
</style>
</head>
<body>
<div class="top">Header</div>
<div style="height: 3000px; background-color: antiquewhite;">
</div>
<button>Click me</button>
<div class="transformed"></div>
</body>

13
tests/library/browsercontext-viewport-mobile.spec.ts
View file

@ -188,6 +188,19 @@ it.describe('mobile viewport', () => {
await context.close(); await context.close();
}); });
it('should scroll when accelerating compositing needed', {
annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/31551' }
}, async ({ playwright, browser, server, browserName, isLinux, headless }) => {
it.fixme(browserName === 'webkit' && isLinux && headless, 'Fails on WPE apparently due to accelerated compositing + fixed layout');
const iPhone = playwright.devices['iPhone 12'];
const context = await browser.newContext({ ...iPhone });
const page = await context.newPage();
await page.goto(server.PREFIX + '/input/scrollable-accelerated.html');
await page.getByRole('button').click();
expect(await page.evaluate(() => window.scrollY)).toBeGreaterThan(1000);
await context.close();
});
it('view scale should reset after navigation', async ({ browser, browserName }) => { it('view scale should reset after navigation', async ({ browser, browserName }) => {
it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/26876' }); it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/26876' });
const context = await browser.newContext({ const context = await browser.newContext({