Restoring console.log()

Question

For some reason, the prototype framework (or another JavaScript code) that is shipped with Magento is replacing standard console functions, so I can't debug anything. Writing down in JavaScript console console I get the following output:

> console
Object
assert: function () {}
count: function () {}
debug: function () {}
dir: function () {}
dirxml: function () {}
error: function () {}
group: function () {}
groupEnd: function () {}
info: function () {}
log: function () {}
profile: function () {}
profileEnd: function () {}
time: function () {}
timeEnd: function () {}
trace: function () {}
warn: function () {}

I'm using Google Chrome version 13.0.782.112 on Linux.

Prototype JavaScript framework, version 1.6.0.3

Is there a quick way to solve this?

Solution 1

For example,

delete console.log

would also restore console.log:

console.log = null;
console.log;         // null

delete console.log;
console.log;         // function log() { [native code] }

Solution 2

Since original console is in window.console object, try restoring window.console from iframe:

var i = document.createElement('iframe');
i.style.display = 'none';
document.body.appendChild(i);
window.console = i.contentWindow.console;
// with Chrome 60+ don't remove the child node
// i.parentNode.removeChild(i);

Works for me on Chrome 14.

Solution 3

Magento has the following code in /js/varien/js.js - comment it out & it will work.

if (!("console" in window) || !("firebug" in console))
{
    var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",
    "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];

    window.console = {};
    for (var i = 0; i < names.length; ++i)
        window.console[names[i]] = function() {}
}

Solution 4

Just in case that someone face this same situation. I did not replied to the original answer for Xaerxess because I don't have enough reputation to do it. Looks like that is the correct answer, but for some reason I notice sometimes it works in my software and sometimes not...

So I tried completing deleting before running the script and looks like everything is working fine 100% of times.

if (!("console" in window) || !("firebug" in console))
{

  console.log = null;
  console.log;         // null

  delete console.log;

  // Original by Xaerxess
  var i = document.createElement('iframe');
  i.style.display = 'none';
  document.body.appendChild(i);
  window.console = i.contentWindow.console;

}

Thank you to everybody.

Solution 5

delete window.console restores the original console object in Firefox and Chrome.

How does this work? window is a hosted object and usually it is implemented with a common prototype between all instances (you have many tabs in the browser).

Some dumb developers of external libraries/frameworks (or Firebug, etc.) override property console of the window instance, but it doesn't corrupt window.prototype. By the delete operator we are back dispatching from the console.* methods to prototype code.

View more solutions