IE and console.log

14 Sep
September 14, 2012

Many a developer has been foiled by IE after developing and testing in Firefox and Chrome, using their Javascript debugging tools, and then running into weird inconsistencies in IE.  This is yet another of those stories.

With a recent project, we developed a website that allowed customers to use previously earned  ”points” to redeem them for free product. In order to redeem, they would visit a web page that allows them to type in sku, title, or isbn, find the product, and then submit.  This was seemingly straight forward.  We used jQuery autocomplete on the field and made an ajax call to find the titles that match what they’ve typed.  Everything seemed to be going along swimmingly until we realized that while developing, we hadn’t tested the autocomplete portion in IE.  Everything worked fine in Firefox and Chrome, but in IE, the autocomplete box wasn’t popping up.

We went back and started testing in IE to figure out the problem.  I confirmed I could replicate the problem, and then I tried to start debugging it using the built-in IE developer tools.  I then did a page refresh, and everything worked.  Confused, I tried a few more times, closing and opening IE, and the problem seemed to be randomly happening.  Far too many hours later, I realized why the problem seemed to be random … I wasn’t keeping track of when I had developer tools open.  Once I paid attention to that really important detail, I discovered that I only had problems when developer tools were not open.

After this discovery, it didn’t take much Google searching to discover the problem.  We had put console.log messages in our Javascript, which IE does not support when the developer tools are not open.  The quick way to solve this is an easy stubbing out like so:

if (!window.console) window.console = {};
if (!window.console.log) window.console.log = function () { };

The small lesson learned is to be careful when using console.log.  The big lesson learned is to pay attention to everything you do while debugging or trying to discover the root cause of a problem.  If I had paid attention to when I had developer tools open, the problem would’ve been easily solvable, but instead I made it difficult on myself.  Oh well, lesson learned for next time …

Jason Lutz

Jason is the IT Manager at Findaway World but is a developer at heart.  He loves to solve technical problems and get stuff done.

More Posts

Tags: , ,
© Copyright 2017 Findaway. All rights reserved.