Daily log - April 20, 2009

by Sean Cribbs

Blank regexes are evil. I’ve been working on this Javascript control that involves a number of different components, one of which is an auto-completing field. I really wasn’t satisfied with the usage pattern the auto-completer in scriptaculous provides, so I decided to roll my own. Yes a little NIH, but I estimated it would take me longer to read and understand the inner workings of their auto-completer than to write my own from scratch using TDD. Long story short, I was right, but I discovered this along the way…

I made a method on my control that creates an array of regular expressions from the field input to match against our available data by splitting the field value on spaces. A piece of data will only match and be populated into the drop-down if all regexps match. Well, at first, I didn’t cover the edge case of having a piece of text with a space at the end and nothing following. When I tried to use the control in vivo, I got the “beachball” and then the “runaway script” warning. Naturally, it was because of this:

'an '.split(/\s+/) == ['an', '']

So the last element in the split array became a regexp that was essentially empty! Naturally it matched EVERYTHING and hung the browser.

Yay completion! I completed the baseline of the control later in the day and got all the Selenium stories working too. Thus ends my trial-by-fire introduction to TDD in Javascript.

© 2006-present Sean CribbsGithub PagesTufte CSS