Skip to content

Commit 522fd66

Browse files
matejchalkmatejchalk
committed
feat(utils): replace @poppinss/cliui table for printing categories
1 parent 823766b commit 522fd66

File tree

7 files changed

+81
-110
lines changed

7 files changed

+81
-110
lines changed

‎packages/utils/src/lib/reports/__snapshots__/report-stdout-all-perfect-scores.txt‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,13 @@ Lighthouse audits
1717

1818
Categories
1919

20-
┌─────────────────────────────────────────────────────────┬─────────┬──────────┐
21-
│ Category │ Score │ Audits │
22-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
23-
│ Performance │ 92 │ 8 │
24-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
25-
│ Bug prevention │ 100 │ 16 │
26-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
27-
│ Code style │ 100 │ 13 │
28-
└─────────────────────────────────────────────────────────┴─────────┴──────────┘
20+
┌──────────────────┬─────────┬──────────┐
21+
│ Category │ Score │ Audits │
22+
├──────────────────┼─────────┼──────────┤
23+
│ Performance │ 92 │ 8 │
24+
│ Bug prevention │ 100 │ 16 │
25+
│ Code style │ 100 │ 13 │
26+
└──────────────────┴─────────┴──────────┘
2927

3028
Made with ❤ by code-pushup.dev
3129

‎packages/utils/src/lib/reports/__snapshots__/report-stdout-verbose.txt‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -73,15 +73,13 @@ Lighthouse audits
7373

7474
Categories
7575

76-
┌─────────────────────────────────────────────────────────┬─────────┬──────────┐
77-
│ Category │ Score │ Audits │
78-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
79-
│ Performance │ 92 │ 8 │
80-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
81-
│ Bug prevention │ 68 │ 16 │
82-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
83-
│ Code style │ 54 │ 13 │
84-
└─────────────────────────────────────────────────────────┴─────────┴──────────┘
76+
┌──────────────────┬─────────┬──────────┐
77+
│ Category │ Score │ Audits │
78+
├──────────────────┼─────────┼──────────┤
79+
│ Performance │ 92 │ 8 │
80+
│ Bug prevention │ 68 │ 16 │
81+
│ Code style │ 54 │ 13 │
82+
└──────────────────┴─────────┴──────────┘
8583

8684
Made with ❤ by code-pushup.dev
8785

‎packages/utils/src/lib/reports/__snapshots__/report-stdout.txt‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -31,15 +31,13 @@ Lighthouse audits
3131

3232
Categories
3333

34-
┌─────────────────────────────────────────────────────────┬─────────┬──────────┐
35-
│ Category │ Score │ Audits │
36-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
37-
│ Performance │ 92 │ 8 │
38-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
39-
│ Bug prevention │ 68 │ 16 │
40-
├─────────────────────────────────────────────────────────┼─────────┼──────────┤
41-
│ Code style │ 54 │ 13 │
42-
└─────────────────────────────────────────────────────────┴─────────┴──────────┘
34+
┌──────────────────┬─────────┬──────────┐
35+
│ Category │ Score │ Audits │
36+
├──────────────────┼─────────┼──────────┤
37+
│ Performance │ 92 │ 8 │
38+
│ Bug prevention │ 68 │ 16 │
39+
│ Code style │ 54 │ 13 │
40+
└──────────────────┴─────────┴──────────┘
4341

4442
Made with ❤ by code-pushup.dev
4543

‎packages/utils/src/lib/reports/constants.ts‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,4 @@ export const REPORT_HEADLINE_TEXT = 'Code PushUp Report';
1414

1515
export const CODE_PUSHUP_UNICODE_LOGO = '<✓>';
1616

17-
export const REPORT_RAW_OVERVIEW_TABLE_HEADERS = [
18-
'Category',
19-
'Score',
20-
'Audits',
21-
];
22-
2317
export const AUDIT_DETAILS_HEADING_LEVEL = HIERARCHY.level_4;

