I’m not too sure how many of you have come across this but I’m thinking of this as A Good Reminder Post also known as the Public Service Announcement and at the very least a Very Curious Quirk of IE (in particular IE9 and below).
Sometimes when there is already so much going on in a project you might not realize what’s going on so let’s go through the typical scenario.
Sample code of a simple dropdown toggle link
So naturally you go into the developer tools to see whats up and BOOM it starts working all over again.
Well that was strange you think but you open the page again and nope nothing nada. So what’s really going on here?
console.log() or any other console type functionality. Ya see the
console object is only activated by the browser when the Dev Toolbar is opened. Without having it opened, the console object is undefined with no warnings and notification. Tragic I know. After the toolbar is opened the browser, the console object is defined even after you closed the development tools afterwards which gives you some false hopes that maybe you are going crazy. Either way there are some quick and simple solutions you can do to your code to get IE back up and rolling.
1) Remove or comment out all references to the console object from your code. Honestly, this is great stuff for when you are in development but calls to the console shouldn’t be made for production ready environment especially when it effects the users overall experience.
2) But hey if you want to keep in the console references by all means go for it but you’re gunna want to wrap those references in an
if(!window.console) statement so that if can check whether the console object exists before calling it.
And now we are back to business.
See not as bad as you thought
Solution: Remove/comment console from JS files for IE compatibility or Add if
!window.console statement around console references