@holz/console-backend 0.3.0 → 0.6.0

package/README.md

@@ -0,0 +1,27 @@
+# `@holz/console-backend`
+
+Pretty-print logs to the browser console.
+
+<img alt="Screenshot of logs printed to the browser console" src="https://user-images.githubusercontent.com/10053423/222927532-2925b0a3-9494-4de7-b328-917ceb8607b0.png" width="600" />
+
+## Usage
+
+```typescript
+import { createConsoleBackend } from '@holz/console-backend';
+
+const logger = createLogger(createConsoleBackend());
+```
+
+> **Note**  
+> This is fine-tuned for an interactive browser console. If you want pretty-printed logs in Node or Deno, try [`@holz/ansi-terminal-backend`](https://github.com/PsychoLlama/holz/tree/main/packages/holz-ansi-terminal-backend) instead.
+
+## Options
+
+```typescript
+createConsoleBackend({
+  /**
+   * By default it prints to the global console, but you can override it.
+   */
+  console: typeof console,
+});
+```

package/dist/holz-console-backend.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=1e3,r=60*c,i=60*r,u=24*i,f=(a,t=a)=>{const e=a.getTime()-t.getTime(),o=Math.abs(e),s=e<0?"":"+";return o>=u?`${s}${Math.round(e/u)}d`:o>=i?`${s}${Math.round(e/i)}h`:o>=r?`${s}${Math.round(e/r)}m`:o>=c?`${s}${Math.round(e/c)}s`:`${s}${e}ms`};class l{constructor(t={}){this.console=t.console??console}processLog(t){const e=this.stamp,o=new Date;this.stamp=o;const s=[{include:!0,format:"%s",values:[t.message]},{include:Object.keys(t.context).length>0,format:"%o",values:[t.context]},{include:!0,format:"%c%s",values:["color: gray",f(o,e)]},{include:t.origin.length>0,format:"%c%s",values:["color: rgba(128, 128, 128, 0.6); font-style: italic",t.origin.join(":")]}].filter(n=>n.include),m=s.map(n=>n.format).join(" "),d=s.flatMap(n=>n.values);this.console[t.level](m,...d)}}exports.ConsoleBackend=l;exports.default=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=1e3,c=60*a,u=60*c,l=24*u,f=(s,r=s)=>{const e=s.getTime()-r.getTime(),t=Math.abs(e),n=e<0?"":"+";return t>=l?`${n}${Math.round(e/l)}d`:t>=u?`${n}${Math.round(e/u)}h`:t>=c?`${n}${Math.round(e/c)}m`:t>=a?`${n}${Math.round(e/a)}s`:`${n}${e}ms`};function $(s={}){const r=s.console??console;let e;return t=>{const n=new Date,i=[{include:!0,format:"%s",values:[t.message]},{include:Object.keys(t.context).length>0,format:"%o",values:[t.context]},{include:!0,format:"%c%s",values:["color: gray",f(n,e)]},{include:t.origin.length>0,format:"%c%s",values:["color: rgba(128, 128, 128, 0.6); font-style: italic",t.origin.join(":")]}].filter(o=>o.include),m=i.map(o=>o.format).join(" "),d=i.flatMap(o=>o.values);r[t.level](m,...d),e=n}}exports.createConsoleBackend=$;

package/dist/holz-console-backend.js

@@ -1,15 +1,12 @@
-const i = (c, t = c) => {
-  const e = c.getTime() - t.getTime(), n = Math.abs(e), s = e < 0 ? "" : "+";
-  return n >= 864e5 ? `${s}${Math.round(e / 864e5)}d` : n >= 36e5 ? `${s}${Math.round(e / 36e5)}h` : n >= 6e4 ? `${s}${Math.round(e / 6e4)}m` : n >= 1e3 ? `${s}${Math.round(e / 1e3)}s` : `${s}${e}ms`;
+const i = (s, r = s) => {
+  const e = s.getTime() - r.getTime(), t = Math.abs(e), n = e < 0 ? "" : "+";
+  return t >= 864e5 ? `${n}${Math.round(e / 864e5)}d` : t >= 36e5 ? `${n}${Math.round(e / 36e5)}h` : t >= 6e4 ? `${n}${Math.round(e / 6e4)}m` : t >= 1e3 ? `${n}${Math.round(e / 1e3)}s` : `${n}${e}ms`;
 };
-class u {
-  constructor(t = {}) {
-    this.console = t.console ?? console;
-  }
-  processLog(t) {
-    const e = this.stamp, n = new Date();
-    this.stamp = n;
-    const s = [
+function l(s = {}) {
+  const r = s.console ?? console;
+  let e;
+  return (t) => {
+    const n = new Date(), c = [
       {
         include: !0,
         format: "%s",
@@ -34,11 +31,10 @@ class u {
           t.origin.join(":")
         ]
       }
-    ].filter((o) => o.include), a = s.map((o) => o.format).join(" "), r = s.flatMap((o) => o.values);
-    this.console[t.level](a, ...r);
-  }
+    ].filter((o) => o.include), a = c.map((o) => o.format).join(" "), u = c.flatMap((o) => o.values);
+    r[t.level](a, ...u), e = n;
+  };
 }
 export {
-  u as ConsoleBackend,
-  u as default
+  l as createConsoleBackend
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@holz/console-backend",
-  "version": "0.3.0",
+  "version": "0.6.0",
   "description": "A console backend for Holz",
   "type": "module",
   "main": "./dist/holz-console-backend.cjs",
@@ -39,10 +39,10 @@
     "test:types": "tsc"
   },
   "devDependencies": {
-    "@holz/core": "0.2.0",
+    "@holz/core": "^0.6.0",
     "@types/node": "^18.14.0",
-    "@vitest/coverage-c8": "0.28.5",
-    "typescript": "4.9.5",
+    "@vitest/coverage-c8": "^0.28.5",
+    "typescript": "^4.9.5",
     "vite": "^4.0.0",
     "vitest": "^0.28.5"
   }

package/src/__tests__/console-backend.test.ts

@@ -1,7 +1,7 @@
 import { format } from 'util';
 import { createLogger } from '@holz/core';
 import type { MinimalConsole } from '../console-backend';
-import ConsoleBackend from '../console-backend';
+import { createConsoleBackend } from '../console-backend';
 
 class MockConsole implements MinimalConsole {
   private fmt = (level: string, ...strings: Array<unknown>) => {
@@ -30,7 +30,7 @@ describe('Console backend', () => {
 
   it('prints messages to the console', () => {
     const output = new MockConsole();
-    const backend = new ConsoleBackend({ console: output });
+    const backend = createConsoleBackend({ console: output });
 
     const logger = createLogger(backend);
     logger.info('hello world');
@@ -42,7 +42,7 @@ describe('Console backend', () => {
 
   it('includes the log namespace', () => {
     const output = new MockConsole();
-    const backend = new ConsoleBackend({ console: output });
+    const backend = createConsoleBackend({ console: output });
     const logger = createLogger(backend)
       .namespace('my-lib')
       .namespace('MyClass');
@@ -56,7 +56,7 @@ describe('Console backend', () => {
 
   it('includes the log context', () => {
     const output = new MockConsole();
-    const backend = new ConsoleBackend({ console: output });
+    const backend = createConsoleBackend({ console: output });
     const logger = createLogger(backend);
 
     logger.info('creating session', { sessionId: 3109 });
@@ -71,7 +71,7 @@ describe('Console backend', () => {
 
   it('does not include the log context if it is empty', () => {
     const output = new MockConsole();
-    const backend = new ConsoleBackend({ console: output });
+    const backend = createConsoleBackend({ console: output });
     const logger = createLogger(backend);
 
     logger.warn('activating death ray', {});
@@ -84,7 +84,7 @@ describe('Console backend', () => {
 
   it('prints the time since the last log', () => {
     const output = new MockConsole();
-    const backend = new ConsoleBackend({ console: output });
+    const backend = createConsoleBackend({ console: output });
     const logger = createLogger(backend);
 
     logger.info('first message');
@@ -108,7 +108,7 @@ describe('Console backend', () => {
     ],
   ])('avoids changing %s messages', (method, message, namespace, pipe) => {
     const output = new MockConsole();
-    const backend = new ConsoleBackend({ console: output });
+    const backend = createConsoleBackend({ console: output });
     const logger = namespace.reduce(
       (logger, ns) => logger.namespace(ns),
       createLogger(backend)

package/src/console-backend.ts

@@ -5,21 +5,13 @@ import { timeDelta } from './time-delta';
  * A backend that pretty-prints logs to a browser console, or any
  * remote-attached console.
  */
-export default class ConsoleBackend implements LogProcessor {
-  private console: MinimalConsole;
-  private stamp?: Date;
+export function createConsoleBackend(options: Options = {}): LogProcessor {
+  const output = options.console ?? console;
+  let lastTimestamp: Date;
 
-  constructor(options: Options = {}) {
-    this.console = options.console ?? console;
-  }
-
-  processLog(log: Log) {
-    const lastTimestamp = this.stamp;
+  return (log: Log) => {
     const now = new Date();
 
-    // Track the time spent between logs.
-    this.stamp = now;
-
     const segments = [
       {
         include: true,
@@ -50,8 +42,11 @@ export default class ConsoleBackend implements LogProcessor {
     const values = segments.flatMap<unknown>((segment) => segment.values);
 
     // Browsers have UIs for filtering by log level. Leverage that.
-    this.console[log.level](format, ...values);
-  }
+    output[log.level](format, ...values);
+
+    // Track the time spent between logs.
+    lastTimestamp = now;
+  };
 }
 
 interface Options {

package/src/index.ts

@@ -1 +1 @@
-export { default, default as ConsoleBackend } from './console-backend';
+export { createConsoleBackend } from './console-backend';