diff --git a/docs/src/api/class-locatorassertions.md b/docs/src/api/class-locatorassertions.md index 9b7938d31f..d8bb7e590e 100644 --- a/docs/src/api/class-locatorassertions.md +++ b/docs/src/api/class-locatorassertions.md @@ -1021,9 +1021,9 @@ await expect(locator).toHaveScreenshot(); ### option: LocatorAssertions.toHaveScreenshot.mask = %%-screenshot-option-mask-%% -### option: LocatorAssertions.toHaveScreenshot.pixelCount = %%-assertions-pixel-count-%% +### option: LocatorAssertions.toHaveScreenshot.maxDiffPixels = %%-assertions-max-diff-pixels-%% -### option: LocatorAssertions.toHaveScreenshot.pixelRatio = %%-assertions-pixel-ratio-%% +### option: LocatorAssertions.toHaveScreenshot.maxDiffPixelRatio = %%-assertions-max-diff-pixel-ratio-%% ### option: LocatorAssertions.toHaveScreenshot.threshold = %%-assertions-threshold-%% diff --git a/docs/src/api/class-pageassertions.md b/docs/src/api/class-pageassertions.md index 5584b51181..7387fd2417 100644 --- a/docs/src/api/class-pageassertions.md +++ b/docs/src/api/class-pageassertions.md @@ -140,9 +140,9 @@ await expect(page).toHaveScreenshot(); ### option: PageAssertions.toHaveScreenshot.mask = %%-screenshot-option-mask-%% -### option: PageAssertions.toHaveScreenshot.pixelCount = %%-assertions-pixel-count-%% +### option: PageAssertions.toHaveScreenshot.maxDiffPixels = %%-assertions-max-diff-pixels-%% -### option: PageAssertions.toHaveScreenshot.pixelRatio = %%-assertions-pixel-ratio-%% +### option: PageAssertions.toHaveScreenshot.maxDiffPixelRatio = %%-assertions-max-diff-pixel-ratio-%% ### option: PageAssertions.toHaveScreenshot.threshold = %%-assertions-threshold-%% diff --git a/docs/src/api/class-screenshotassertions.md b/docs/src/api/class-screenshotassertions.md index ba7ef1af03..3089adfbdd 100644 --- a/docs/src/api/class-screenshotassertions.md +++ b/docs/src/api/class-screenshotassertions.md @@ -34,8 +34,8 @@ Learn more about [visual comparisons](./test-snapshots.md). Snapshot name. -### option: ScreenshotAssertions.toMatchSnapshot.pixelCount = %%-assertions-pixel-count-%% +### option: ScreenshotAssertions.toMatchSnapshot.maxDiffPixels = %%-assertions-max-diff-pixels-%% -### option: ScreenshotAssertions.toMatchSnapshot.pixelRatio = %%-assertions-pixel-ratio-%% +### option: ScreenshotAssertions.toMatchSnapshot.maxDiffPixelRatio = %%-assertions-max-diff-pixel-ratio-%% ### option: ScreenshotAssertions.toMatchSnapshot.threshold = %%-assertions-threshold-%% diff --git a/docs/src/api/params.md b/docs/src/api/params.md index 691eebcfa5..4ccafbdb4d 100644 --- a/docs/src/api/params.md +++ b/docs/src/api/params.md @@ -715,15 +715,15 @@ Time to retry the assertion for. Defaults to `timeout` in `TestConfig.expect`. Time to retry the assertion for. -## assertions-pixel-count +## assertions-max-diff-pixels * langs: js -- `pixelCount` <[int]> +- `maxDiffPixels` <[int]> An acceptable amount of pixels that could be different, unset by default. -## assertions-pixel-ratio +## assertions-max-diff-pixel-ratio * langs: js -- `pixelRatio` <[float]> +- `maxDiffPixelRatio` <[float]> An acceptable ratio of pixels that are different to the total amount of pixels, between `0` and `1`, unset by default. @@ -731,7 +731,7 @@ An acceptable ratio of pixels that are different to the total amount of pixels, * langs: js - `threshold` <[float]> -An acceptable percieved color difference in the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) between pixels in compared images, between zero (strict) and one (lax), default is configurable with `TestConfig.expect`. Defaults to `0.2`. +An acceptable percieved color difference in the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) between the same pixel in compared images, between zero (strict) and one (lax), default is configurable with `TestConfig.expect`. Defaults to `0.2`. ## shared-context-params-list - %%-context-option-acceptdownloads-%% diff --git a/docs/src/test-api/class-testconfig.md b/docs/src/test-api/class-testconfig.md index f006b212e9..44dcabd0d1 100644 --- a/docs/src/test-api/class-testconfig.md +++ b/docs/src/test-api/class-testconfig.md @@ -37,9 +37,9 @@ export default config; - type: <[Object]> - `timeout` <[int]> Default timeout for async expect matchers in milliseconds, defaults to 5000ms. - `toMatchSnapshot` <[Object]> - - `threshold` <[float]> an acceptable percieved color difference in the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) between pixels in compared images, between zero (strict) and one (lax). Defaults to `0.2`. - - `pixelCount` <[int]> an acceptable amount of pixels that could be different, unset by default. - - `pixelRatio` <[float]> an acceptable ratio of pixels that are different to the total amount of pixels, between `0` and `1` , unset by default. + - `threshold` <[float]> an acceptable percieved color difference in the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) between the same pixel in compared images, between zero (strict) and one (lax). Defaults to `0.2`. + - `maxDiffPixels` <[int]> an acceptable amount of pixels that could be different, unset by default. + - `maxDiffPixelRatio` <[float]> an acceptable ratio of pixels that are different to the total amount of pixels, between `0` and `1` , unset by default. Configuration for the `expect` assertion library. Learn more about [various timeouts](./test-timeouts.md). diff --git a/docs/src/test-api/class-testproject.md b/docs/src/test-api/class-testproject.md index 65572c3fe2..9292a90913 100644 --- a/docs/src/test-api/class-testproject.md +++ b/docs/src/test-api/class-testproject.md @@ -108,9 +108,9 @@ export default config; - type: <[Object]> - `timeout` <[int]> Default timeout for async expect matchers in milliseconds, defaults to 5000ms. - `toMatchSnapshot` <[Object]> - - `threshold` <[float]> an acceptable percieved color difference in the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) between pixels in compared images, between zero (strict) and one (lax). Defaults to `0.2`. - - `pixelCount` <[int]> an acceptable amount of pixels that could be different, unset by default. - - `pixelRatio` <[float]> an acceptable ratio of pixels that are different to the total amount of pixels, between `0` and `1` , unset by default. + - `threshold` <[float]> an acceptable percieved color difference in the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) between the same pixel in compared images, between zero (strict) and one (lax). Defaults to `0.2`. + - `maxDiffPixels` <[int]> an acceptable amount of pixels that could be different, unset by default. + - `maxDiffPixelRatio` <[float]> an acceptable ratio of pixels that are different to the total amount of pixels, between `0` and `1` , unset by default. Configuration for the `expect` assertion library. diff --git a/docs/src/test-snapshots-js.md b/docs/src/test-snapshots-js.md index 1ca3c2c2ee..9bbf6b9da6 100644 --- a/docs/src/test-snapshots-js.md +++ b/docs/src/test-snapshots-js.md @@ -75,7 +75,7 @@ const { test, expect } = require('@playwright/test'); test('example test', async ({ page }) => { await page.goto('https://playwright.dev'); - expect(await page.screenshot()).toMatchSnapshot('home.png', { pixelCount: 100 }); + expect(await page.screenshot()).toMatchSnapshot('home.png', { maxDiffPixels: 100 }); }); ``` @@ -85,7 +85,7 @@ import { test, expect } from '@playwright/test'; test('example test', async ({ page }) => { await page.goto('https://playwright.dev'); - expect(await page.screenshot()).toMatchSnapshot('home.png', { pixelCount: 100 }); + expect(await page.screenshot()).toMatchSnapshot('home.png', { maxDiffPixels: 100 }); }); ``` @@ -94,7 +94,7 @@ If you'd like to share the default value among all the tests in the project, you ```js js-flavor=js module.exports = { expect: { - toMatchSnapshot: { pixelCount: 100 }, + toMatchSnapshot: { maxDiffPixels: 100 }, }, }; ``` @@ -103,7 +103,7 @@ module.exports = { import { PlaywrightTestConfig } from '@playwright/test'; const config: PlaywrightTestConfig = { expect: { - toMatchSnapshot: { pixelCount: 100 }, + toMatchSnapshot: { maxDiffPixels: 100 }, }, }; export default config; diff --git a/packages/playwright-core/src/protocol/channels.ts b/packages/playwright-core/src/protocol/channels.ts index c11c1000d4..4cbce6f617 100644 --- a/packages/playwright-core/src/protocol/channels.ts +++ b/packages/playwright-core/src/protocol/channels.ts @@ -1496,8 +1496,8 @@ export type PageExpectScreenshotParams = { selector: string, }, comparatorOptions?: { - pixelCount?: number, - pixelRatio?: number, + maxDiffPixels?: number, + maxDiffPixelRatio?: number, threshold?: number, }, screenshotOptions?: { @@ -1519,8 +1519,8 @@ export type PageExpectScreenshotOptions = { selector: string, }, comparatorOptions?: { - pixelCount?: number, - pixelRatio?: number, + maxDiffPixels?: number, + maxDiffPixelRatio?: number, threshold?: number, }, screenshotOptions?: { diff --git a/packages/playwright-core/src/protocol/protocol.yml b/packages/playwright-core/src/protocol/protocol.yml index ae104fce39..65531b43e6 100644 --- a/packages/playwright-core/src/protocol/protocol.yml +++ b/packages/playwright-core/src/protocol/protocol.yml @@ -1003,8 +1003,8 @@ Page: comparatorOptions: type: object? properties: - pixelCount: number? - pixelRatio: number? + maxDiffPixels: number? + maxDiffPixelRatio: number? threshold: number? screenshotOptions: type: object? diff --git a/packages/playwright-core/src/protocol/validator.ts b/packages/playwright-core/src/protocol/validator.ts index 4af2d3c350..8f42d65602 100644 --- a/packages/playwright-core/src/protocol/validator.ts +++ b/packages/playwright-core/src/protocol/validator.ts @@ -549,8 +549,8 @@ export function createScheme(tChannel: (name: string) => Validator): Scheme { selector: tString, })), comparatorOptions: tOptional(tObject({ - pixelCount: tOptional(tNumber), - pixelRatio: tOptional(tNumber), + maxDiffPixels: tOptional(tNumber), + maxDiffPixelRatio: tOptional(tNumber), threshold: tOptional(tNumber), })), screenshotOptions: tOptional(tObject({ diff --git a/packages/playwright-core/src/utils/comparators.ts b/packages/playwright-core/src/utils/comparators.ts index 3b16b670e7..4f07b1cf00 100644 --- a/packages/playwright-core/src/utils/comparators.ts +++ b/packages/playwright-core/src/utils/comparators.ts @@ -23,7 +23,7 @@ import { diff_match_patch, DIFF_INSERT, DIFF_DELETE, DIFF_EQUAL } from '../third // Note: we require the pngjs version of pixelmatch to avoid version mismatches. const { PNG } = require(require.resolve('pngjs', { paths: [require.resolve('pixelmatch')] })) as typeof import('pngjs'); -export type ImageComparatorOptions = { threshold?: number, pixelCount?: number, pixelRatio?: number }; +export type ImageComparatorOptions = { threshold?: number, maxDiffPixels?: number, maxDiffPixelRatio?: number }; export type ComparatorResult = { diff?: Buffer; errorMessage?: string; } | null; export type Comparator = (actualBuffer: Buffer | string, expectedBuffer: Buffer, options?: any) => ComparatorResult; export const mimeTypeToComparator: { [key: string]: Comparator } = { @@ -59,14 +59,14 @@ function compareImages(mimeType: string, actualBuffer: Buffer | string, expected threshold: options.threshold ?? 0.2, }); - const pixelCount1 = options.pixelCount; - const pixelCount2 = options.pixelRatio !== undefined ? expected.width * expected.height * options.pixelRatio : undefined; - let pixelCount; - if (pixelCount1 !== undefined && pixelCount2 !== undefined) - pixelCount = Math.min(pixelCount1, pixelCount2); + const maxDiffPixels1 = options.maxDiffPixels; + const maxDiffPixels2 = options.maxDiffPixelRatio !== undefined ? expected.width * expected.height * options.maxDiffPixelRatio : undefined; + let maxDiffPixels; + if (maxDiffPixels1 !== undefined && maxDiffPixels2 !== undefined) + maxDiffPixels = Math.min(maxDiffPixels1, maxDiffPixels2); else - pixelCount = pixelCount1 ?? pixelCount2 ?? 0; - return count > pixelCount ? { diff: PNG.sync.write(diff) } : null; + maxDiffPixels = maxDiffPixels1 ?? maxDiffPixels2 ?? 0; + return count > maxDiffPixels ? { diff: PNG.sync.write(diff) } : null; } function compareText(actual: Buffer | string, expectedBuffer: Buffer): ComparatorResult { diff --git a/packages/playwright-test/src/matchers/toMatchSnapshot.ts b/packages/playwright-test/src/matchers/toMatchSnapshot.ts index 777d5baa8b..ac4467446d 100644 --- a/packages/playwright-test/src/matchers/toMatchSnapshot.ts +++ b/packages/playwright-test/src/matchers/toMatchSnapshot.ts @@ -80,11 +80,11 @@ class SnapshotHelper { ...options, }; - if (options.pixelCount !== undefined && options.pixelCount < 0) - throw new Error('`pixelCount` option value must be non-negative integer'); + if (options.maxDiffPixels !== undefined && options.maxDiffPixels < 0) + throw new Error('`maxDiffPixels` option value must be non-negative integer'); - if (options.pixelRatio !== undefined && (options.pixelRatio < 0 || options.pixelRatio > 1)) - throw new Error('`pixelRatio` option value must be between 0 and 1'); + if (options.maxDiffPixelRatio !== undefined && (options.maxDiffPixelRatio < 0 || options.maxDiffPixelRatio > 1)) + throw new Error('`maxDiffPixelRatio` option value must be between 0 and 1'); // sanitizes path if string const pathSegments = Array.isArray(name) ? name : [addSuffixToFilePath(name, '', undefined, true)]; @@ -111,8 +111,8 @@ class SnapshotHelper { this.updateSnapshots = updateSnapshots; this.allOptions = options; this.comparatorOptions = { - pixelCount: options.pixelCount, - pixelRatio: options.pixelRatio, + maxDiffPixels: options.maxDiffPixels, + maxDiffPixelRatio: options.maxDiffPixelRatio, threshold: options.threshold, }; this.kind = this.mimeType.startsWith('image/') ? 'Screenshot' : 'Snapshot'; @@ -262,8 +262,8 @@ export async function toHaveScreenshot( mask: (helper.allOptions.mask || []) as LocatorEx[], name: undefined, threshold: undefined, - pixelCount: undefined, - pixelRatio: undefined, + maxDiffPixels: undefined, + maxDiffPixelRatio: undefined, }; const hasSnapshot = fs.existsSync(helper.snapshotPath); diff --git a/packages/playwright-test/types/test.d.ts b/packages/playwright-test/types/test.d.ts index b1dfffc208..8bd850bc83 100644 --- a/packages/playwright-test/types/test.d.ts +++ b/packages/playwright-test/types/test.d.ts @@ -50,11 +50,11 @@ type ExpectSettings = { /** * An acceptable amount of pixels that could be different, unset by default. */ - pixelCount?: number, + maxDiffPixels?: number, /** * An acceptable ratio of pixels that are different to the total amount of pixels, between `0` and `1` , unset by default. */ - pixelRatio?: number, + maxDiffPixelRatio?: number, } }; diff --git a/packages/playwright-test/types/testExpect.d.ts b/packages/playwright-test/types/testExpect.d.ts index 2410984fe4..afa24d9a47 100644 --- a/packages/playwright-test/types/testExpect.d.ts +++ b/packages/playwright-test/types/testExpect.d.ts @@ -50,8 +50,8 @@ export declare type Expect = { type ImageComparatorOptions = { threshold?: number, - pixelCount?: number, - pixelRatio?: number, + maxDiffPixels?: number, + maxDiffPixelRatio?: number, }; type Awaited = T extends PromiseLike ? U : T; diff --git a/tests/playwright-test/golden.spec.ts b/tests/playwright-test/golden.spec.ts index fcda868af4..bfa73951f4 100644 --- a/tests/playwright-test/golden.spec.ts +++ b/tests/playwright-test/golden.spec.ts @@ -79,8 +79,8 @@ test('should compile with different option combinations', async ({ runTSC }) => test('is a test', async ({ page }) => { expect('foo').toMatchSnapshot(); expect('foo').toMatchSnapshot({ threshold: 0.2 }); - expect('foo').toMatchSnapshot({ pixelRatio: 0.2 }); - expect('foo').toMatchSnapshot({ pixelCount: 0.2 }); + expect('foo').toMatchSnapshot({ maxDiffPixelRatio: 0.2 }); + expect('foo').toMatchSnapshot({ maxDiffPixels: 0.2 }); }); ` }); @@ -396,35 +396,35 @@ test('should compare binary', async ({ runInlineTest }) => { expect(result.exitCode).toBe(0); }); -test('should throw for invalid pixelCount values', async ({ runInlineTest }) => { +test('should throw for invalid maxDiffPixels values', async ({ runInlineTest }) => { expect((await runInlineTest({ ...files, 'a.spec.js': ` const { test } = require('./helper'); test('is a test', ({}) => { expect(Buffer.from([1,2,3,4])).toMatchSnapshot({ - pixelCount: -1, + maxDiffPixels: -1, }); }); ` })).exitCode).toBe(1); }); -test('should throw for invalid pixelRatio values', async ({ runInlineTest }) => { +test('should throw for invalid maxDiffPixelRatio values', async ({ runInlineTest }) => { expect((await runInlineTest({ ...files, 'a.spec.js': ` const { test } = require('./helper'); test('is a test', ({}) => { expect(Buffer.from([1,2,3,4])).toMatchSnapshot({ - pixelRatio: 12, + maxDiffPixelRatio: 12, }); }); ` })).exitCode).toBe(1); }); -test('should respect pixelCount option', async ({ runInlineTest }) => { +test('should respect maxDiffPixels option', async ({ runInlineTest }) => { const width = 20, height = 20; const BAD_PIXELS = 120; const image1 = createWhiteImage(width, height); @@ -448,17 +448,17 @@ test('should respect pixelCount option', async ({ runInlineTest }) => { const { test } = require('./helper'); test('is a test', ({}) => { expect(Buffer.from('${image2.toString('base64')}', 'base64')).toMatchSnapshot('snapshot.png', { - pixelCount: ${BAD_PIXELS} + maxDiffPixels: ${BAD_PIXELS} }); }); ` - })).exitCode, 'make sure pixelCount option is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixels option is respected').toBe(0); expect((await runInlineTest({ ...files, 'playwright.config.ts': ` module.exports = { projects: [ - { expect: { toMatchSnapshot: { pixelCount: ${BAD_PIXELS} } } }, + { expect: { toMatchSnapshot: { maxDiffPixels: ${BAD_PIXELS} } } }, ]}; `, 'a.spec.js-snapshots/snapshot.png': image1, @@ -468,10 +468,10 @@ test('should respect pixelCount option', async ({ runInlineTest }) => { expect(Buffer.from('${image2.toString('base64')}', 'base64')).toMatchSnapshot('snapshot.png'); }); ` - })).exitCode, 'make sure pixelCount option in project config is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixels option in project config is respected').toBe(0); }); -test('should respect pixelRatio option', async ({ runInlineTest }) => { +test('should respect maxDiffPixelRatio option', async ({ runInlineTest }) => { const width = 20, height = 20; const BAD_RATIO = 0.25; const BAD_PIXELS = Math.floor(width * height * BAD_RATIO); @@ -496,17 +496,17 @@ test('should respect pixelRatio option', async ({ runInlineTest }) => { const { test } = require('./helper'); test('is a test', ({}) => { expect(Buffer.from('${image2.toString('base64')}', 'base64')).toMatchSnapshot('snapshot.png', { - pixelRatio: ${BAD_RATIO} + maxDiffPixelRatio: ${BAD_RATIO} }); }); ` - })).exitCode, 'make sure pixelRatio option is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixelRatio option is respected').toBe(0); expect((await runInlineTest({ ...files, 'playwright.config.ts': ` module.exports = { projects: [ - { expect: { toMatchSnapshot: { pixelRatio: ${BAD_RATIO} } } }, + { expect: { toMatchSnapshot: { maxDiffPixelRatio: ${BAD_RATIO} } } }, ]}; `, 'a.spec.js-snapshots/snapshot.png': image1, @@ -516,10 +516,10 @@ test('should respect pixelRatio option', async ({ runInlineTest }) => { expect(Buffer.from('${image2.toString('base64')}', 'base64')).toMatchSnapshot('snapshot.png'); }); ` - })).exitCode, 'make sure pixelCount option in project config is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixels option in project config is respected').toBe(0); }); -test('should satisfy both pixelRatio and pixelCount', async ({ runInlineTest }) => { +test('should satisfy both maxDiffPixelRatio and maxDiffPixels', async ({ runInlineTest }) => { const width = 20, height = 20; const BAD_RATIO = 0.25; const BAD_COUNT = Math.floor(width * height * BAD_RATIO); @@ -544,12 +544,12 @@ test('should satisfy both pixelRatio and pixelCount', async ({ runInlineTest }) const { test } = require('./helper'); test('is a test', ({}) => { expect(Buffer.from('${image2.toString('base64')}', 'base64')).toMatchSnapshot('snapshot.png', { - pixelCount: ${Math.floor(BAD_COUNT / 2)}, - pixelRatio: ${BAD_RATIO}, + maxDiffPixels: ${Math.floor(BAD_COUNT / 2)}, + maxDiffPixelRatio: ${BAD_RATIO}, }); }); ` - })).exitCode, 'make sure it fails when pixelCount < actualBadPixels < pixelRatio').toBe(1); + })).exitCode, 'make sure it fails when maxDiffPixels < actualBadPixels < maxDiffPixelRatio').toBe(1); expect((await runInlineTest({ ...files, @@ -558,12 +558,12 @@ test('should satisfy both pixelRatio and pixelCount', async ({ runInlineTest }) const { test } = require('./helper'); test('is a test', ({}) => { expect(Buffer.from('${image2.toString('base64')}', 'base64')).toMatchSnapshot('snapshot.png', { - pixelCount: ${BAD_COUNT}, - pixelRatio: ${BAD_RATIO / 2}, + maxDiffPixels: ${BAD_COUNT}, + maxDiffPixelRatio: ${BAD_RATIO / 2}, }); }); ` - })).exitCode, 'make sure it fails when pixelRatio < actualBadPixels < pixelCount').toBe(1); + })).exitCode, 'make sure it fails when maxDiffPixelRatio < actualBadPixels < maxDiffPixels').toBe(1); expect((await runInlineTest({ ...files, @@ -572,12 +572,12 @@ test('should satisfy both pixelRatio and pixelCount', async ({ runInlineTest }) const { test } = require('./helper'); test('is a test', ({}) => { expect(Buffer.from('${image2.toString('base64')}', 'base64')).toMatchSnapshot('snapshot.png', { - pixelCount: ${BAD_COUNT}, - pixelRatio: ${BAD_RATIO}, + maxDiffPixels: ${BAD_COUNT}, + maxDiffPixelRatio: ${BAD_RATIO}, }); }); ` - })).exitCode, 'make sure it passes when actualBadPixels < pixelRatio && actualBadPixels < pixelCount').toBe(0); + })).exitCode, 'make sure it passes when actualBadPixels < maxDiffPixelRatio && actualBadPixels < maxDiffPixels').toBe(0); }); test('should compare PNG images', async ({ runInlineTest }) => { diff --git a/tests/playwright-test/to-have-screenshot.spec.ts b/tests/playwright-test/to-have-screenshot.spec.ts index a8ac19eea5..88e9011e28 100644 --- a/tests/playwright-test/to-have-screenshot.spec.ts +++ b/tests/playwright-test/to-have-screenshot.spec.ts @@ -212,11 +212,11 @@ test('should compile with different option combinations', async ({ runTSC }) => test('is a test', async ({ page }) => { await expect(page).toHaveScreenshot(); await expect(page.locator('body')).toHaveScreenshot({ threshold: 0.2 }); - await expect(page).toHaveScreenshot({ pixelRatio: 0.2 }); + await expect(page).toHaveScreenshot({ maxDiffPixelRatio: 0.2 }); await expect(page).toHaveScreenshot({ threshold: 0.2, - pixelCount: 10, - pixelRatio: 0.2, + maxDiffPixels: 10, + maxDiffPixelRatio: 0.2, disableAnimations: true, omitBackground: true, timeout: 1000, @@ -473,7 +473,7 @@ test('should use provided name via options', async ({ runInlineTest }) => { expect(result.exitCode).toBe(0); }); -test('should respect pixelCount option', async ({ runInlineTest }) => { +test('should respect maxDiffPixels option', async ({ runInlineTest }) => { const BAD_PIXELS = 120; const EXPECTED_SNAPSHOT = paintBlackPixels(whiteImage, BAD_PIXELS); @@ -495,17 +495,17 @@ test('should respect pixelCount option', async ({ runInlineTest }) => { const { test } = require('./helper'); test('is a test', async ({ page }) => { await expect(page).toHaveScreenshot('snapshot.png', { - pixelCount: ${BAD_PIXELS} + maxDiffPixels: ${BAD_PIXELS} }); }); ` - })).exitCode, 'make sure pixelCount option is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixels option is respected').toBe(0); expect((await runInlineTest({ ...files, 'playwright.config.ts': ` module.exports = { projects: [ - { expect: { toMatchSnapshot: { pixelCount: ${BAD_PIXELS} } } }, + { expect: { toMatchSnapshot: { maxDiffPixels: ${BAD_PIXELS} } } }, ]}; `, 'a.spec.js-snapshots/snapshot.png': EXPECTED_SNAPSHOT, @@ -515,10 +515,10 @@ test('should respect pixelCount option', async ({ runInlineTest }) => { await expect(page).toHaveScreenshot('snapshot.png'); }); ` - })).exitCode, 'make sure pixelCount option in project config is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixels option in project config is respected').toBe(0); }); -test('should respect pixelRatio option', async ({ runInlineTest }) => { +test('should respect maxDiffPixelRatio option', async ({ runInlineTest }) => { const BAD_RATIO = 0.25; const BAD_PIXELS = IMG_WIDTH * IMG_HEIGHT * BAD_RATIO; const EXPECTED_SNAPSHOT = paintBlackPixels(whiteImage, BAD_PIXELS); @@ -541,17 +541,17 @@ test('should respect pixelRatio option', async ({ runInlineTest }) => { const { test } = require('./helper'); test('is a test', async ({ page }) => { await expect(page).toHaveScreenshot('snapshot.png', { - pixelRatio: ${BAD_RATIO} + maxDiffPixelRatio: ${BAD_RATIO} }); }); ` - })).exitCode, 'make sure pixelRatio option is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixelRatio option is respected').toBe(0); expect((await runInlineTest({ ...files, 'playwright.config.ts': ` module.exports = { projects: [ - { expect: { toMatchSnapshot: { pixelRatio: ${BAD_RATIO} } } }, + { expect: { toMatchSnapshot: { maxDiffPixelRatio: ${BAD_RATIO} } } }, ]}; `, 'a.spec.js-snapshots/snapshot.png': EXPECTED_SNAPSHOT, @@ -561,7 +561,7 @@ test('should respect pixelRatio option', async ({ runInlineTest }) => { await expect(page).toHaveScreenshot('snapshot.png'); }); ` - })).exitCode, 'make sure pixelCount option in project config is respected').toBe(0); + })).exitCode, 'make sure maxDiffPixels option in project config is respected').toBe(0); }); test('should attach expected/actual and no diff when sizes are different', async ({ runInlineTest }, testInfo) => { diff --git a/utils/generate_types/overrides-test.d.ts b/utils/generate_types/overrides-test.d.ts index e46f14e319..86fdabd5be 100644 --- a/utils/generate_types/overrides-test.d.ts +++ b/utils/generate_types/overrides-test.d.ts @@ -49,11 +49,11 @@ type ExpectSettings = { /** * An acceptable amount of pixels that could be different, unset by default. */ - pixelCount?: number, + maxDiffPixels?: number, /** * An acceptable ratio of pixels that are different to the total amount of pixels, between `0` and `1` , unset by default. */ - pixelRatio?: number, + maxDiffPixelRatio?: number, } };