Atomic Safari

A few weeks back we posted a new blog directory at BusinessWeek. Immediately after launch though I decided I wasn’t content sticking with a static page, and sat down at my laptop to layer on a little progressive enhancement. It’s a blog directory, so why not, you know, show users some posts? (You can say “Duh,” now.)

There’s no suitable server-side language where this piece calls home and most of our RSS feeds are redirected through a separate subdomain for tracking purposes—Atom feeds, however, live right alongside their blog cousins (it’s a long story). Bottom line, it’s an AJAX-and-Atom joint by necessity.

X Easy Pieces

The resulting script is a straightforward piece of AJAX (though with a nice production-friendly implementation, if I do say so myself). The JavaScript scans the page looking for any items with a class of blog, then grabs the recent posts from the appropriate blog and tacks them on.

The important point is that all the data about what goes where with whom comes from the markup, not stashed away in a JavaScript array somewhere. That means any staffer, even ones without scripting experience, can add a new blog to the page and the behavior updates automatically.

Enter Safari

Like all best laid plans there was, of course, a hitch: Safari.

For reasons one can only surmise, Safari chokes on the title tag in Atom feeds. Try to parse the feed and look for a title and you’ll get handed a big fat error.

No two ways about it, this is a bug. My best guess is that Safari has a problem with more than one title loitering in the DOM. Some sort of desperate, confused monogamy with the main HTML title tag or who-knows-what. (Irony: Safari prefers Atom with its own built-in feed reader; Further irony: Safari must be running into some variant of this exact same problem in order to display them.) This popped up in both Safari 2 and the Safari 3 beta (Windows version—I’ve yet to successfully install the beta on my MacBook, but that’s a gripe best saved for another time).

The solution is simple, albeit one that scores a 10 on the Scotch Tape and Bubble Gum Solution Scale. Before you parse the response text do a simple replace, renaming any title tags (opening and closing) to something else. Doesn’t really matter what you rename them to. Could be “helicopters” or “wackybananas”. Anything but “title”. Then Safari dutifully swallows it whole—and you’re back in business.