Archive for the ‘Javascript’ Category

Selenium Continuous Integration Runner

Saturday, January 10th, 2009

selenium At Common Sense Media I wanted to get some functional testing up and running that didn’t require a lot of user training for the QA folks. I also wanted those tests to run in our Rightscale/Amazon EC2 hosted Hudson continuous integration server. As a result I’ve published the:

Selenium Selenese Continuous Integration Runner

on GitHub in the hopes that it will save other people time when trying to get their Selenese tests running from a continuous integration server. It’s very simple but one thing I battled with was that I had to patch the selenium JAR to get it to work with Firefox 3.0. It should work fine in any continuous integration server regardless if it’s Hudson, Cruise, Cruise Control, Bamboo, etc.

The functional testing products I’ve used that drive a real browser include Test Complete (commercial), Selenium, and Watir. I think all 3 do a good job but one thing I like about Selenium is that it’s dirt simple to get a user productive with the Selenium IDE Firefox plugin. However, that benefit is also the most limiting factor of the Selenium IDE which is that to be able to re-open tests in Selenium IDE you have to save them as Selenese (which is the most limited of the testing languages that Selenium supports). Still, I think Selenese is a reasonable choice for a lot of organizations that need a moderately sophisticated functional test suite.

Simple CMS using Google Spreadsheet API

Tuesday, June 12th, 2007

Update 6/14/2007: Dion Almaer has published a nice Javascript helper which makes working with spreadsheets much nicer, I’ve moved my stuff to it and it’s a big improvement over using the Google JSON api directly.

Publishing dynamic content on your website in a format that you can style with CSS has gotten a whole lot easier with Google’s simple JSON based Javascript API’s. The two I’ve found myself playing with lately are the Google Ajax Feed API for publishing RSS and Atom feeds and the Google Spreadsheet API
for publishing little snippets of text that should be easily editable.

Say you want a simple headline on your homepage that you can change daily. Here’s how you’d do it with the Google Spreadsheet API:

1. Create a spreadsheet making the first row the column headers (important because you’ll refer to the cell by the column header):

easycmsspreadsheet.png
(more…)

Ajax enabling crusty legacy webapps with Prototype

Sunday, November 26th, 2006

With all of the hype around Ajax it’s easy to think you might need an MVC framework with baked in Ajax support like Rails ActionPack or JBoss Seam to make Ajax easy. However, libraries like Prototype (which is what Rails uses) make it so easy that it’s a snap to Ajax enable even the crustiest legacy web application!

Let’s take a look at what it takes to put a simple unordered list on a page with a refresh button to refresh the list without doing and page reload and then we’ll spruce it up a bit:
(more…)

Javascript debugging in Internet Explorer

Tuesday, November 21st, 2006

It always drives me nuts when I get a Javascript error in Internet Explorer that I can’t reproduce in Firefox because I’m used to debugging Javascript in Firefox with Firebug. I finally had to buckle down and figure out how to debug Javascript in IE and fortunately the IE Blog has a nice post on how to do this. The solution I used:

1. Install the free Microsoft Script Debugger
2. In Internet Explorer:

Tools->Internet Options…->Advanced->Disable Script Debugging (Internet Explorer)
Tools->Internet Options…->Advanced->Disable Script Debugging (Other)

3. Hit a page with a Javascript error and it asks you Do you wish to Debug? and click Yes

It’ll bring up the debugger with a nice yellow line on the Javascript causing the error.

Deferring ad loading on your pages to avoid unnecessary outages

Tuesday, October 3rd, 2006

At GreatSchools we’ve had 3rd party ad server outages or slowness effectively make our site unusable as users browsers waited for certain ads to render before rendering the rest of the page. I had originally thought just specifying height and width of the div element around the ad would be enough for the browser to move on given a slow ad load but in my tests with various ad servers that turned out not to be the case. After some research I discovered that the trick that some sites (such as Digg.com) employ is called source ordered content where you put the content in the order you’d really like it in (be it for SEO or for deferring ad calls) and then using CSS or Javascript to move it to the proper place.
(more…)

Enhancements to subModal

Friday, March 10th, 2006

I started hacking around with subModal (modal javascript windows with background shading) this morning to add some features I liked in Lightbox Gone Wild. You can try it out and download my changes to subModal here. They are (more…)

Hiring a web front-end engineer and a rant

Wednesday, March 8th, 2006

Update 3/28/06: Still looking… not for a web designer but a web front-end engineer. Jemery does a good job of describing the distrinction. No doubt about it, this is a hot skill set that is extremely hard to find!

I’m hiring a front-end web developer (contract or FTE) for either on-site or remote work. This is not a web designer or graphics designer job but rather a technical front-end developer, someone with crazy XHTML/CSS/Javascript skills (more…)

Modal windows with Javascript and CSS

Wednesday, March 8th, 2006

One of the side projects I spent a little time on today was researching the use of on-page modal dialog boxes using Javascript and CSS that shade or darken the rest of the page while they are open. It looks like it will be an easy job thanks to these two solutions that are made freely available: (more…)