Mark Needham

Thoughts on Software Development

Archive for the ‘feedback-loops’ tag

The Internet Explorer 6 dilemma

with 10 comments

A couple of weeks ago Dermot and I showcased a piece of functionality that we’d been working on – notably hiding some options in a drop down list.

We showcased this piece of functionality to the rest of the team in Firefox and it all worked correctly.

Our business analyst, who was also acting as QA, then had a look at the story in Internet Explorer 6 and we promptly realised that the way we’d solved the problem didn’t actually work in IE6.

In retrospect we should have showcased the story in IE6 in order to shorten the feedback cycle but if we take that logic even further than it’s clear that we should be running our application in IE6 frequently as we’re developing functionality.

It’s a dilemma that we’ve faced on nearly every project I’ve worked on recently.

We know in the back of our minds that we need to make it work on Internet Explorer 6 but because of Firebug the speed of development is siginifcantly quicker if we use Firefox.

It’s almost as if we’re trading off the longer term safety we would have if we use IE6 all the time for the quick feedback cycles we get from the Firebug console/CSS editor when we’re fiddling around with Javascript and CSS.

The way that we’re working at the moment is to continue using Firefox for local development but trying to make sure that we test and showcase in IE6.

It’s not a foolproof approach, as can be seen by the example I gave at the beginning of this post, so I’d be interested if anyone has any clever ideas for dealing with the situation where we have a requirement to make our application IE6 compatible.

Written by Mark Needham

July 11th, 2010 at 7:31 pm

Javascript: Creating quick feedback loops

with one comment

I’ve been working quite a lot with Javascript and in particular jQuery recently and since I haven’t done much in this area before all the tips and tricks are new to me.

One thing which is always useful no matter the programming language is to use it in a way that you can get rapid feedback on what you are doing.

Fortunately there are quite a few tools that allow us to do this with Javascript:

Firebug

The Firefox plugin is perhaps the quickest way of getting feedback on anything Javascript and indeed CSS related.

The ability to see which HTTP calls have been made on a page is invaluable for checking whether AJAX functionality is working correctly and DOM manipulation can be executed and tested on the fly.

Including jQuery in a page effectively makes Firebug the jQuery Interactive Console, allowing us to try out the different functions and see their effects immediately.

Unit Testing Frameworks

There are several javascript unit testing frameworks around at the moment which run in the browser and provide the ability to write assertions on our code.

I have been using QUnit and screw-unit and while they work reasonably well for simple tests, neither seems to be at the level of JUnit or NUnit for example. I’m sure this will come as they mature.

Other frameworks I’ve heard about but not tried: RhinoUnit, JSNUnit, JSUnit, no doubt there are others I haven’t heard about yet.

Selenium IDE

The sometimes forgotten Firefox plugin is very useful for quickly creating repeatable scenarios to see the impact that code changes have had.

The beauty of this approach is that it takes out the manual steps in the process, so we can just make our changes and then re-run the test. The runner lights up green or red, taking out the need to manually verify the correctness of our assertions.

Alert

The ‘alert’ function is perhaps most useful when we want to quickly verify the path being taken through a piece of code without having to step through it using the Firebug debugger.

It’s probably more useful for proving our assumptions than actual debugging and it’s certainly quick and easy to set up.

Written by Mark Needham

December 9th, 2008 at 9:13 pm