ng2-tree-viewer/lib/index.js

Angular 2 runtime console debugger

"use strict";
var LogGroup = (function () {
    function LogGroup(name) {
        this.name = name;
        this.messages = [];
        this.inner = [];
    }
    LogGroup.prototype.child = function (name) {
        var newChild = new LogGroup(name);
        this.inner.push(newChild);
        return newChild;
    };
    LogGroup.prototype.addMessage = function (msg) {
        this.messages.push(msg);
        return this;
    };
    LogGroup.prototype.emit = function () {
        console.group(this.name);
        this.messages.forEach(function (msg) {
            console.log(msg);
        });
        this.inner.forEach(function (child) {
            child.emit();
        });
        console.groupEnd();
    };
    return LogGroup;
}());
// global context
var context = window;
var Angular2TreeTool = (function () {
    function Angular2TreeTool() {
    }
    Angular2TreeTool.prototype.buildTree = function () {
        var _this = this;
        var rootNodes;
        if ("getAllAngularRootElements" in context) {
            rootNodes = context.getAllAngularRootElements().map(function (el) { return ng.probe(el); });
        }
        else {
            rootNodes = [this.findRoot()];
        }
        if (!rootNodes || rootNodes.length === 0) {
            throw "Cannot find rootNodes ng2 element!";
        }
        var logger = new LogGroup("/");
        rootNodes.forEach(function (rootNode) {
            _this.walk(rootNode, logger);
            logger.emit();
        });
    };
    Angular2TreeTool.prototype.walk = function (el, logger) {
        var _this = this;
        if (!el) {
            return;
        }
        var _logger = logger;
        if (el.componentInstance) {
            var name_1 = el.name || el.nativeElement.localName;
            var cmpName = el.providerTokens[0].name;
            _logger = logger.child("/" + name_1 + ": " + cmpName);
            _logger.addMessage(el.nativeElement);
            Object.keys(el.componentInstance).forEach(function (key) {
                _logger.addMessage(key + ": " + el.componentInstance[key]);
            });
        }
        el.children.forEach(function (child) {
            _this.walk(child, _logger);
        });
    };
    Angular2TreeTool.prototype.findRoot = function () {
        var elements = document.body.children;
        for (var i = 0; i < elements.length; i++) {
            var el = ng.probe(elements.item(i));
            if (el && el.componentInstance) {
                return el;
            }
        }
    };
    return Angular2TreeTool;
}());
function enableNg2Tree() {
    console.log("Let's execute `ng2tree();`");
    context.ng2tree = function () {
        new Angular2TreeTool().buildTree();
    };
}
exports.enableNg2Tree = enableNg2Tree;