feat(plugin-lighthouse): replace @poppinss/cliui with new logger

Author: matejchalk

packages/plugin-lighthouse/src/lib/normalize-flags.ts

@@ -1,6 +1,5 @@
-import { bold, yellow } from 'ansis';
-import { ui } from '@code-pushup/utils';
-import { LIGHTHOUSE_PLUGIN_SLUG } from './constants.js';
+import ansis from 'ansis';
+import { logger } from '@code-pushup/utils';
 import { DEFAULT_CLI_FLAGS } from './runner/constants.js';
 import type { LighthouseCliFlags } from './runner/types.js';
 import type { LighthouseOptions } from './types.js';
@@ -73,10 +72,8 @@ export function logUnsupportedFlagsInUse(
   if (unsupportedFlagsInUse.length > 0) {
     const postFix = (count: number) =>
       count > displayCount ? ` and ${count - displayCount} more.` : '';
-    ui().logger.debug(
-      `${yellow('⚠')} Plugin ${bold(
-        LIGHTHOUSE_PLUGIN_SLUG,
-      )} used unsupported flags: ${bold(
+    logger.warn(
+      `Used unsupported flags: ${ansis.bold(
         unsupportedFlagsInUse.slice(0, displayCount).join(', '),
       )}${postFix(unsupportedFlagsInUse.length)}`,
     );

packages/plugin-lighthouse/src/lib/normalize-flags.unit.test.ts

@@ -1,7 +1,7 @@
-import { bold, yellow } from 'ansis';
+import ansis from 'ansis';
 import path from 'node:path';
 import { describe, expect, it } from 'vitest';
-import { ui } from '@code-pushup/utils';
+import { logger } from '@code-pushup/utils';
 import { DEFAULT_CHROME_FLAGS, LIGHTHOUSE_OUTPUT_PATH } from './constants.js';
 import { logUnsupportedFlagsInUse, normalizeFlags } from './normalize-flags.js';
 import { LIGHTHOUSE_REPORT_NAME } from './runner/constants.js';
@@ -10,12 +10,9 @@ import type { LighthouseOptions } from './types.js';
 describe('logUnsupportedFlagsInUse', () => {
   it('should log unsupported entries', () => {
     logUnsupportedFlagsInUse({ 'list-all-audits': true } as LighthouseOptions);
-    expect(ui()).toHaveLoggedTimes(1);
-    expect(ui()).toHaveLogged(
-      'debug',
-      `${yellow('⚠')} Plugin ${bold(
-        'lighthouse',
-      )} used unsupported flags: ${bold('list-all-audits')}`,
+    expect(logger.warn).toHaveBeenCalledTimes(1);
+    expect(logger.warn).toHaveBeenCalledWith(
+      `Used unsupported flags: ${ansis.bold('list-all-audits')}`,
     );
   });
 
@@ -32,12 +29,9 @@ describe('logUnsupportedFlagsInUse', () => {
       // unsupported
       ...unsupportedFlags,
     } as unknown as LighthouseOptions);
-    expect(ui()).toHaveLoggedTimes(1);
-    expect(ui()).toHaveLogged(
-      'debug',
-      `${yellow('⚠')} Plugin ${bold(
-        'lighthouse',
-      )} used unsupported flags: ${bold(
+    expect(logger.warn).toHaveBeenCalledTimes(1);
+    expect(logger.warn).toHaveBeenCalledWith(
+      `Used unsupported flags: ${ansis.bold(
         'list-all-audits, list-locales, list-trace-categories',
       )} and 3 more.`,
     );
@@ -119,7 +113,7 @@ describe('normalizeFlags', () => {
         ...supportedFlags,
       } as unknown as LighthouseOptions),
     ).toEqual(expect.not.objectContaining({ 'list-all-audits': true }));
-    expect(ui()).toHaveLoggedTimes(1);
+    expect(logger.warn).toHaveBeenCalledTimes(1);
   });
 
   it('should remove any flag with an empty array as a value', () => {

packages/plugin-lighthouse/src/lib/runner/details/details.ts

@@ -1,10 +1,9 @@
-import { bold, yellow } from 'ansis';
+import ansis from 'ansis';
 import type { FormattedIcu } from 'lighthouse';
 import type Details from 'lighthouse/types/lhr/audit-details';
 import type { Result } from 'lighthouse/types/lhr/audit-result';
 import type { AuditDetails } from '@code-pushup/models';
-import { ui } from '@code-pushup/utils';
-import { PLUGIN_SLUG } from '../constants.js';
+import { logger } from '@code-pushup/utils';
 import { parseCriticalRequestChainToAuditDetails } from './critical-request-chain.type.js';
 import { parseOpportunityToAuditDetailsTable } from './opportunity.type.js';
 import { parseTableToAuditDetailsTable } from './table.type.js';
@@ -58,10 +57,8 @@ export function logUnsupportedDetails(lhrAudits: Result[]) {
     ),
   ];
   if (slugsWithDetailParsingErrors.length > 0) {
-    ui().logger.debug(
-      `${yellow('⚠')} Plugin ${bold(
-        PLUGIN_SLUG,
-      )} skipped parsing of unsupported audit details: ${bold(
+    logger.warn(
+      `Skipped parsing of unsupported audit details: ${ansis.bold(
         slugsWithDetailParsingErrors.join(', '),
       )}.`,
     );

packages/plugin-lighthouse/src/lib/runner/details/details.unit.test.ts

@@ -1,21 +1,18 @@
-import { bold, yellow } from 'ansis';
+import ansis from 'ansis';
 import type { FormattedIcu } from 'lighthouse';
 import type Details from 'lighthouse/types/lhr/audit-details';
 import type { Result } from 'lighthouse/types/lhr/audit-result';
 import { describe, expect, it } from 'vitest';
 import type { AuditDetails } from '@code-pushup/models';
-import { ui } from '@code-pushup/utils';
+import { logger } from '@code-pushup/utils';
 import { logUnsupportedDetails, toAuditDetails } from './details.js';
 
 describe('logUnsupportedDetails', () => {
   it('should log unsupported entries', () => {
     logUnsupportedDetails([{ details: { type: 'screenshot' } }] as Result[]);
-    expect(ui()).toHaveLoggedTimes(1);
-    expect(ui()).toHaveLogged(
-      'debug',
-      `${yellow('⚠')} Plugin ${bold(
-        'lighthouse',
-      )} skipped parsing of unsupported audit details: ${bold('screenshot')}.`,
+    expect(logger.warn).toHaveBeenCalledTimes(1);
+    expect(logger.warn).toHaveBeenCalledWith(
+      `Skipped parsing of unsupported audit details: ${ansis.bold('screenshot')}.`,
     );
   });
 
@@ -29,12 +26,9 @@ describe('logUnsupportedDetails', () => {
       { details: { type: 'treemap-data' } },
       { details: { type: 'criticalrequestchain' } },
     ] as Result[]);
-    expect(ui()).toHaveLoggedTimes(1);
-    expect(ui()).toHaveLogged(
-      'debug',
-      `${yellow('⚠')} Plugin ${bold(
-        'lighthouse',
-      )} skipped parsing of unsupported audit details: ${bold(
+    expect(logger.warn).toHaveBeenCalledTimes(1);
+    expect(logger.warn).toHaveBeenCalledWith(
+      `Skipped parsing of unsupported audit details: ${ansis.bold(
         'filmstrip, screenshot, debugdata',
       )}.`,
     );

packages/plugin-lighthouse/src/lib/runner/details/item-value.ts

@@ -1,13 +1,13 @@
-import { bold } from 'ansis';
+import ansis from 'ansis';
 import type { IcuMessage } from 'lighthouse';
 import type Details from 'lighthouse/types/lhr/audit-details';
 import {
   formatBytes,
   formatDuration,
   html,
+  logger,
   roundDecimals,
   truncateText,
-  ui,
 } from '@code-pushup/utils';
 
 export type PrimitiveItemValue = string | number | boolean;
@@ -85,11 +85,11 @@ export function formatTableItemPropertyValue(
       return truncateText(String(parsedItemValue), 500);
     case 'multi': // @TODO
       // @TODO log verbose first, then implement data type
-      ui().logger.info(`Format type ${bold('multi')} is not implemented`);
+      logger.debug(`Format type ${ansis.bold('multi')} is not implemented`);
       return '';
     case 'thumbnail': // @TODO
       // @TODO log verbose first, then implement data type
-      ui().logger.info(`Format type ${bold('thumbnail')} is not implemented`);
+      logger.debug(`Format type ${ansis.bold('thumbnail')} is not implemented`);
       return '';
   }
   /* eslint-enable @typescript-eslint/no-magic-numbers */
@@ -145,13 +145,11 @@ export function parseTableItemPropertyValue(
       return String(url);
     case 'subitems':
       // @TODO log verbose first, then implement data type
-      ui().logger.info(`Value type ${bold('subitems')} is not implemented`);
+      logger.debug(`Value type ${ansis.bold('subitems')} is not implemented`);
       return '';
     case 'debugdata':
       // @TODO log verbose first, then implement data type
-      ui().logger.info(`Value type ${bold('debugdata')} is not implemented`, {
-        silent: true,
-      });
+      logger.debug(`Value type ${ansis.bold('debugdata')} is not implemented`);
       return '';
   }
   // IcuMessage

packages/plugin-lighthouse/src/lib/runner/details/item-value.unit.test.ts

@@ -1,7 +1,7 @@
-import { bold } from 'ansis';
+import ansis from 'ansis';
 import type Details from 'lighthouse/types/lhr/audit-details';
 import { beforeAll, describe, expect, it } from 'vitest';
-import { ui } from '@code-pushup/utils';
+import { logger, ui } from '@code-pushup/utils';
 import {
   type SimpleItemValue,
   formatTableItemPropertyValue,
@@ -146,17 +146,15 @@ describe('parseTableItemPropertyValue', () => {
       }),
     ).toBe('');
 
-    expect(ui()).toHaveLogged(
-      'info',
-      `Value type ${bold('subitems')} is not implemented`,
+    expect(logger.debug).toHaveBeenCalledWith(
+      `Value type ${ansis.bold('subitems')} is not implemented`,
     );
   });
 
   it('should parse value item debugdata to empty string and log implemented', () => {
     expect(parseTableItemPropertyValue({ type: 'debugdata' })).toBe('');
-    expect(ui()).toHaveLogged(
-      'info',
-      `Value type ${bold('debugdata')} is not implemented`,
+    expect(logger.debug).toHaveBeenCalledWith(
+      `Value type ${ansis.bold('debugdata')} is not implemented`,
     );
   });
 
@@ -363,9 +361,8 @@ describe('formatTableItemPropertyValue', () => {
       ),
     ).toBe('');
 
-    expect(ui()).toHaveLogged(
-      'info',
-      `Format type ${bold('multi')} is not implemented`,
+    expect(logger.debug).toHaveBeenCalledWith(
+      `Format type ${ansis.bold('multi')} is not implemented`,
     );
   });
 
@@ -376,9 +373,8 @@ describe('formatTableItemPropertyValue', () => {
         'thumbnail',
       ),
     ).toBe('');
-    expect(ui()).toHaveLogged(
-      'info',
-      `Format type ${bold('thumbnail')} is not implemented`,
+    expect(logger.debug).toHaveBeenCalledWith(
+      `Format type ${ansis.bold('thumbnail')} is not implemented`,
     );
   });
 

packages/plugin-lighthouse/src/lib/runner/details/utils.ts

@@ -1,4 +1,4 @@
-import { bold } from 'ansis';
+import ansis from 'ansis';
 import type Details from 'lighthouse/types/lhr/audit-details';
 import { stringifyError } from '@code-pushup/utils';
 
@@ -9,9 +9,9 @@ export class LighthouseAuditDetailsParsingError extends Error {
     error: unknown,
   ) {
     super(
-      `Parsing lighthouse report details ${bold(
+      `Parsing lighthouse report details ${ansis.bold(
         type,
-      )} failed: \nRaw data:\n ${JSON.stringify(rawTable, null, 2)}\n${stringifyError(error)}`,
+      )} failed:\nRaw data:\n${JSON.stringify(rawTable, null, 2)}\n${stringifyError(error)}`,
     );
   }
 }

packages/plugin-lighthouse/src/lib/runner/runner.ts

@@ -2,7 +2,12 @@ import type { Config, RunnerResult } from 'lighthouse';
 import { runLighthouse } from 'lighthouse/cli/run.js';
 import path from 'node:path';
 import type { AuditOutputs, RunnerFunction } from '@code-pushup/models';
-import { ensureDirectoryExists, stringifyError, ui } from '@code-pushup/utils';
+import {
+  ensureDirectoryExists,
+  link,
+  logger,
+  stringifyError,
+} from '@code-pushup/utils';
 import { orderSlug, shouldExpandForUrls } from '../processing.js';
 import type { LighthouseOptions } from '../types.js';
 import { DEFAULT_CLI_FLAGS } from './constants.js';
@@ -46,7 +51,7 @@ export function createRunnerFunction(
 
         return [...acc, ...processedOutputs];
       } catch (error) {
-        ui().logger.warning(stringifyError(error));
+        logger.warn(stringifyError(error));
         return acc;
       }
     }, Promise.resolve<AuditOutputs>([]));
@@ -74,7 +79,9 @@ async function runLighthouseForUrl(
   const runnerResult: unknown = await runLighthouse(url, flags, config);
 
   if (runnerResult == null) {
-    throw new Error(`Lighthouse did not produce a result for URL: ${url}`);
+    throw new Error(
+      `Lighthouse did not produce a result for URL: ${link(url)}`,
+    );
   }
 
   const { lhr } = runnerResult as RunnerResult;