Problems Upgrading to IE 8

Upgrading to Internet Explorer 8.0

There are plenty of sites already out there listing all the many bugs or "features" that IE 8 has brought to the table but so far the two main ones I have come across are:


Problems when FirebugLite is also running in IE 8.

I was getting a "Function Expected" error on line 1499 in the IsArray function. As a workaround I added the following line as the first line in the function e.g

IsArray:function(_object){
if(!_object) return false;

This prevents the error but the Firebug-lite console does not display correctly in IE 8 when the document mode is also IE 8. To get round this I set the document mode to IE 7 and then it works fine.

Remember IE 8 now has a console in the developer tools options for outputting custom debug messages plus its now got a great debugger tool with all the same features as Firebug so Firebug-Lite isn't really needed anymore. However it should still be possible to run the two side by side.


Issue with clip and rect function

I also found an "invalid argument" error when setting the clip properties using the rect function. The code was for a scroller and the original version that raised the error was:

this.canvas.style.clip = "rect(0 " + this.canvasWidth + " " + this.canvasHeight + " 0)";

The fix was to add "px" after the dimension values and separate the values with commas e.g

this.canvas.style.clip = "rect(0px, " + parseInt(this.canvasWidth) + "px, " + parseInt(this.canvasHeight) + "px, 0px)";

I have come across a few errors such as "null is null or not an object" (you don't say!) which have been simple fixes and have just required testing the values correctly before using them.

I am sure there are hundreds more errors and that many many hours will be devoted to fixing them all in a similar manner to the last 2 major releases of IE. However overall I am very happy that they seem to have caught up with Firefox and the others and have implemented a pretty decent developer tools section including a great debugger that actually gives you a useful error message for once. Plus I like the fact that the GUI hasn't changed very much in the way that IE 6 to IE 7 did and I do like the little touches like the accelerators.

However its a shame that with such a major release they couldn't have gone the whole hog and sorted their Javascript engine out to make that standards compliant as well as the CSS. Apparently they have rewritten the whole JS engine so now was as good a time as any to bite the bullet and do it and they would have made the whole web development community very happy if they had done so. Even with the rewrite their event model is still pretty shoddy and even if they wanted to keep with their intermediary event model (attachEvent, removeEvent, returnValue, srcElement etc) then they could have fixed those annoying little issues that people have spent thousands of development hours resolving such as the this keyword referring to the window and not the object in question and attaching event listeners in order rather than randomly.

It seems pretty likely that more and more companies will get to the point where developing for IE becomes too much work and stop supporting it. Market share of Firefox, Chrome, Safari and Opera are increasing all the time so it may not be that long until you find a lot of sites just redirecting to a Mozilla download page when you access their site in IE. If that does happen then it might be a shame to some people but Microsoft will only have themselves to blame and may find that they have missed a great opportunity with this release to prevent that from occurring.

Comments For Script Articles - CSS Style Object, Linked Lists, Browser, Lazy Form Validator, Social Bookmarks

Example Scripts, Comments section

There are a number of scripts that I have posted on this site that are actually on another domain and therefore not part of blogger. Therefore I have added this article so that if anyone wants to post comments related to those scripts they can by adding them to this article.

Scripts List

JavaScript Unpacker. This simple form allows you to reverse engineer a block of JavaScript code that has been obfuscated by being encoded and is usually identified because the first few characters of the function look like this eval(p,a,c,k,e,r) . This method is usually used by hackers to try and hide the types of operation they are trying to carry out so its a wonderful way of being able to work out what the code is doing. Just paste the packed code into the box at the top, hit the "Unpack" button and hey presto you now have some readable code

CSS Style Object. A Javascript object that correctly calculates the computed style for Internet Explorer. Currently the example is using a function dedicated to correctly calculating styles for font-sizes but the core details could be applied to other styles requiring a computed size in pixels.

Querystring Parser: A small Javascript object dedicated to parsing a querystring something I thought would be inbuilt into the language but isn't. This article is on the blog and has its own comment section.

Linked Lists: A Javascript object dedicated to handling linked lists where the list box options in a parent list control the options that appear in a child list. The source of the data within the lists is not important this object controls the event handlers and the flow down of the hierarchy when a parent list has an item change as well as other default display options.

Lazy Form Validator: A Javascript object that can be used either in full production or when you want to quickly add client side form validation to a page with nothing more than including a reference to this script and then setting specific classes on each form element if special validation is required.

Social Bookmark Include: A simple include file and Javascript function that can be used on blogs or other sites to include links to social sites such as Digg, Stumble, Reddit etc. The script will append the appropriate URI and title details which it extracts from the source of the page containing the scripts. No need to customise the script on each page its used.

Browser Object. A little object dedicated to the now dirty art of browser sniffing containing details about css box model, spoofing, flash support, browser details etc. Most frameworks will still contain something similar and there are still cases where the the browser type and version is required knowledge due to feature support that cannot be tested with object testing.

Please specify which script you are commenting about when posting. Thanks.