Life is grand

Code coverage tools for Javascript are thin on the ground. In fact, I have only found one - JavaScript Coverage Validator - and it isn’t even out of closed beta yet.

Am I to think that all those millions of lines of Javascript out there on all those Web 2.0 sites that espouse agile practies with TDD influences don’t have code coverage? Sure, some may have unit testing but unit testing without code coverage is a less than ideal situation. You simply don’t know if you have tested all functions and all paths in your functions. Unit testing and code coverage go hand in hand, they back each other up.

Do you have a solution to code coverage for your Javascript?

Snook has some good tips for coding and managing CSS. Here are my thoughts on each.

px for font sizes

Absolutely. I’ve tried ems and they are more hassle than they are worth. Percentages are too finicky and small/medium/large/etc. is too imprecise. Offer people alternate stylesheets with bigger font-sizes for accessibility in browsers like IE6 that don’t resize px sized fonts.

CSS declarations on one line

I understand Snook’s point but my text-editor supports code-collapsing and putting it all on one line makes it hard to decipher complex styles. Plus I usually use find to navigate my CSS.

Blocking the Styles

Very good advice. I also comment the blocks which makes a find operation really simple. Snook’s comment on not overriding browser defaults is also a good one.

Browser Support

Sadly I just can’t do this. Too many IE5.5 users still on my logs. Though I find stopping at that level makes for only a few cross-browser issues anyway.

Allow Block Elements to Fill Their Space Naturally

Amen to that. Often you don’t even have to think to do this, it is a by product of good HTML structure in many cases.

Use CSS Shorthand

I am mixed on this. Margin absolutely should be short-hand but font or background I often break up. Too many times has a URL problem broken the rest of a background declaration. I think that if you put everything on one line then it is easier to use shorthand.

Avoid Unnecessary Selectors

Definitley. Especially avoid div#content and use #content. It lets you swap to different elements and allows multiple uses of a class on different elements.

I’ve spent the past hour or so with a co-worker trying to get a Cocoon+Java+RSS+MySQL+XSL+DELI system to do the simplest of tasks. What a nightmare. It is incredible in its flexiblitlity. I can’t think of much it can’t do. But what it does do is very little. It seems as though the chaps who built this system spent 90% of their time on the framework of the application and about 5% on the application itself. It has huge potential but all the bits that actually do things aren’t there. String replace? Nope. I had to find an XSL template that someone else had rewritten to get that.

It’s the autobahn without the Porsche. The scaffolding without the building. The bricks without the builder.

It’s cool and wonderful and so much fun to work with but ultimately it is insanity when all you want is to get the job done. The glass without the beer (thanks for that one, Elaine.)

This is where Ruby on Rails is kicking Java and .NET web-frameworks all over the park. They are visionary and capable of far more than Rails. But Rails actually does common tasks that you need to do. It is less flexible but ultimately more productive.

For those few edge cases that it can’t handle I’ll write a function in something else and pipe it in.

Ruby really is more productive. I wanted to add OPML support to a project of ours and from past .NET experience with this wasn’t looking all that forward to it. But rexml and rio came to the rescue.

Here is some sample Ruby code that extracts all the URLs from an OPML file:

opml_file = ''
rio('http://share.opml.org/opml/top100.opml') > opml_file
opml_doc = Document.new(opml_file)
urls = XPath.match(opml_doc, '//@xmlUrl')

That is it. rio does the hard work of saving the web-stored OPML file into a string. rexml does the hard job of parsing that string into an XML document and then we use XPath to find all of the xmlUrl attributes.

rexml comes with most standard Ruby installs and you can install rio with gem install rio. The rio documentation is here.

Everything in moderation and moderation in everything. And with that in mind: Don’t return from multiple points in a method.

I just noticed one of our svn repos is on rev 111.

*Paul lifts his feet from the floor till the next commit*

rev = `svn info`.match('Revision: (\d+)')[1]

That bit of Ruby code will return the Subversion revision number of the working copy it is run in.

`svn info` returns

Path: .
URL: http://svn.yourdomain.com/trunk/

Repository UUID: 4e38b711-8f0e-1410-9e15-e3a330ac0d60
Revision: 894
Node Kind: directory
Schedule: normal
Last Changed Author: pwatson
Last Changed Rev: 894
Last Changed Date: 2006-07-28 14:48:28 +0100 (Fri, 28 Jul 2006)
Properties Last Updated: 2006-07-28 14:50:11 +0100 (Fri, 28 Jul 2006)

The regex bit (.match(’Revision: (\d+)’)[1]) then returns the 894 number from that string.

(Thanks to Dela for the regex.)

Slash7 has posted the slides from their brilliant Javascript Boot Camp Tutorial talk at OSCON. 108 pages of pure JavaScript love. One thing I just learnt, on page 36, is that you can pass a function as an arguement into another function. That function can then call the arguement function. Sounds weird but that is pretty amazing if you ask me.

I like the way you can add methods/functions/members to built in JavaScript entities. The following adds a remove method to the Array object.

Array.prototype.remove = function(item_to_remove)
{
  for (var i = 0; i < this.length; i++)
  {
    if (this[i] == item_to_remove)
    {
      this.splice(i,1);
      break;
    }
  }
}

Anybody know a better way of removing items from an array?

I only just realised today that the vertical-align CSS property can take integers and not just enums. Up till now I had only been using middle, top, bottom etc. as valid values. Now I realise you can use -3px or whatever value you need. Handy.