Wow, I can hardly believe it… In Dojo 1.6.0 my very old bug has finally been fixed…. it supports scheme less URLs, after almost 2 years, wow!

Bug closed.

And the saga continues… I reported a Dojo bug about scheme-less URLs in March (filed against 1.4.2)… now the brand new 1.5 has been released and the (simple-to-fix bug)… was not fixed.

Why? Well, I don’t know. Maybe because they don’t care? The comment in bug 8546 is:

It’s been open for 18 months, and it was pointed out to me as a bug by a large user of Dojo and jQuery. They reported the issue to jQuery, and it was fixed in 2 weeks, and we’re going on 18 months.

Sorry dojo, speed-wise you already lost, no matter what you do!

Sometimes I have the feeling that the only large Web site that uses scheme-less URLs is the one I work with during office hours… because not a lot of Web sites use this handy feature which allows to include resources independent of the protocol (i.e. <link type=”text/css” rel=”stylesheet” media=”all” href=”//www.domain.com/styles/main.css” /> – note the missing protocol). This works cross browser and is perfectly valid – and saves the hassle of security warnings in IE in case of secure Web sites.

Anyhow, when I used the jQuery library it turned out that these scheme-less URLs confused the .getScript function. The bug was easy to find and report and after some whining it got fixed. I mean, how hard is it? Fix the simple bug, add a test case to the unit tests (you do unit test, don’t you?), run the tests done.

Does not seem to be the case with Dojo, which experiences the same bug (already reported here and here). Not only that the bug is open since 14 month, this simple bug was reported in version 1.2.3 and won’t be fixed until version 2.0? Come on, you must be kidding! Signing up and submitting a comment or patch (1/2 line of code: || relpath.indexOf(‘//’) === 0 appended to the first if in the function _xdIsXDomainPath) is also not possible because the user sign-up leads to a 404 page. Uuups.

So I’ll end up with maintaining my local patch file, and hopefully I remember to apply the patch in case there is a future Dojo upgrade…

Today I stumbled across a very strange IE issue. Again. Basically the code that was working fine in all real browsers – the code loaded some HTML fragment containing script tags using AJAX and added it to the page. Nothing complicated, except that those script tags require some special handling in Internet Explorer, as they do not execute automatically when being added to the page:

if(IE) {
var scripttags = NewlyAddedDomViaAjax.getElementsByTagName(“SCRIPT”);
var head = document.getElementsByTagName(“head”)[0];
for(var i=0, j=scripttags.length; i < j; i++)
{
var scripttag = document.createElement(“SCRIPT”);
scripttag.src = scripttags[i].src;
head.appendChild(scripttag);
}
}

No big magic and works fine. Except for the case that the script tag comes as first element in the newly inserted HTML code. In this case the getElementsByTagName is *not* returning the script node at all – it just returns an empty result set. This means that the JavaScript code is not executed in IE….

Luckily this problem is quite easy to solve – just move some other HTML code in front of the HTML snippet that is returned via AJAX – place all the script tags at its end and everything will work fine!

btw, how about Google? Not of great help, the closest I could find was this unanswered forum post.

(Image from Flickr)

Today seems to be the day of IE6 bugs… the rather old “comma-bug” caused some troubles in one app and another one did not work properly in IE6. The following code was involved:

<a href=”javascript:void(0)” onclick=”someFunc()”>my link</a>

The someFunc() dynamically loaded a new script file – which worked fine in all browsers except for Internet Explorer 6 – the file was never loaded. Reason for this is that javascript:void(0) terminates all loading, including newly added &ltscript> tags or XHR requests.

Solving this is quite simple – the default handler of the link must never be executed:

<a href=”javascript:void(0)” onclick=”someFunc(); return false;“>my link</a>

But because there are more issues around the javascript: pseudo protocol I highly recommend not using javascript:void(0) at all. Instead use the following code:

<a href=”#” onclick=”someFunc(); return false;“>my link</a>

In the worst case the default handler is executed, which means the site goes to an empty anchor… in practice this means the “#” is appended to the URL, that’s it. No scary JavaScript function involved, that only breaks IE6. And shorter to type too.

More information: here and here.

Recently I had to add nice tooltips to a larger Web application that is based on the Dojo framework. I thought “nothing easier that that”, as with jQuery I can do stuff like

jQuery('a').tooltip();

1	jQuery('a').tooltip();

with some (optional) parameters and that’s it. Unfortunately I had to learn from the various sources and samples that this simple feature is not supported out of the box by Dojo. There is a way of creating tooltips on the fly but there does not seem to be a ready-to-use solution which uses the title tag of the elements and shows a tooltip based on that.

So here is the code I came up with to display Dojo tooltips based on the title tag:

dojo.addOnLoad(function() { //render each tooltip var i = 0; dojo.query(".withTooltip").forEach(function(node) { if(!node.title) return; // don't do anything if there is no title if(!node.id) // Dojo requires an ID for the element { node.id = "dojoToolTip-"+i; i++; } var tt = new dijit.Tooltip({label:node.title, connectId:[node.id]}); node.title = ""; // remove the Browsers standard title tag }); });

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

dojo.addOnLoad(function() {   //render each tooltip   var i = 0;   dojo.query(".withTooltip").forEach(function(node) {       if(!node.title)           return; // don't do anything if there is no title       if(!node.id) // Dojo requires an ID for the element       {           node.id = "dojoToolTip-"+i;           i++;       }       var tt = new dijit.Tooltip({label:node.title, connectId:[node.id]});       node.title = ""; // remove the Browsers standard title tag   }); });

The code selects all elements with the class “withTooltip” and creates a Tooltip dijit for each of the found elements. It is important to notice that an ID is being added in case there is none – dijit.Tooltip requires an id and does not seem to work with classes or just an element being specified.

A very interesting but kept me busy now for quite some time, the following code does not work in IE:

var list = ["a", "b", "c", ];

As the code has been way more complex it was a bit harder to find the extra comma at the end and interestingly I already read about this a while ago… shame on me!

Nevertheless the error message is scary and useless:

IE6, please leave now!

Das tut weh, wenn ich so etwas lese:
Besonders die Kombination aus dem Copyright 2008 und dem “Browser” IE6 sowie der Einsatz von JavaScript, welcher für diese Site absolut nicht notwendig ist, macht mich traurig.
Sehr traurig.

Belustigend finde ich hingegen, dass in der Anleitung erklärt wird wie man im Netscape JavaScript aktiviert… dieser Browser ist nämlich wirklich tot, IE6 hält sich ja leider trotz seines hohen Alters und zum Leidwesen von tausenden Webdesignern nach wie vor….