Revert "feat(html reporter): render multiple annotations of the same type together (#21580)" (#22466)

Fixes https://github.com/microsoft/playwright/issues/22323
This commit is contained in:
Max Schmitt 2023-04-18 20:43:07 +02:00 committed by GitHub
parent be79ee0450
commit 49c9284bc7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 28 deletions

View file

@ -14,7 +14,7 @@
limitations under the License.
*/
import type { TestCase } from './types';
import type { TestCase, TestCaseAnnotation } from './types';
import * as React from 'react';
import { TabbedPane } from './tabbedPane';
import { AutoChip } from './chip';
@ -33,12 +33,6 @@ export const TestCaseView: React.FC<{
}> = ({ projectNames, test, run, anchor }) => {
const [selectedResultIndex, setSelectedResultIndex] = React.useState(run);
const annotations = new Map<string, (string | undefined)[]>();
test?.annotations.forEach(annotation => {
const list = annotations.get(annotation.type) || [];
list.push(annotation.description);
annotations.set(annotation.type, list);
});
const labels = React.useMemo(() => {
if (!test)
return undefined;
@ -50,11 +44,11 @@ export const TestCaseView: React.FC<{
{test && <div className='test-case-title'>{test?.title}</div>}
{test && <div className='test-case-location'>{test.location.file}:{test.location.line}</div>}
{test && (!!test.projectName || labels) && <div className='test-case-project-labels-row'>
{!!test.projectName && <ProjectLink projectNames={projectNames} projectName={test.projectName}></ProjectLink>}
{test && !!test.projectName && <ProjectLink projectNames={projectNames} projectName={test.projectName}></ProjectLink>}
{labels && <LabelsLinkView labels={labels} />}
</div>}
{annotations.size > 0 && <AutoChip header='Annotations'>
{[...annotations].map(annotation => <TestCaseAnnotationView type={annotation[0]} descriptions={annotation[1]} />)}
{test && !!test.annotations.length && <AutoChip header='Annotations'>
{test?.annotations.map(annotation => <TestCaseAnnotationView annotation={annotation} />)}
</AutoChip>}
{test && <TabbedPane tabs={
test.results.map((result, index) => ({
@ -73,17 +67,11 @@ function renderAnnotationDescription(description: string) {
return description;
}
function TestCaseAnnotationView({ type, descriptions }: { type: string, descriptions: (string | undefined)[] }) {
const filteredDescriptions = descriptions.filter(Boolean) as string[];
function TestCaseAnnotationView({ annotation: { type, description } }: { annotation: TestCaseAnnotation }) {
return (
<div className='test-case-annotation'>
<span style={{ fontWeight: 'bold' }}>{type}</span>
{!!filteredDescriptions.length && <span>: {filteredDescriptions.map((d, i) => {
const rendered = renderAnnotationDescription(d);
if (i < filteredDescriptions.length - 1)
return <>{rendered}, </>;
return rendered;
})}</span>}
{description && <span>: {renderAnnotationDescription(description)}</span>}
</div>
);
}

View file

@ -602,11 +602,6 @@ test('should render annotations', async ({ runInlineTest, page, showReport }) =>
'a.test.js': `
import { test, expect } from '@playwright/test';
test('skipped test', async ({ page }) => {
test.info().annotations.push({ type: 'issue', description: '#123'});
test.info().annotations.push({ type: 'issue', description: '#456'});
test.info().annotations.push({ type: 'issue', description: 'https://playwright.dev'});
test.info().annotations.push({ type: 'issue' });
test.info().annotations.push({ type: 'empty' });
test.skip(true, 'I am not interested in this test');
});
`,
@ -616,11 +611,7 @@ test('should render annotations', async ({ runInlineTest, page, showReport }) =>
await showReport();
await page.click('text=skipped test');
await expect(page.locator('.test-case-annotation')).toHaveText([
'issue: #123, #456, https://playwright.dev',
'empty',
'skip: I am not interested in this test',
]);
await expect(page.locator('.test-case-annotation')).toHaveText('skip: I am not interested in this test');
});
test('should render annotations as link if needed', async ({ runInlineTest, page, showReport, server }) => {