Skip to content

Commit 3814b3d

Browse files
committed
feat(utils): use table.title as heading when formatting audit details
1 parent 5b29ebd commit 3814b3d

File tree

5 files changed

+18
-29
lines changed

5 files changed

+18
-29
lines changed

packages/utils/src/lib/reports/__snapshots__/generate-md-report.unit.test.ts.snap

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,6 @@ exports[`auditDetails > should render complete details section 1`] = `
1919
"<details>
2020
<summary>🟩 <b>190ms</b> (score: 99)</summary>
2121
22-
#### Additional Information
23-
2422
|Class Names|Element|
2523
|:--:|:--:|
2624
|.btn, .icon|button|
@@ -106,8 +104,6 @@ exports[`generateMdReport > should render complete md report 1`] = `
106104
<details>
107105
<summary>🟨 <b>2,7 s</b> (score: 67)</summary>
108106
109-
#### Additional Information
110-
111107
|Phase|% of LCP|Timing|
112108
|:--:|:--|--:|
113109
|TTFB|27%|620 ms|

packages/utils/src/lib/reports/formatting.ts

Lines changed: 11 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -4,28 +4,22 @@ import { Hierarchy, NEW_LINE, SPACE, md } from '../text-formats';
44
const { headline, lines, link, section, table } = md;
55

66
export function tableSection(
7-
tableData: Table | undefined,
8-
options?:
9-
| {
10-
heading?: string;
11-
level?: Hierarchy | 0;
12-
}
13-
| string,
14-
): string {
15-
if (tableData == null) {
16-
return '';
17-
}
7+
tableData: Table,
8+
options?: {
9+
level?: Hierarchy | 0;
10+
},
11+
) {
1812
if (tableData.rows.length === 0) {
1913
return '';
2014
}
21-
const { heading, level = 4 } =
22-
typeof options === 'string'
23-
? { heading: options, level: 0 }
24-
: options ?? {};
15+
const { level = 4 } = options ?? {};
2516
// if hierarchy is 0 do not apply heading styles
2617
const render = (h: string, l: Hierarchy | 0) =>
27-
l === 0 ? heading : headline(h, l);
28-
return lines(heading ? render(heading, level) : false, table(tableData));
18+
l === 0 ? h : headline(h, l);
19+
return lines(
20+
tableData.title && render(tableData.title, level),
21+
table(tableData),
22+
);
2923
}
3024

3125
// @TODO extract `Pick<AuditReport, 'docsUrl' | 'description'>` to a reusable schema and type

packages/utils/src/lib/reports/formatting.unit.test.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ describe('tableSection', () => {
77
expect(
88
tableSection(
99
{
10+
title: 'LCP Breakdown',
1011
columns: [
1112
{ key: 'phase', label: 'Phase' },
1213
{ key: 'percentageLcp', label: '% of LCP', align: 'left' },
@@ -35,7 +36,7 @@ describe('tableSection', () => {
3536
},
3637
],
3738
},
38-
{ heading: 'LCP Breakdown', level: 3 },
39+
{ level: 3 },
3940
),
4041
).toMatchSnapshot();
4142
});

packages/utils/src/lib/reports/generate-md-report.ts

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ export function auditDetailsIssues(issues: Issue[] = []) {
5151
return '';
5252
}
5353
const detailsTableData = {
54+
title: 'Issues',
5455
columns: issuesTableHeadings,
5556
rows: issues.map(
5657
({ severity: severityVal, message, source: sourceVal }: Issue) => {
@@ -73,7 +74,7 @@ export function auditDetailsIssues(issues: Issue[] = []) {
7374
),
7475
};
7576

76-
return tableSection(detailsTableData, { heading: 'Issues' });
77+
return tableSection(detailsTableData);
7778
}
7879

7980
export function auditDetails(audit: AuditReport) {
@@ -85,10 +86,7 @@ export function auditDetails(audit: AuditReport) {
8586
return section(detailsValue);
8687
}
8788

88-
const tableSectionContent =
89-
table == null
90-
? ''
91-
: tableSection(table, { heading: 'Additional Information' });
89+
const tableSectionContent = table == null ? '' : tableSection(table);
9290
const issuesSectionContent =
9391
issues.length > 0 ? auditDetailsIssues(issues) : '';
9492

packages/utils/src/lib/reports/generate-md-report.unit.test.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -257,6 +257,7 @@ describe('auditDetails', () => {
257257
displayValue: '190ms',
258258
details: {
259259
table: {
260+
title: 'Elements',
260261
rows: [
261262
{
262263
element: 'button',
@@ -269,7 +270,7 @@ describe('auditDetails', () => {
269270
},
270271
} as AuditReport);
271272
expect(md).toMatch('<details>');
272-
expect(md).toMatch('#### Additional Information');
273+
expect(md).toMatch('#### Elements');
273274
expect(md).toMatch('|button|');
274275
expect(md).toMatch('|div|');
275276
expect(md).not.toMatch('#### Issues');
@@ -364,7 +365,6 @@ describe('auditsSection', () => {
364365
} as unknown as ScoredReport);
365366
expect(md).toMatch('#### Issues');
366367
expect(md).toMatch('|Severity|Message|Source file|Line(s)|');
367-
expect(md).toMatch('#### Additional Information');
368368
expect(md).toMatch('|value|');
369369
});
370370

0 commit comments

Comments
 (0)