fix(html reporter): skip img bits with non-images (#11188)
This commit is contained in:
parent
328f3e265e
commit
3a4b7fa792
|
|
@ -49,6 +49,7 @@ export const TestResultView: React.FC<{
|
|||
const expected = attachmentsMap.get('expected');
|
||||
const actual = attachmentsMap.get('actual');
|
||||
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'>
|
||||
{result.error && <AutoChip header='Errors'>
|
||||
<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>)}
|
||||
</AutoChip>}
|
||||
|
||||
{expected && actual && <AutoChip header='Image mismatch'>
|
||||
<ImageDiff actual={actual} expected={expected} diff={diff}></ImageDiff>
|
||||
{expected && actual && <AutoChip header={`${hasImages ? 'Image' : 'Snapshot'} mismatch`}>
|
||||
{hasImages && <ImageDiff actual={actual} expected={expected} diff={diff}></ImageDiff>}
|
||||
<AttachmentLink key={`expected`} attachment={expected}></AttachmentLink>
|
||||
<AttachmentLink key={`actual`} attachment={actual}></AttachmentLink>
|
||||
{diff && <AttachmentLink key={`diff`} attachment={diff}></AttachmentLink>}
|
||||
|
|
|
|||
|
|
@ -114,6 +114,8 @@ test('should include image diff', async ({ runInlineTest, page, showReport }) =>
|
|||
|
||||
await showReport();
|
||||
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 image = imageDiff.locator('img');
|
||||
await expect(image).toHaveAttribute('src', /.*png/);
|
||||
|
|
@ -126,6 +128,34 @@ test('should include image diff', async ({ runInlineTest, page, showReport }) =>
|
|||
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 }) => {
|
||||
const result = await runInlineTest({
|
||||
'playwright.config.ts': `
|
||||
|
|
|
|||
Loading…
Reference in a new issue