Understanding JavaScript via TDD

I got interested in JavaScript via the book “Seven Languages in Seven Weeks” by Bruce Tate. I read it one year ago. The chapter about the prototyping nature of the language “Io” was an eye opener. The book itself is worth to write about – but not today.

As every developer I used JavaScript a little bit. But really understanding whats going on is definitely another thing. The last weeks I wrote a little shopping list as a client for my vert.x experiments. It is a single page app and uses knockout.js, jquery and bootstrap for the UI. I use Java as my general purpose programming language since 1997 and I think I know Java quite well. So, I was a little bit frustrated that I don’t understand every construct in JavaScript. After playing with some frameworks and CoffeeScript I decided to build up a comparable Test Driven Environment as I use when I developing in Java. I wanted to use a xUnit like test framework. But there are so many test frameworks that it was difficult to decide which one to use. After looking at several post and at stackoverflow I got the feeling that js-test-driver or QUnit are good candidates.

Then I found this really good book: “Test-Driven JavaScript Development” by Christian Johansen. Christian uses js-test-driver in his book. The main goal for js-test-driver is to be the runner for the tests. It has also assertions but I wanted to have more readable tests. I heard about Jasmine and a friend (thanks to Patric) also mentioned it. The integration was done in 10 minutes and the tests are better to read now. I really like this BDD style.

After a while I thought about a better way to connect a browser to the driver. I didn’t want to start a browser every time and press the connect link because I’m writing “Understand Tests” mostly.  Robert C. Martin describes this kind of tests in his book “Clean Code“. These tests are very handy to understand a framework, a library or as in my case also language features. I wanted to start the js-test-driver together with something like a headless browser. PhantomJS is such a thing. js-test-driver-phantomjs starts the driver and the headless browser with one simple command. This setup is also very useful for Continuous Integration! Intellij IDEA has also a nice plugin for js-test-driver.

Of course, I can write a test in the console of some browser, but if I close the browser the tests are gone. The tests are inside my project now and I can look at the tests as often as I like. And testing the JavaScript-part of my application works the same way as I know it from the Java-World.







Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s