Getting Dojo 0.4.1, IE7 and Safari 2.0.4 to play nicely together

Part of what makes software development fun and interesting is working with cutting edge tools that enable developers to build fancier and (more importantly) better mouse traps. One such tool that we've come to embrace in working towards improving our application is the Dojo Framework. Full of features that create a rich and visually stunning AJAX application, version 0.4.1 of the Dojo Framework was recently released to the general public.

We here at Spider Strategies were looking forward to this new release to aid us in one particular problem that plagues all web applications, browser compatibility. In particular with Microsoft's new IE7 being pushed out to clients automatically, we definitely wanted to see how Dojo and our performance management application, CMS, would fare against Microsoft's latest browser. We also had an interest in see how well things worked when applied to Apple's latest Safari 2.0.4 browser, for those inclined to work with Apple. As a side note, because we’re all developers, we do most of our development on Firefox (how could a web developer live without firebug?) and therefore are most interested in these other major browser platforms.

All developers know upgrades can be a double edged sword; fortunately nothing major broke and most of the problems we encountered were relatively minor and were due to some changes applied underneath the Dojo hood. This meant most of the changes we made were syntactic in nature. For example the way Dojo expressed coordinates in previous versions syntactically was the following :

[top, left]

In 0.4.1, this was changed to :

{ top: val, left: val } A minor change for sure, but one that expresses the foundation for most of the problems we encountered. Other types of issues we encountered were due to some refactoring of the Dojo tree widgets, specifically the events associated with opening context menus and the ability to drag and drop tree nodes. In one instance the method of construction used to create our context menus had to change from using Dojo topics to using the dojo.event.connect system. While most problems were encountered were not specific to IE7, we did run into an issue with IE7 not being able to correctly calculate the height of content within a pane. However, this is somewhat a non issue as we plan to incorporate a custom dialog in the future.

Safari, on the other hand, proved to be a whole other beast entirely. Right from the start, there were problems immediately noticeable after logging into our application. In addition to several of the problems found common to other browsers, Safari went the extra distance in providing poor editor support for rich text editing and context menus. Ironically, Safari also provided the worst usable user interface (Apple is known for their sharp UIs) when compared to IE or Firefox. Many of the visual elements such as expandable boxes or cues provided during the dragging and dropping simply did not work, or just looked plain ugly. With the exception of the rich text editor, however, we were able to smooth out most of these issues. The rich text editor proved to be the single biggest challenge in getting Safari to work properly. The problem lies in the editor code of Safari 2.0.4, and while we implemented a workaround for this shortcoming, we hope the next version of Safari will be more kind.

Everyone expects to encounter problems to some degree when it comes to upgrades, but all things considered, the upgrade to Dojo 0.4.1 and IE7 went well with no major issues. More importantly, we now have full browser compatibility with "the big three" browsers, with most of the nuances in developing a cross browser web application transparent to the developer. This perhaps showcases one of the nicest benefits we've received after using the Dojo Framework to power our application.