root
/
playwright
mirror of https://github.com/microsoft/playwright.git
1
0
Fork 0
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix: use `snapshotPath` instead of `expectedPath` for image diffs (#24567) 

This opens a road to the "accept new screenshot" button in
Playwright tools.

References https://github.com/microsoft/playwright/issues/24310
This commit is contained in:
Andrey Lushnikov 2023-08-07 04:42:35 -07:00 committed by GitHub
parent 53fd4bedb4
commit fa8f3f6454
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/playwright-test/src/matchers/toMatchSnapshot.ts
View File

@ -43,7 +43,7 @@ type SnapshotNames = {
class SnapshotHelper<T extends ImageComparatorOptions> {
readonly testInfo: TestInfoImpl;
readonly snapshotName: string;
readonly expectedPath: string;
readonly legacyExpectedPath: string;
readonly previousPath: string;
readonly snapshotPath: string;
readonly actualPath: string;
@ -126,7 +126,7 @@ class SnapshotHelper<T extends ImageComparatorOptions> {
this.snapshotPath = snapshotPathResolver(...inputPathSegments);
const inputFile = testInfo._getOutputPath(...inputPathSegments);
const outputFile = testInfo._getOutputPath(...outputPathSegments);
this.expectedPath = addSuffixToFilePath(inputFile, '-expected');
this.legacyExpectedPath = addSuffixToFilePath(inputFile, '-expected');
this.previousPath = addSuffixToFilePath(outputFile, '-previous');
this.actualPath = addSuffixToFilePath(outputFile, '-actual');
this.diffPath = addSuffixToFilePath(outputFile, '-diff');
@ -213,9 +213,11 @@ class SnapshotHelper<T extends ImageComparatorOptions> {
output.push('');
if (expected !== undefined) {
writeFileSync(this.expectedPath, expected);
this.testInfo.attachments.push({ name: addSuffixToFilePath(this.snapshotName, '-expected'), contentType: this.mimeType, path: this.expectedPath });
output.push(`Expected: ${colors.yellow(this.expectedPath)}`);
// Copy the expectation inside the `test-results/` folder for backwards compatibility,
// so that one can upload `test-results/` directory and have all the data inside.
writeFileSync(this.legacyExpectedPath, expected);
this.testInfo.attachments.push({ name: addSuffixToFilePath(this.snapshotName, '-expected'), contentType: this.mimeType, path: this.snapshotPath });
output.push(`Expected: ${colors.yellow(this.snapshotPath)}`);
}
if (previous !== undefined) {
writeFileSync(this.previousPath, previous);

10
tests/playwright-test/golden.spec.ts
View File

@ -156,7 +156,7 @@ test('should write detailed failure result to an output folder', async ({ runInl
expect(outputText).toContain('Snapshot comparison failed:');
const expectedSnapshotArtifactPath = testInfo.outputPath('test-results', 'a-is-a-test', 'snapshot-expected.txt');
const actualSnapshotArtifactPath = testInfo.outputPath('test-results', 'a-is-a-test', 'snapshot-actual.txt');
expect(outputText).toContain(`Expected: ${expectedSnapshotArtifactPath}`);
expect(outputText).toMatch(/Expected:.*a\.spec\.js-snapshots.snapshot\.txt/);
expect(outputText).toContain(`Received: ${actualSnapshotArtifactPath}`);
expect(fs.existsSync(expectedSnapshotArtifactPath)).toBe(true);
expect(fs.existsSync(actualSnapshotArtifactPath)).toBe(true);
@ -569,7 +569,7 @@ test('should compare different PNG images', async ({ runInlineTest }, testInfo)
const expectedSnapshotArtifactPath = testInfo.outputPath('test-results', 'a-is-a-test', 'snapshot-expected.png');
const actualSnapshotArtifactPath = testInfo.outputPath('test-results', 'a-is-a-test', 'snapshot-actual.png');
const diffSnapshotArtifactPath = testInfo.outputPath('test-results', 'a-is-a-test', 'snapshot-diff.png');
expect(outputText).toContain(`Expected: ${expectedSnapshotArtifactPath}`);
expect(outputText).toMatch(/Expected:.*a\.spec\.js-snapshots.snapshot\.png/);
expect(outputText).toContain(`Received: ${actualSnapshotArtifactPath}`);
expect(outputText).toContain(`Diff: ${diffSnapshotArtifactPath}`);
expect(fs.existsSync(expectedSnapshotArtifactPath)).toBe(true);
@ -877,7 +877,7 @@ test('should attach expected/actual/diff with snapshot path', async ({ runInline
{
name: 'test/path/snapshot-expected.png',
contentType: 'image/png',
path: 'a-is-a-test/test/path/snapshot-expected.png'
path: 'golden-should-attach-expected-actual-diff-with-snapshot-path-playwright-test/a.spec.js-snapshots/test/path/snapshot.png'
},
{
name: 'test/path/snapshot-actual.png',
@ -916,7 +916,7 @@ test('should attach expected/actual/diff', async ({ runInlineTest }, testInfo) =
{
name: 'snapshot-expected.png',
contentType: 'image/png',
path: 'a-is-a-test/snapshot-expected.png'
path: 'golden-should-attach-expected-actual-diff-playwright-test/a.spec.js-snapshots/snapshot.png'
},
{
name: 'snapshot-actual.png',
@ -957,7 +957,7 @@ test('should attach expected/actual/diff for different sizes', async ({ runInlin
{
name: 'snapshot-expected.png',
contentType: 'image/png',
path: 'a-is-a-test/snapshot-expected.png'
path: 'golden-should-attach-expected-actual-diff-for-different-sizes-playwright-test/a.spec.js-snapshots/snapshot.png'
},
{
name: 'snapshot-actual.png',

2
tests/playwright-test/reporter-html.spec.ts
View File

@ -195,7 +195,7 @@ for (const useIntermediateMergeReport of [false, true] as const) {
await page.click('text=fails');
await expect(page.locator('text=Image mismatch')).toHaveCount(2);
await expect(page.locator('text=Snapshot mismatch')).toHaveCount(0);
await expect(page.locator('text=Screenshots')).toHaveCount(0);
await expect(page.locator('text="Screenshots"')).toHaveCount(0);
for (let i = 0; i < 2; ++i) {
const imageDiff = page.locator('data-testid=test-result-image-mismatch').nth(i);
const image = imageDiff.locator('img').first();

2
tests/playwright-test/to-have-screenshot.spec.ts
View File

@ -1041,7 +1041,7 @@ test('should attach expected/actual/diff when sizes are different', async ({ run
{
name: 'snapshot-expected.png',
contentType: 'image/png',
path: 'a-is-a-test/snapshot-expected.png'
path: 'to-have-screenshot-should-attach-expected-actual-diff-when-sizes-are-different-playwright-test/__screenshots__/a.spec.js/snapshot.png',
},
{
name: 'snapshot-actual.png',