Near the end of the day, as I was getting ready to wrap everything up and prepare the project for the next step, I just noticed that Internet Explorer and Opera were both ignoring my Javascript file. Gecko browsers seem to be doing fine, with no reported errors - what could it be? Maybe I forgot a console.log or something.
Internet Explorer was giving one of those not so obvious errors, with a completely false line number. After debugging the script for half an hour, I couldn't find any solution. Opera wasn't giving any error message and Internet Explorer was impossible to understand. Desperate, I tried to run the Javascript file from outside the browser, using Microsoft's Javascript Compiler. Bingo! Error on line 400 or something.
Here's an example page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <script type="text/javascript"> var my_buggy_object = { prop1: 'value', }; alert("No bug here!"); </script> </head> <body> </body> </html>
This is a very simple page, containing a few lines of Javascript that demonstrate the possible bug. Of course, the Javascript is syntactically incorrect (even though Gecko isn't complaining about this), as you can see there is a column right before the closing bracket (after 'value'). Normally this colon isn't needed and in most languages that I know of, is considered a syntax error.
If one tries to open the page in Firefox, the alert pops up telling us that everything went fine. On Internet Explorer and Opera, the alert doesn't pop-up at all - even more, no errors are reported! What's happening? I believe it is probably related with the misplaced column that confuses the parsers from both faulty browsers.
