How you dare to say that? I hear you saying.. Wait wait wait… Put down those torches… I may have a point here.
At the office I spent the last two days hunting a javascript bug on IE6, imagine how painful that can be, with no Firebug to come to rescue.
It happens that we are using the symfony sfCombine plugin to improve the performance of the website. Everything was going OK until someone dare to test the website with IE6. Imagine the picture: layout broken, javascript errors popping all around, mayhem, etc.
The bug was in a image gallery made with a Prototype based carousel library. After going to the line with the javascript error I saw that some extensions that the library performs on Prototype using Element.addMethods() didn’t worked at all.
Then the hunt started, as almost every time, in the wrong direction. -Maybe a lost semicolon that breaks the combinations. -No no, I think that the nginx is not sending the correct mime types. Etc. You can imagine all the thoughts going here and there.
I spent hours in front of IE6, hitting refresh, cleaning the browser cache, adding breakpoints in the Microsoft (R) Script(R) Editor(R), inspecting the objects in memory, evaluating Javascript code, etc.
No results. Nothing. Just null is null or not an object.
A fellow colleague was in charge of the integration of the sfCombine plugin. He showed me that he added some logs, to see the combined Javascript Files. I went to the command line, I checked the symfony logs, and Voila! Opa Opa! Prototype was being combined twice! At the beginning of the combined file and at the end. This caused that all the extensions added to Prototype by the carousel library were lost afterwards, because Prototype was redeclared in the second inclusion.
How did Firefox and friends to handle this issue and showed us a working image gallery is beyond my knowledge. I can say that it silently worked, but in IE6 it failed, as expected.
The next step was to see why Prototype was included twice. Bear with me, the mystery is about to be solved.
Symfony allows to include javascript files with and without the .js extension. In a view.yml file is the same writing javscripts: [prototype.js] as doing javascripts: [prototype] . It happened that there was another plugin including Prototype somewhere outside of the view.yml file and because it was using the .js extension and our view.yml configuration didn’t, then we had two Prototypes at the price of one.
After some findings we saw that the sfCombine plugin had a bug regarding javascript inclusion. For it prototype and prototype.js where two different files, which is not the case if you use symfony own AssetHelper. Comparing the code between the sfCombine get_combined_javascripts and symfony get_javascripts we found that there was a bug in the plugin usage of array_merge, bug that exists also in the get_combined_stylesheets function.
We fixed the bug, deployed the changes and pressed F5 in IE6. Bam! Bug out. Working image gallery, happy product owner. Next!
At the end of the story we can say that IE6 spotted a bug that nor Firefox or Safari had complained about, and is not the first time that I run through this kind of situation and I Was Told (TM) by another colleague of suffering similar situations.
This is why I tried to make a little justice in favor of the good ol’ IE6, so please put that torch down :-)
3 Responses to
“IE6 The Best Javascript Debugger Ever. Period!”
gabriel says on November 13th, 2009 at 10:13 pm
maybe it didn’t fail “as expected” but “because it miserably fails to handle exceptional cases”.
Debugging Javascript in IE is a complete PITA (because there _is_ no real debugging for JS in IE).
Camilo Martin says on December 13th, 2009 at 12:26 pm
Ok, I won’t kill you then. *puts the torch down*
Awesemo says on February 24th, 2010 at 3:27 am
I gree with you IE6 Javascript Script Editor works great when it comes to debugging event handlers. I like the “Break at Next Statement” function, where in the debugger will popup once a javascript statement have been executed. :) I hope firefox should come up with the same feature.
Leave a Reply