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

fix(html reporter): skip img bits with non-images (#11188)

Browse source
This commit is contained in:
Ross Wollman 2022-01-05 09:04:08 -08:00 committed by GitHub
parent 328f3e265e
commit 3a4b7fa792
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 33 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
packages/html-reporter/src/testResultView.tsx
View file

@ -49,6 +49,7 @@ export const TestResultView: React.FC<{
const expected = attachmentsMap.get('expected'); const expected = attachmentsMap.get('expected');
const actual = attachmentsMap.get('actual'); const actual = attachmentsMap.get('actual');
const diff = attachmentsMap.get('diff'); const diff = attachmentsMap.get('diff');
const hasImages = [actual?.contentType, expected?.contentType, diff?.contentType].some(v => v && /^image\//i.test(v));
return <div className='test-result'> return <div className='test-result'>
{result.error && <AutoChip header='Errors'> {result.error && <AutoChip header='Errors'>
<ErrorMessage key='test-result-error-message' error={result.error}></ErrorMessage> <ErrorMessage key='test-result-error-message' error={result.error}></ErrorMessage>
@ -57,8 +58,8 @@ export const TestResultView: React.FC<{
{result.steps.map((step, i) => <StepTreeItem key={`step-${i}`} step={step} depth={0}></StepTreeItem>)} {result.steps.map((step, i) => <StepTreeItem key={`step-${i}`} step={step} depth={0}></StepTreeItem>)}
</AutoChip>} </AutoChip>}
{expected && actual && <AutoChip header='Image mismatch'> {expected && actual && <AutoChip header={`${hasImages ? 'Image' : 'Snapshot'} mismatch`}>
<ImageDiff actual={actual} expected={expected} diff={diff}></ImageDiff> {hasImages && <ImageDiff actual={actual} expected={expected} diff={diff}></ImageDiff>}
<AttachmentLink key={`expected`} attachment={expected}></AttachmentLink> <AttachmentLink key={`expected`} attachment={expected}></AttachmentLink>
<AttachmentLink key={`actual`} attachment={actual}></AttachmentLink> <AttachmentLink key={`actual`} attachment={actual}></AttachmentLink>
{diff && <AttachmentLink key={`diff`} attachment={diff}></AttachmentLink>} {diff && <AttachmentLink key={`diff`} attachment={diff}></AttachmentLink>}

30
tests/playwright-test/reporter-html.spec.ts
View file

@ -114,6 +114,8 @@ test('should include image diff', async ({ runInlineTest, page, showReport }) =>
await showReport(); await showReport();
await page.click('text=fails'); await page.click('text=fails');
await expect(page.locator('text=Image mismatch')).toBeVisible();
await expect(page.locator('text=Snapshot mismatch')).toHaveCount(0);
const imageDiff = page.locator('data-testid=test-result-image-mismatch'); const imageDiff = page.locator('data-testid=test-result-image-mismatch');
const image = imageDiff.locator('img'); const image = imageDiff.locator('img');
await expect(image).toHaveAttribute('src', /.*png/); await expect(image).toHaveAttribute('src', /.*png/);
@ -126,6 +128,34 @@ test('should include image diff', async ({ runInlineTest, page, showReport }) =>
expect(set.size).toBe(3); expect(set.size).toBe(3);
}); });
test('should not include image diff with non-images', async ({ runInlineTest, page, showReport }) => {
const expected = Buffer.from('iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAAhVJREFUeJzt07ERwCAQwLCQ/Xd+FuDcQiFN4MZrZuYDjv7bAfAyg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAgEg0AwCASDQDAIBINAMAiEDVPZBYx6ffy+AAAAAElFTkSuQmCC', 'base64');
const result = await runInlineTest({
'playwright.config.ts': `
module.exports = { use: { viewport: { width: 200, height: 200 }} };
`,
'a.test.js-snapshots/expected-linux': expected,
'a.test.js-snapshots/expected-darwin': expected,
'a.test.js-snapshots/expected-win32': expected,
'a.test.js': `
const { test } = pwt;
test('fails', async ({ page }, testInfo) => {
await page.setContent('<html>Hello World</html>');
const screenshot = await page.screenshot();
await expect(screenshot).toMatchSnapshot('expected');
});
`,
}, { reporter: 'dot,html' });
expect(result.exitCode).toBe(1);
expect(result.failed).toBe(1);
await showReport();
await page.click('text=fails');
await expect(page.locator('text=Snapshot mismatch')).toBeVisible();
await expect(page.locator('text=Image mismatch')).toHaveCount(0);
await expect(page.locator('img')).toHaveCount(0);
});
test('should include screenshot on failure', async ({ runInlineTest, page, showReport }) => { test('should include screenshot on failure', async ({ runInlineTest, page, showReport }) => {
const result = await runInlineTest({ const result = await runInlineTest({
'playwright.config.ts': ` 'playwright.config.ts': `