yujunjun/playwright
1
0
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2025-06-26 21:40:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: workaround webkit screenshot animation issue (#28582)

Browse Source
This commit is contained in:
Pavel Feldman 2023-12-11 18:20:24 -08:00 committed by GitHub
parent ac3600ec96
commit 76ace0fc09
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 26 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/playwright-core/src/server/chromium/crPage.ts
View File

@ -382,6 +382,10 @@ export class CRPage implements PageDelegate {
throw new Error('Frame has been detached.');
return parentSession._adoptBackendNodeId(backendNodeId, await parent._mainContext());
}
shouldToggleStyleSheetToSyncAnimations(): boolean {
return false;
}
}
class FrameSession {

4
packages/playwright-core/src/server/firefox/ffPage.ts
View File

@ -594,6 +594,10 @@ export class FFPage implements PageDelegate {
throw new Error('Frame has been detached.');
return context.createHandle(result.remoteObject) as dom.ElementHandle;
}
shouldToggleStyleSheetToSyncAnimations(): boolean {
return false;
}
}
function webSocketId(frameId: string, wsid: string): string {

2
packages/playwright-core/src/server/page.ts
View File

@ -97,6 +97,8 @@ export interface PageDelegate {
readonly cspErrorsAsynchronousForInlineScipts?: boolean;
// Work around for mouse position in Firefox.
resetForReuse(): Promise<void>;
// WebKit hack.
shouldToggleStyleSheetToSyncAnimations(): boolean;
}
type EmulatedSize = { screen: types.Size, viewport: types.Size };

14
packages/playwright-core/src/server/screenshotter.ts
View File

@ -46,7 +46,16 @@ export type ScreenshotOptions = {
style?: string;
};
function inPagePrepareForScreenshots(screenshotStyle: string, hideCaret: boolean, disableAnimations: boolean) {
function inPagePrepareForScreenshots(screenshotStyle: string, hideCaret: boolean, disableAnimations: boolean, syncAnimations: boolean) {
// In WebKit, sync the animations.
if (syncAnimations) {
const style = document.createElement('style');
style.textContent = 'body {}';
document.head.appendChild(style);
document.documentElement.getBoundingClientRect();
style.remove();
}
if (!screenshotStyle && !hideCaret && !disableAnimations)
return;
@ -251,8 +260,9 @@ export class Screenshotter {
async _preparePageForScreenshot(progress: Progress, screenshotStyle: string | undefined, hideCaret: boolean, disableAnimations: boolean) {
if (disableAnimations)
progress.log(' disabled all CSS animations');
const syncAnimations = this._page._delegate.shouldToggleStyleSheetToSyncAnimations();
await Promise.all(this._page.frames().map(async frame => {
await frame.nonStallingEvaluateInExistingContext('(' + inPagePrepareForScreenshots.toString() + `)(${JSON.stringify(screenshotStyle)}, ${hideCaret}, ${disableAnimations})`, false, 'utility').catch(() => {});
await frame.nonStallingEvaluateInExistingContext('(' + inPagePrepareForScreenshots.toString() + `)(${JSON.stringify(screenshotStyle)}, ${hideCaret}, ${disableAnimations}, ${syncAnimations})`, false, 'utility').catch(() => {});
}));
if (!process.env.PW_TEST_SCREENSHOT_NO_FONTS_READY) {
progress.log('waiting for fonts to load...');

4
packages/playwright-core/src/server/webkit/wkPage.ts
View File

@ -1184,6 +1184,10 @@ export class WKPage implements PageDelegate {
async _clearPermissions() {
await this._pageProxySession.send('Emulation.resetPermissions', {});
}
shouldToggleStyleSheetToSyncAnimations(): boolean {
return true;
}
}
/**

2
tests/page/page-screenshot.spec.ts
View File

@ -691,7 +691,6 @@ it.describe('page screenshot animations', () => {
});
it('should fire transitionend for finite transitions', async ({ page, server, browserName, platform }) => {
it.fixme(browserName === 'webkit' && platform === 'linux');
await page.goto(server.PREFIX + '/css-transition.html');
const div = page.locator('div');
await div.evaluate(el => {
@ -718,7 +717,6 @@ it.describe('page screenshot animations', () => {
});
it('should capture screenshots after layoutchanges in transitionend event', async ({ page, server, browserName, platform }) => {
it.fixme(browserName === 'webkit' && platform === 'linux');
await page.goto(server.PREFIX + '/css-transition.html');
const div = page.locator('div');
await div.evaluate(el => {