‎packages/utils/src/lib/reports/log-stdout-summary.int.test.ts‎

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { beforeAll, describe, expect, vi } from 'vitest';
22
import { removeColorCodes, reportMock } from '@code-pushup/test-utils';
33
import { logger } from '../logger.js';
4-
import { ui } from '../logging.js';
54
import { logStdoutSummary } from './log-stdout-summary.js';
65
import { scoreReport } from './scoring.js';
76
import { sortReport } from './sorting.js';
@@ -16,23 +15,13 @@ describe('logStdoutSummary', () => {
1615
vi.mocked(logger.newline).mockImplementation(() => {
1716
stdout += '\n';
1817
});
19-
// console.log is used inside the @poppinss/cliui logger when in "normal" mode
20-
vi.spyOn(console, 'log').mockImplementation(message => {
21-
stdout += `${message}\n`;
22-
});
23-
// we want to see table and sticker logs in the final style ("raw" don't show borders etc so we use `console.log` here)
24-
ui().switchMode('normal');
2518
});
2619

2720
beforeEach(() => {
2821
stdout = '';
2922
logger.setVerbose(false);
3023
});
3124

32-
afterAll(() => {
33-
ui().switchMode('raw');
34-
});
35-
3625
it('should contain all sections when using the fixture report', async () => {
3726
logStdoutSummary(sortReport(scoreReport(reportMock())));
3827

‎packages/utils/src/lib/reports/log-stdout-summary.ts‎

Lines changed: 16 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,11 @@
11
import ansis from 'ansis';
22
import type { AuditReport } from '@code-pushup/models';
33
import { logger } from '../logger.js';
4-
import { ui } from '../logging.js';
54
import { formatAsciiTable } from '../text-formats/ascii/table.js';
6-
import { TERMINAL_WIDTH } from '../text-formats/constants.js';
75
import {
86
CODE_PUSHUP_DOMAIN,
97
FOOTER_PREFIX,
108
REPORT_HEADLINE_TEXT,
11-
REPORT_RAW_OVERVIEW_TABLE_HEADERS,
129
} from './constants.js';
1310
import type { ScoredReport } from './types.js';
1411
import {
@@ -92,35 +89,25 @@ export function logCategories({
9289
plugins,
9390
categories,
9491
}: Required<Pick<ScoredReport, 'plugins' | 'categories'>>): void {
95-
const hAlign = (idx: number) => (idx === 0 ? 'left' : 'right');
96-
97-
const rows = categories.map(({ title, score, scoreTarget, refs }) => [
98-
title,
99-
`${binaryIconPrefix(score, scoreTarget)}${applyScoreColor({ score })}`,
100-
countCategoryAudits(refs, plugins),
101-
]);
102-
// TODO: replace @poppinss/cliui
103-
const table = ui().table();
104-
// eslint-disable-next-line @typescript-eslint/no-magic-numbers
105-
table.columnWidths([TERMINAL_WIDTH - 9 - 10 - 4, 9, 10]);
106-
table.head(
107-
REPORT_RAW_OVERVIEW_TABLE_HEADERS.map((heading, idx) => ({
108-
content: ansis.cyan(heading),
109-
hAlign: hAlign(idx),
110-
})),
111-
);
112-
rows.forEach(row =>
113-
table.row(
114-
row.map((content, idx) => ({
115-
content: content.toString(),
116-
hAlign: hAlign(idx),
117-
})),
92+
logger.info(
93+
formatAsciiTable(
94+
{
95+
title: ansis.bold.magentaBright('Categories'),
96+
columns: [
97+
{ key: 'title', label: ansis.cyan('Category'), align: 'left' },
98+
{ key: 'score', label: ansis.cyan('Score'), align: 'right' },
99+
{ key: 'audits', label: ansis.cyan('Audits'), align: 'right' },
100+
],
101+
rows: categories.map(({ title, score, scoreTarget, refs }) => ({
102+
title,
103+
score: `${binaryIconPrefix(score, scoreTarget)}${applyScoreColor({ score })}`,
104+
audits: countCategoryAudits(refs, plugins),
105+
})),
106+
},
107+
{ padding: 2 },
118108
),
119109
);
120110

121-
logger.info(ansis.bold.magentaBright('Categories'));
122-
logger.newline();
123-
table.render();
124111
logger.newline();
125112
}
126113

‎packages/utils/src/lib/reports/log-stdout-summary.unit.test.ts‎

Lines changed: 44 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1+
import ansis from 'ansis';
12
import { beforeAll, describe, expect, vi } from 'vitest';
23
import { removeColorCodes } from '@code-pushup/test-utils';
34
import { logger } from '../logger.js';
4-
import { ui } from '../logging.js';
55
import {
66
binaryIconPrefix,
77
logCategories,
@@ -10,24 +10,16 @@ import {
1010
import type { ScoredReport } from './types.js';
1111

1212
describe('logCategories', () => {
13-
let logs: string[];
14-
15-
beforeAll(() => {
16-
logs = [];
17-
// console.log is used inside the logger when in "normal" mode
18-
vi.spyOn(console, 'log').mockImplementation(msg => {
19-
logs = [...logs, msg];
20-
});
21-
// we want to see table and sticker logs in the final style ("raw" don't show borders etc so we use `console.log` here)
22-
ui().switchMode('normal');
23-
});
13+
let stdout: string;
2414

25-
afterEach(() => {
26-
logs = [];
15+
beforeEach(() => {
16+
stdout = '';
2717
});
2818

29-
afterAll(() => {
30-
ui().switchMode('raw');
19+
beforeAll(() => {
20+
vi.mocked(logger.info).mockImplementation(message => {
21+
stdout += `${message}\n`;
22+
});
3123
});
3224

3325
it('should list categories', () => {
@@ -64,13 +56,18 @@ describe('logCategories', () => {
6456

6557
logCategories({ plugins, categories });
6658

67-
const output = logs.join('\n');
68-
69-
expect(output).not.toContain('✅');
70-
expect(output).not.toContain('❌');
71-
expect(output).toContain('Performance');
72-
expect(output).toContain('42');
73-
expect(output).toContain('1');
59+
expect(logger.info).toHaveBeenCalledTimes(1);
60+
expect(ansis.strip(stdout)).toBe(
61+
`
62+
Categories
63+
64+
┌───────────────┬─────────┬──────────┐
65+
│ Category │ Score │ Audits │
66+
├───────────────┼─────────┼──────────┤
67+
│ Performance │ 42 │ 1 │
68+
└───────────────┴─────────┴──────────┘
69+
`.trimStart(),
70+
);
7471
});
7572

7673
it('should list categories with score < scoreTarget', () => {
@@ -108,13 +105,18 @@ describe('logCategories', () => {
108105

109106
logCategories({ plugins, categories });
110107

111-
const output = logs.join('\n');
112-
113-
expect(output).not.toContain('✓');
114-
expect(output).toContain('✗');
115-
expect(output).toContain('Performance');
116-
expect(output).toContain('42');
117-
expect(output).toContain('1');
108+
expect(logger.info).toHaveBeenCalledTimes(1);
109+
expect(ansis.strip(stdout)).toBe(
110+
`
111+
Categories
112+
113+
┌───────────────┬─────────┬──────────┐
114+
│ Category │ Score │ Audits │
115+
├───────────────┼─────────┼──────────┤
116+
│ Performance │ ✗ 42 │ 1 │
117+
└───────────────┴─────────┴──────────┘
118+
`.trimStart(),
119+
);
118120
});
119121

120122
it('should list categories with score >= scoreTarget', () => {
@@ -152,13 +154,18 @@ describe('logCategories', () => {
152154

153155
logCategories({ plugins, categories });
154156

155-
const output = logs.join('\n');
156-
157-
expect(output).toContain('✓');
158-
expect(output).not.toContain('✗');
159-
expect(output).toContain('Performance');
160-
expect(output).toContain('100');
161-
expect(output).toContain('1');
157+
expect(logger.info).toHaveBeenCalledTimes(1);
158+
expect(ansis.strip(stdout)).toBe(
159+
`
160+
Categories
161+
162+
┌───────────────┬─────────┬──────────┐
163+
│ Category │ Score │ Audits │
164+
├───────────────┼─────────┼──────────┤
165+
│ Performance │ ✓ 100 │ 1 │
166+
└───────────────┴─────────┴──────────┘
167+
`.trimStart(),
168+
);
162169
});
163170
});
164171

0 commit comments

Comments
 (0)