react-native-power-logger v2.0.0
React-native-power-logger
A react-native specific debugging tools, a lightweight customizable logger to log regular items, the react-native bridge, async storage and array's maps
Example:
console.pl.logStorage(); // See in table format all your react-native async storage
Installation
$ npm install react-native-power-logger
Then, in index.js or at top of your application:
const RNlog = require('react-native-power-logger');
'...or'
import RNlog from 'react-native-power-logger';
console.pl = RNLog;
Usage
you can now use regular console around, and have a console.pl object that contains all the Power Logger methods!
So you can do:
console.pl.logBridge(); // this will log the bridge messages
Test on demo project
- Install react-native cli
- open path in terminal and run:
react-native init demo && cd demo && npm install react-native-power-logger
- import and place some code on top of test application to have insight of bridge
import RNlog from 'react-native-power-logger'
RNlog.logBridge();
AppRegistry.registerComponent(appName, () => App);
What can i do?
- Log React-native bridge, filters can be applied to choose only one way of data flow, specific method or module name
- Log React-native async storage, dumps all the data from async storage, displayed in table format
- Log items with customizable prefix, break line, colors and level of importance
- Log from already in place Array.prototype.map
- Log from specific Array.prototype.logMap placed in code before being changed in favor of regular "map"
API
overrideArraysMap()
overrideArraysMap()
const testArray = [ "a","b","c" ];
testArray.map(item => item); // every cicle will log current item, index and total array
enableArraysLogMap()
enableArraysLogMap() //extend native with Array.prototype.logMap
const testArray = [ "a","b","c" ];
testArray.map(item => item); // this will remain a regular map
testArray.logMap(item => item); // every cicle will log current item, index and total array
logStorage()
logStorage() // returns a table in console with async storage data displayed
logBridge(versus, prefix)
[optional, string] versus: "toJavascript" || "toNative"
,
[optional, string] prefix: "prefix-message"
logBridge() // returns in console a log of every data exchange in react-native bridge
findInBridge(targets, prefix)
[optional, string[]] targets: ["module name", "method name"]
,
[optional, string] prefix: "prefix-message"
findInBridge() // returns in console a log of the items we need to look up in bridge
log(target, prefix, level, lineBreak, breakColor)
[optional, any ] target: objINeedToLog
,
[optional, string] prefix: "prefix-message"
,
[optional, string] level: "info" || "warn" || "err"
,
[optional, boolean] lineBreak: true
,
[optional, string] breakColor: "#fff"
log() // returns a customized console.log
info(target)
info() // returns a console.info
warn(target)
warn() // returns a console.warn
err(target)
err() // returns a console.err
trace()
trace() // returns a console.trace
Warnings
overrideNativeMap
will override the native Array.prototype.map
, use it only for debugging. When turned on will dump all items from all the array's maps (frameworks included).
Support
Star the project if you liked! Share it, fork it or contribute to improve it.
TODO
- Log http requests
- Track foreground-background
- Track performance