How do I unit test a website?
I’ve been spending a lot of time recently attempting to puzzle out a good way of testing the work I’m been doing. I’m enamoured with the idea of unit tests, and I have the feeling that I could save myself a bit of misery if I had a mechanism to build tests for each bug I close. It’s a great dream, but I’m not coming up with much in the way of a solid solution for my work.
Sketching out the broad outlines of what I want is pretty simple. There are two broad categories of things I want to test:
Core functionality: If I click on an article from some listing page, I should end up at the same article’s page. I shouldn’t ever see 404’s. PHP errors and warnings shouldn’t exist on the site.
Presentation tests: Each module in the sidebar should be X pixels wide in all the A-Grade browsers. Text shouldn’t be cut off because of overflow issues. Thing X should be Y pixels away from thing Z.
Core functionality is easy, rather, I can come up with good ways of writing those tests. A spider is just a quick Perl script away, and the tests I want to do are almost completely doable with regular expressions. If a link’s text matches the headline of the page to which it leads, wonderful! If not, error! With a few hardcoded exceptions to handle “More” links and the like, I’ve got a solid testing system. Presentation, on the other hand, is hard.
It’s hard not because it’s terribly complex, it’s hard because it’s
tremendously difficult for a computer to determine if a page looks right.
checks: grab an element’s
computedStyle and run a series of checks. That
covers a good chunk of presentational issues, but it’s incredibly
timeconsuming to build out a testing system that way. Moreover, it only
catches the subset of errors that are directly tied to the box model. I don’t
really know how to generically test to see if a particular link is floated
next to an image, or gets pushed under it, for example. Sure, I can check X
and Y offsets and compare those to the image’s width and height, but those
sorts of interdependencies get very complex, very quickly.
So I’m still looking. Selenium looks like something I should play with,
even if the notion of writing tests using HTML
table elements is somewhat
disheartening. JSUnit is likewise a potential source of testing goodness.
Any other good sources I should be taking a look at?