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

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

Browse source 
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
Show stats Download patch file Download diff file Expand all files Collapse all files

24
packages/html-reporter/src/testCaseView.tsx
View file

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

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

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