analogger

Js Logger

Usage no npm install needed!

<script type="module">
  import analogger from 'https://cdn.skypack.dev/analogger';
</script>

README

Test workflow nycrc Coverage Version workflow npm version semantic-release


Analogger is a very simple logger for both Node and the Browser. It is a library using both CJS and ESM. It serves as a packaging example of hybrid (CJS/ESM) module.

Installation

npm install analogger

Usage

In NodeJS

const {anaLogger}  = require("analogger");

In the Browser

import {anaLogger} from "./node_modules/analogger/dist/index-esm.min.mjs";

With a bundler or a transpiler

import {anaLogger} from "analogger"

Preview

Terminal

img_1.png

Inspector

img.png

DOM

img.png

FileSystem

img.png


API


log() / info() / warn() / error()

Display a message in the terminal or the inspector, depending on where the process is running.

anaLogger.log(`I'am some log`);
anaLogger.info(`I'am some log`);
anaLogger.warn(`I'am some log`);
anaLogger.error(`I'am some log`);

alert()

anaLogger.alert(`I'am some log`);

Display the browser native message box if run from it; otherwise, it displays the message in the terminal.


setOptions()

Options default Expect Description
silent false boolean No log will be displayed (only errors)
hideError false boolean Hide errors from console
hideHookMessage false boolean Hide the automatic message shown when some native console methods are overridden
hidePassingTests false boolean Hide Live test results
logToDom false string (DOM Selector) display log in a DOM container
logToFile false string (File path) write log to a file if running from Node
// No hook alert message + Log messages in the div #analogger
anaLogger.setOptions({hideHookMessage: true, logToDom: "#analogger"})

overrideConsole()

anaLogger.setOptions({silent: true, hideError: false})
console.log(`Log Before override`);
anaLogger.overrideConsole()
console.log(`Log After override`);

Override console.log, console.info and console.warn. If you already have many console.log running in your system, it allows hiding them all in one go. In this example, the terminal (or inspector) will not show the message "Log After override". All following messages either.


overrideError()

Same as above, but for errors (console.error)


removeOverride() | removeOverrideError()

Remove overridden console methods


setContexts()

Contexts

A context allows grouping the logs by functionality by assigning them some colour.

Examples
const LOG_CONTEXTS = {STANDARD: null, TEST: {color: "#B18904"}, C1: null, C2: null, C3: null, DEFAULT: {}}
const LOG_TARGETS = {ALL: "ALL", DEV1: "TOM", DEV2: "TIM", USER: "USER"};

anaLogger.setContexts(LOG_CONTEXTS);

anaLogger.log(LOG_CONTEXTS.C1, `Test Log example C1`);
anaLogger.log(LOG_CONTEXTS.C2, `Test Log example C2`);
anaLogger.log(LOG_CONTEXTS.C3, `Test Log example C3`);

See LOG_CONTEXTS.C1 in this example to categorise the functionality we want to monitor. For instance, LOG_CONTEXTS.INVESTIGATING_TIMER_EFFECT could display output related to something that has to do with a timer.

The "Testing log 2" log will not show up in the console or the terminal.

Preview In a terminal (NodeJs)

img.png

Preview In a browser (ESM)

img_1.png


setTargets() / setActiveTarget()

Targets

Targets allow defining some log categories. For example, they can be developers, roles, etc. setActiveTarget() allows hiding logs from other devs or roles.

Examples
const LOG_CONTEXTS = {STANDARD: null, TEST: {color: "#B18904", symbol: "⏰"}, C1: null, C2: null, C3: null, DEFAULT: {}}
const LOG_TARGETS = {ALL: "ALL", DEV1: "TOM", DEV2: "TIM", USER: "USER"};

anaLogger.setContexts(LOG_CONTEXTS);
anaLogger.setActiveTarget(LOG_TARGETS.DEV1);                        // <- You are DEV1 

anaLogger.log({target: LOG_TARGETS.DEV1}, `Testing log 1`);           // You will see this
anaLogger.log({target: LOG_TARGETS.DEV2}, `Testing log 2`);           // You will not see this
anaLogger.log({context: LOG_CONTEXTS.STANDARD}, `Testing log 3`);     // You will see this    
anaLogger.log(`Testing log 4`);                                       // You will see this. No context = LOG_CONTEXTS.ALL


anaLogger.log(LOG_CONTEXTS.C1, `Test Log example C1`);               // You will see this



assert()

You can set some tests directly in the code. It serves as early feedback. It is helpful to guarantee that the code is running straight away rather than waiting on the CI to send its feedback.

anaLogger.assert(1 === 1)
anaLogger.assert(1 === 2)
anaLogger.assert(()=>true, true)
anaLogger.assert((a, b)=> a === b, true, 2, 2)



setErrorHandlerForUserTarget()

When an error is detected and should be seen by your app consumers explicitly (for instance, you want to display a dialogue box to them), you can set a handler here. All other console.error will be working as usual (logging messages).

    anaLogger.setErrorHandlerForUserTarget(function (context/*, ...args*/)
    {
        // Detect whether we are in a browser
        if (context.environnment === anaLogger.ENVIRONMENT_TYPE.BROWSER)
        {
            // When an error is detected in the Browser, the Browser will see this message
            anaLogger.alert(`Users explicitly see this message`)
        }
    });

    anaLogger.setActiveTarget(LOG_TARGETS.USER);
    anaLogger.error({target: LOG_TARGETS.USER}, "Salut user!");     // Display an alert box
    anaLogger.error("Hi user!");                                    // Log the message to the inspector