chore: highlight "view trace" on failing tests (#35342)

This commit is contained in:
Simon Knott 2025-03-26 16:27:48 +01:00 committed by GitHub
parent 97a542c334
commit febb95a638
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 20 additions and 5 deletions

View File

@ -63,6 +63,10 @@
fill: var(--color-fg-muted);
}
.test-file-badge.button {
background-color: transparent;
}
.test-file-test-outcome-skipped {
color: var(--color-fg-muted);
}

View File

@ -87,7 +87,18 @@ function videoBadge(test: TestCaseSummary): JSX.Element | undefined {
function traceBadge(test: TestCaseSummary): JSX.Element | undefined {
const firstTraces = test.results.map(result => result.attachments.filter(attachment => attachment.name === 'trace')).filter(traces => traces.length > 0)[0];
return firstTraces ? <Link href={generateTraceUrl(firstTraces)} title='View trace' className='test-file-badge'>{trace()}</Link> : undefined;
if (!firstTraces)
return undefined;
const isFailed = test.outcome === 'unexpected' || test.outcome === 'flaky';
return <Link
href={generateTraceUrl(firstTraces)}
title={isFailed ? 'View Failing Trace' : 'View Trace'}
className={clsx('test-file-badge', isFailed && 'button')}>
{trace()}
{isFailed && <span style={{ color: 'var(--color-scale-gray-7)' }}>View Failing Trace</span>}
</Link>;
}
const LabelsClickView: React.FC<React.PropsWithChildren<{

View File

@ -706,7 +706,7 @@ test('generate html with attachment urls', async ({ runInlineTest, mergeReports,
await page.goBack();
// Check that trace loads.
await page.locator('div').filter({ hasText: /^a\.test\.js:13$/ }).getByRole('link', { name: 'View trace' }).click();
await page.getByRole('link', { name: 'View Failing Trace' }).click();
await expect(page).toHaveTitle('Playwright Trace Viewer');
await expect(page.getByTestId('actions-tree').locator('div').filter({ hasText: /^expect\.toBe$/ })).toBeVisible();
});

View File

@ -619,7 +619,7 @@ for (const useIntermediateMergeReport of [true, false] as const) {
expect(result.passed).toBe(1);
await showReport();
await page.getByRole('link', { name: 'View trace' }).click();
await page.getByRole('link', { name: 'View Trace' }).click();
// Trace viewer should not hang here when displaying parallal requests.
await expect(page.getByTestId('actions-tree')).toContainText('apiRequestContext.get');
@ -645,14 +645,14 @@ for (const useIntermediateMergeReport of [true, false] as const) {
await test.step('view via server', async () => {
await showReport();
await page.locator('[title="View trace"]').click();
await page.getByRole('link', { name: 'View Trace' }).click();
await expect(page.locator('dialog')).toBeHidden();
});
await test.step('view via local file://', async () => {
const reportFolder = testInfo.outputPath('playwright-report');
await page.goto(url.pathToFileURL(path.join(reportFolder, 'index.html')).toString());
await page.locator('[title="View trace"]').click();
await page.getByRole('link', { name: 'View Trace' }).click();
await expect(page.locator('dialog')).toBeVisible();
await expect(page.locator('dialog')).toContainText('must be loaded over');
});