node.js: Mehr Durchblick beim Debuggen durch Farbe

Im Rahmen eines größeren Projektes musste ich beim Entwickeln immer wieder längere Log-Ausgaben lesen und nachvollziehen. Besonders wenn es darum geht, viele abstrakte alphanumerische IDs und Hashes zu vergleichen und sicherzustellen, dass alles so funktioniert, wie gedacht, können einem ganz schön schnell der Kopf rauchen und die Augen tränen. Öfter dachte ich mir, „wäre es nicht toll, wenn alle diese IDs schon mal durch Farben in der Ausgabe unterschieden werden könnten?“, habe aber die Idee meistens wieder abgetan und stattdessen weiter Kopf und Augen gequält…

Bis ein größerer Test-Case daherkam, bei dem noch viel mehr IDs als zuvor verglichen werden wollten, und ich schrieb schnell diesen kleinen Helfer-Schnipsel:

var colorLog = function () {
    var arg = Array.prototype.slice.call(arguments),
        out = [];

    arg.forEach(function (a) {
        var reg = /[0-9a-zäöüÖÄÜ]{2,}/gi;
        if ('object' === typeof a) {
            a = JSON.stringify(a, null, 2);
        }
        a = a.toString().replace(reg, function (val) {
            var col = parseInt(val.substr(-8), 36) % 7 + 1;
            return 'x1b[3' + (col || 1) + 'm' + val + 'x1b[0m';
        });
        out.push(a);
    });
    console.log(out.join(' '));
};

 

Und Schwupps – Synästhesie für jedermann:

Natürlich werden hier im Moment nur sieben Farben verwendet, und nicht jeder alphanumerische String kann seine eigene Farbe bekommen, aber es hilft mir zumindest schon ungemein, auf den ersten Blick zu sehen, was gleich sein *könnte* und was nicht.

Extra: Tipp für schön formatierte Ausgabe von JSON Objekten

Während ich die kleine Funktion bastelte, entdeckte ich ein nettes Feature von JSON.stringify(), das mir noch nicht bekannt war, aber hier zum Einsatz kommt: Man kann JSON.stringify ein drittes Argument mitgeben, welches die Zahl der Einrückungs-Leerzeichen angibt, und man bekommt eine schön formatierte Ausgabe zurück.

Happy Painting!
~ Ben

[fblike style=“button_count“ showfaces=“false“ width=“90″ verb=“like“ font=“arial“ float=“left“] [fbshare type=“button“ float=“left“] [google_plusone size=“medium“ float=“left“] [twitter style=“horizontal“ float=“left“ lang=“de“] [linkedin_share style=“right“ float=“left“]

Leave a comment

1Gk5mS

Bitte geben Sie den Text vor: