Capture console log of an iframe

Question

Is there a way to capture the console outside of an iframe?

I'm working on an online IDE similar to jsFiddle and I wanted to give the users to option to at least read the results of the javascript console.

Answer 1

If you want to print the log messages inside the window container's body, it is possible to declare the panel there:

var console = {     panel: $(parent.document.body).append('<div>'),     log: function(m){         this.panel.prepend('<div>'+m+'</div>');     }        }; console.log('message'); 

Answer 2

Here is another solution if you don't want to append to HTML

var console = {   __on : {},   addEventListener : function (name, callback) {     this.__on[name] = (this.__on[name] || []).concat(callback);     return this;   },   dispatchEvent : function (name, value) {     this.__on[name] = (this.__on[name] || []);     for (var i = 0, n = this.__on[name].length; i < n; i++) {       this.__on[name][i].call(this, value);     }     return this;   },   log: function () {     var a = [];     // For V8 optimization     for (var i = 0, n = arguments.length; i < n; i++) {       a.push(arguments[i]);     }     this.dispatchEvent("log", a);   } }; 

Outside the iframe

iframe.contentWindow.console.addEventListener("log", function (value) {   console.log.apply(null, value); });