Daily Archives: 03/07/2012

log4js-ext published

As of lately I’ve been having some extra fun with ExtJs, and I decided I needed a serious javascript logging library for ExtJs. Something that closely resembled log4j or the thousand java logging libraries out there.

When I made a list of desired feature the logging library should provide, this is what I got:

  • It was a must to have a good GUI based viewer that allowed me to filter logs by different criteria: category, priority (info, error, debug, warn…), message content, etc.

  • I needed some way to group related logs so that I could distinguish what logs were part of a certain complex operation. I decided to support the NDC concept Log4j supports. Of course, the GUI viewer allows NDC filtering.
  • I needed to log arbitrary objects and see them as nicely highlighted JSON. And, of course, I should be able to search any value in the logged objects with a viewer.

  • I needed an easy way to format log messages, avoiding hand-made concatenations and formating as much as possible.

  • I wanted it to be extensible, meaning I should be able to add support for things such as remote logging, to define new ways to format messages, etc.

  • I wanted it to be easy to use and familiar to users of popular log libraries for other languages, such as log4j, logback, etc. Log4js-ext closely resembles log4j.

  • And, of course, I needed robustness. This means, among other things, lots of automated tests.

In the end, I decided the best thing I could do was to implement my own utility. It is a small project, worth 3 or 4 days of work to have it fully tested and production ready, and therefore feasible.

Now that the project is finished, the standard log viewer looks like this -well, much better, due to image scaling!

Standard log viewer

If you don’t like this, you can get things logged to your browser console (or both). This is what it looks like for Chrome:

Log output in Chrome's console

I hope you notice the object logging capability built-in, just look at the last logging entry in both viewers. What’s nice is that you can search for values in the logged object, a must when you have tons of logging output.

I would like to thank the author of the JSON highlighter I used to make the logged object output more readable, though I don’t know who he is. I just found the code here, so I’ll assume the guy that gave the answer is the author. Again, thanks a lot!

The version 0.9 of the library is available in GoogleCode.

The library is quite robust, and it has more than 25 automated JsTestDriver tests (it is small, to be true), but I decided to publish a 0.9 version to get some feedback before committing to a 1.0 version.

I expect to have 1.0 out as soon as possible, as the only things missing are some healthy extra user feedback and some code refactoring I’m undertaking right now.

Tests with JsTestDriver

BTW, here are the JsTestDriver test reports, I just can’t help it…

The test results for version 0.9

I have to say that I find JsTestDriver very interesting. I have still not selected my definitive TDD tool for Javascript, but JsTestDriver is a strong contender right now.