866524 - Add a way for live samples to dump output to a box on page

Status: RESOLVED WONTFIX

(developer.mozilla.org Graveyard :: General, defect)

Description

[Eric Shepherd [:sheppy]]

What problems would this solve?
===============================
It would be awesome if console.log() could output to a box right on the page when used in live samples. This would let us more easily, for example, write simple samples for JavaScript documentation, where we could then output the text output for, say, regexps and the like.

Who would use this?
===================
Many contributors to MDN docs.

What would users see?
=====================
When this feature is used, live sample iframes would be accompanied by an additional box showing the console output from the script running in that frame.

What would users do? What would happen as a result?
===================================================
When inserting a live sample, you'd use a special template or something to have an additional box that shows the console output for the sample; console output would then be drawn there.

Is there anything else we should know?
======================================
Obviously there may be implementation details here; perhaps we need to figure out another way. But having users need to open web console or JS console to see this output is far, far less than ideal; the point to live samples inline is to avoid having users need to open extra stuff to see the results of samples.

Comment 1

[Jean-Yves Perrier [:teoli]]

It would be a nice feature: but AFAIK console is not part of the Open Web Platform. I know that Google implemented in its devtools a compatible object, but there are no requirement by other browser maker to do the same.

We need a solution that also work if console doesn't exist.

Comment 2

[John Karahalis [:openjck]]

As someone who has been using a lot of jsFiddle lately, I think this could be very helpful. And Code Academy does something very similar (see the gray box below the code in the following example).

http://uxebu.com/blog/wp-content/uploads/2012/01/codecademy.png

Comment 3

[Eric Shepherd [:sheppy]]

(In reply to Jean-Yves Perrier [:teoli] from comment #1)
> It would be a nice feature: but AFAIK console is not part of the Open Web
> Platform. I know that Google implemented in its devtools a compatible
> object, but there are no requirement by other browser maker to do the same.
> 
> We need a solution that also work if console doesn't exist.

Well... if we implemented a console.log function ourselves, and are routing its output to a custom box, it doesn't matter if the browser supports it or not. That's half the point here. :)

Comment 4

[BMO Automation]

MDN Web Docs' bug reporting has now moved to GitHub. From now on, please file content bugs at https://github.com/mdn/sprints/issues/ and platform bugs at https://github.com/mdn/kuma/issues/.