Skip to content

Commit

Permalink
add support for logging with colors and release version patch
Browse files Browse the repository at this point in the history
  • Loading branch information
@radubrehar
radubrehar committed Nov 27, 2023
1 parent 8e5f2b6 commit 2c2e094
Show file tree
Hide file tree
Showing 3 changed files with 103 additions and 13 deletions.
43 changes: 40 additions & 3 deletions examples/src/pages/tests/utils/debug.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ debug.colors = ['red', 'green', 'blue'];
export default test.describe.parallel('debug', () => {
test('should reuse the same color for same channel', () => {
debug.enable = '*';
debug.log = (...x: string[]) => {
debug.logFn = (...x: string[]) => {
args = x;
};
const logger1a = debug('channel1');
Expand All @@ -28,10 +28,46 @@ export default test.describe.parallel('debug', () => {
expect(args).toEqual(['%c[channel1]', 'color: green', 'xyz']);
});

test('should allow setting logFn for a channel', () => {
let args: string[] = [];
debug.enable = '*';
debug.logFn = (...x: string[]) => {
args = x;
};
const logger1 = debug('channel1');

logger1('testing');
expect(args).toEqual(['%c[channel1]', 'color: red', 'testing']);

let customLoggerArgs: string[] = [];
logger1.logFn = (...x: string[]) => {
args = ['1'];
customLoggerArgs = x;
};

logger1('second test');
expect(args).toEqual(['1']);
expect(customLoggerArgs).toEqual([
'%c[channel1]',
'color: red',
'second test',
]);

logger1.logFn = undefined;

logger1('third test');
expect(args).toEqual(['%c[channel1]', 'color: red', 'third test']);
expect(customLoggerArgs).toEqual([
'%c[channel1]',
'color: red',
'second test',
]);
});

test('should only log for enabled channels', () => {
let args: string[] = [];
debug.enable = 'channel2,channel1:*';
debug.log = (...x: string[]) => {
debug.logFn = (...x: string[]) => {
args = x;
};
const onea = debug('channel1:a');
Expand All @@ -41,6 +77,7 @@ export default test.describe.parallel('debug', () => {

onea('1a');
expect(args).toEqual(['%c[channel1:a]', 'color: red', '1a']);

oneb('1b');
expect(args).toEqual(['%c[channel1:b]', 'color: green', '1b']);

Expand All @@ -55,7 +92,7 @@ export default test.describe.parallel('debug', () => {
test.skip('channel negation not working yet', () => {
let args: string[] = [];
debug.enable = 'channel1:*,-channel1:b';
debug.log = (...x: string[]) => {
debug.logFn = (...x: string[]) => {
args = x;
};
const onea = debug('channel1:a');
Expand Down
4 changes: 2 additions & 2 deletions source/src/utils/debug.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,15 @@ export interface LogFn {
export const dbg = (channelName: string): LogFn => {
const result = debugTable.extend(channelName);

result.log = console.log.bind(console);
result.logFn = console.log.bind(console);

return result;
};

export const err = (channelName: string): LogFn => {
const result = debugTable.extend(`${channelName}:error`);

result.log = console.error.bind(console);
result.logFn = console.error.bind(console);

return result;
};
Expand Down
69 changes: 61 additions & 8 deletions source/src/utils/debugPackage.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,7 @@ const COLORS = [
'#FFCC33',
];

const COLOR_SYMBOL = Symbol('color');
const USED_COLORS_MAP = new WeakMap<string[], number[]>();

USED_COLORS_MAP.set(
Expand Down Expand Up @@ -115,10 +116,11 @@ const getNextColor = (colors = COLORS) => {
export type DebugLogger = {
(...args: any[]): void;
extend: (channelName: string) => DebugLogger;
color: (colorName: string, ...message: string[]) => [string, string];
enabled: boolean;
channel: string;
destroy: () => void;
log: (...args: any[]) => void;
logFn: undefined | ((...args: any[]) => void);
};

const CHANNEL_SEPARATOR = ':';
Expand Down Expand Up @@ -273,7 +275,9 @@ function debugPackage(channelName: string): any {

const parentLogger = loggers.get(channelParts.slice(0, -1));

let logFn = parentLogger ? parentLogger.log : debug.log;
const defaultLogFn =
(parentLogger ? parentLogger.logFn : debug.logFn) ?? defaultLogger;
let logFn = defaultLogFn;

let enabled: boolean | undefined;
let lastMessageTimestamp: number = 0;
Expand All @@ -294,14 +298,62 @@ function debugPackage(channelName: string): any {
}
lastMessageTimestamp = now;

// with colors
logFn(`%c[${channel}]`, `color: ${color}`, ...args);
const argsToLog: any[] = [];

let textWithColors: boolean | undefined = undefined;

args.forEach((arg) => {
if (arg[COLOR_SYMBOL]) {
if (textWithColors === undefined) {
textWithColors = true;
}
argsToLog.push(...arg);
} else {
if (typeof arg !== 'string' && typeof arg !== 'number') {
textWithColors = false;
return;
}
argsToLog.push(`${arg}%s`);
}
});

if (textWithColors) {
// args only have text
// and at least one of the arg has colors
const theArgs = [
`%c[${channel}]%c %s`,
`color: ${color}`,
'',
...argsToLog,
'',
];

logFn(...theArgs);
} else {
logFn(`%c[${channel}]`, `color: ${color}`, ...args);
}
}
},
{
channel: {
value: channel,
},
color: {
value: (colorName: string, ...args: string[]) => {
const result = [
`%c${args.join(' ')}%c%s`,
`color: ${colorName}`,
'',
];

result.toString = () => args.join(' ');

// @ts-ignore ignore
result[COLOR_SYMBOL] = true;

return result;
},
},
extend: {
value: (nextChannel: string) => {
return debugFactory(nextChannel, channel);
Expand All @@ -310,10 +362,11 @@ function debugPackage(channelName: string): any {
enabled: {
get: () => isEnabled(),
},
log: {
logFn: {
configurable: false,
get: () => logFn,
set: (fn) => {
logFn = fn;
logFn = fn ?? defaultLogFn;
},
},
destroy: {
Expand Down Expand Up @@ -349,10 +402,10 @@ const debug = debugPackage as {
colors: string[];
enable: string;
diffenable: string | boolean;
log: DebugLogger['log'];
logFn: DebugLogger['logFn'];
};

debug.colors = COLORS;
debug.log = defaultLogger;
debug.logFn = defaultLogger;

export { debug };

0 comments on commit 2c2e094

Please sign in to comment.