DomLog
npm install @bcodes/dom-log
Log stringified objects to the DOM
This little library stringifies model objects and appends them to the #app
element
import { DomLog } from '@bcodes/dom-log';
// Supports method chaining and grouped output
DomLog
.log(a)
.log(b)
.log(c)
.log(d)
.sideBySide(4);
Particularly useful for StackBlitz and CodeSandbox projects
Continuous trips to the console
were getting me down
The data displays in readable form, and happiness returns
Map & Set
Map and Set are stringified as Array representations of their Iterator objects
API
/**
* Outputs JSON.stringified objects to the DOM
* Value replacer preserves NaN, undefined, Infinity, -Infinity
*
* @param {*} args
*/
log: (...args: any[]) => DomLog;
/**
* Move the last number of logged outputs side by side
*
* @param {number} [num=2]
*/
sideBySide: (num?: number) => DomLog;
/**
* Clear the current logging
*/
clear: () => DomLog;
/**
* Log with console.log also
*
* @param {boolean} [value=true]
*/
setLogToConsole: (value?: boolean) => DomLog;
/**
* Set the id of the DOM element to attach logs
*
* @param {string} [id='app']
*/
setElementId: (id?: string) => DomLog;
/**
* Apply default background color to HTML element
*/
applyBackgroundAll: () => DomLog;
/**
* Set the css font size e.g. 0.9em
*
* @param {string} [value='0.9em']
*/
setFontSizeCss: (value?: string) => DomLog;
/**
* Scrolls the logged item into view
*
* @param {boolean} [value=true]
*/
scrollIntoView: (value?: boolean) => DomLog;