diff --git a/docs/src/api/params.md b/docs/src/api/params.md index 40bdadc118..f214cf943a 100644 --- a/docs/src/api/params.md +++ b/docs/src/api/params.md @@ -902,12 +902,14 @@ Note that outer and inner locators must belong to the same frame. Inner locator - %%-locator-option-has-%% ## screenshot-option-animations -- `animations` <[ScreenshotAnimations]<"disabled">> +- `animations` <[ScreenshotAnimations]<"disabled"|"allow">> When set to `"disabled"`, stops CSS animations, CSS transitions and Web Animations. Animations get different treatment depending on their duration: * finite animations are fast-forwarded to completion, so they'll fire `transitionend` event. * infinite animations are canceled to initial state, and then played over after the screenshot. +Defaults to `"allow"` that leaves animations untouched. + ## screenshot-option-omit-background - `omitBackground` <[boolean]> diff --git a/packages/playwright-core/src/protocol/channels.ts b/packages/playwright-core/src/protocol/channels.ts index 8aa1283c20..72b3046941 100644 --- a/packages/playwright-core/src/protocol/channels.ts +++ b/packages/playwright-core/src/protocol/channels.ts @@ -1503,7 +1503,7 @@ export type PageExpectScreenshotParams = { screenshotOptions?: { omitBackground?: boolean, fullPage?: boolean, - animations?: 'disabled', + animations?: 'disabled' | 'allow', clip?: Rect, mask?: { frame: FrameChannel, @@ -1526,7 +1526,7 @@ export type PageExpectScreenshotOptions = { screenshotOptions?: { omitBackground?: boolean, fullPage?: boolean, - animations?: 'disabled', + animations?: 'disabled' | 'allow', clip?: Rect, mask?: { frame: FrameChannel, @@ -1547,7 +1547,7 @@ export type PageScreenshotParams = { quality?: number, omitBackground?: boolean, fullPage?: boolean, - animations?: 'disabled', + animations?: 'disabled' | 'allow', clip?: Rect, size?: 'css' | 'device', fonts?: 'ready' | 'nowait', @@ -1562,7 +1562,7 @@ export type PageScreenshotOptions = { quality?: number, omitBackground?: boolean, fullPage?: boolean, - animations?: 'disabled', + animations?: 'disabled' | 'allow', clip?: Rect, size?: 'css' | 'device', fonts?: 'ready' | 'nowait', @@ -2864,7 +2864,7 @@ export type ElementHandleScreenshotParams = { type?: 'png' | 'jpeg', quality?: number, omitBackground?: boolean, - animations?: 'disabled', + animations?: 'disabled' | 'allow', size?: 'css' | 'device', fonts?: 'ready' | 'nowait', mask?: { @@ -2877,7 +2877,7 @@ export type ElementHandleScreenshotOptions = { type?: 'png' | 'jpeg', quality?: number, omitBackground?: boolean, - animations?: 'disabled', + animations?: 'disabled' | 'allow', size?: 'css' | 'device', fonts?: 'ready' | 'nowait', mask?: { diff --git a/packages/playwright-core/src/protocol/protocol.yml b/packages/playwright-core/src/protocol/protocol.yml index b586aa3089..8f2ff845b6 100644 --- a/packages/playwright-core/src/protocol/protocol.yml +++ b/packages/playwright-core/src/protocol/protocol.yml @@ -1015,6 +1015,7 @@ Page: type: enum? literals: - disabled + - allow clip: Rect? mask: type: array? @@ -1049,6 +1050,7 @@ Page: type: enum? literals: - disabled + - allow clip: Rect? size: type: enum? @@ -2224,6 +2226,7 @@ ElementHandle: type: enum? literals: - disabled + - allow size: type: enum? literals: diff --git a/packages/playwright-core/src/protocol/validator.ts b/packages/playwright-core/src/protocol/validator.ts index ce6b49c974..4266f4f31a 100644 --- a/packages/playwright-core/src/protocol/validator.ts +++ b/packages/playwright-core/src/protocol/validator.ts @@ -556,7 +556,7 @@ export function createScheme(tChannel: (name: string) => Validator): Scheme { screenshotOptions: tOptional(tObject({ omitBackground: tOptional(tBoolean), fullPage: tOptional(tBoolean), - animations: tOptional(tEnum(['disabled'])), + animations: tOptional(tEnum(['disabled', 'allow'])), clip: tOptional(tType('Rect')), mask: tOptional(tArray(tObject({ frame: tChannel('Frame'), @@ -570,7 +570,7 @@ export function createScheme(tChannel: (name: string) => Validator): Scheme { quality: tOptional(tNumber), omitBackground: tOptional(tBoolean), fullPage: tOptional(tBoolean), - animations: tOptional(tEnum(['disabled'])), + animations: tOptional(tEnum(['disabled', 'allow'])), clip: tOptional(tType('Rect')), size: tOptional(tEnum(['css', 'device'])), fonts: tOptional(tEnum(['ready', 'nowait'])), @@ -1067,7 +1067,7 @@ export function createScheme(tChannel: (name: string) => Validator): Scheme { type: tOptional(tEnum(['png', 'jpeg'])), quality: tOptional(tNumber), omitBackground: tOptional(tBoolean), - animations: tOptional(tEnum(['disabled'])), + animations: tOptional(tEnum(['disabled', 'allow'])), size: tOptional(tEnum(['css', 'device'])), fonts: tOptional(tEnum(['ready', 'nowait'])), mask: tOptional(tArray(tObject({ diff --git a/packages/playwright-core/types/types.d.ts b/packages/playwright-core/types/types.d.ts index c711f1605c..547ed1a300 100644 --- a/packages/playwright-core/types/types.d.ts +++ b/packages/playwright-core/types/types.d.ts @@ -8069,8 +8069,10 @@ export interface ElementHandle extends JSHandle { * depending on their duration: * - finite animations are fast-forwarded to completion, so they'll fire `transitionend` event. * - infinite animations are canceled to initial state, and then played over after the screenshot. + * + * Defaults to `"allow"`. */ - animations?: "disabled"; + animations?: "disabled"|"allow"; /** * When set to `"ready"`, screenshot will wait for @@ -15597,8 +15599,10 @@ export interface LocatorScreenshotOptions { * depending on their duration: * - finite animations are fast-forwarded to completion, so they'll fire `transitionend` event. * - infinite animations are canceled to initial state, and then played over after the screenshot. + * + * Defaults to `"allow"`. */ - animations?: "disabled"; + animations?: "disabled"|"allow"; /** * When set to `"ready"`, screenshot will wait for @@ -15748,8 +15752,10 @@ export interface PageScreenshotOptions { * depending on their duration: * - finite animations are fast-forwarded to completion, so they'll fire `transitionend` event. * - infinite animations are canceled to initial state, and then played over after the screenshot. + * + * Defaults to `"allow"`. */ - animations?: "disabled"; + animations?: "disabled"|"allow"; /** * An object which specifies clipping of the resulting image. Should have the following fields: diff --git a/tests/page/page-screenshot.spec.ts b/tests/page/page-screenshot.spec.ts index 9aefce0dc8..42804eb121 100644 --- a/tests/page/page-screenshot.spec.ts +++ b/tests/page/page-screenshot.spec.ts @@ -564,7 +564,7 @@ it.describe('page screenshot animations', () => { }); await rafraf(page); // Make sure finite transition is not restarted. - const screenshot2 = await div.screenshot(); + const screenshot2 = await div.screenshot({ animations: 'allow' }); expect(screenshot1.equals(screenshot2)).toBe(true); expect(await page.evaluate(() => window['__TRANSITION_END'])).toBe(true);