Default Output for Output Component is Misleading

cc/ @freeCodeCamp/moderators This issue is that the Output component says that all outputs and console.log() statements will output to this mock “console”, however, in most cases, this is actually not the case.

Right now, the component really only serves as an indicator of whether or not the tests have passed and/or if the test suite is running. Occasionally console.log outputs will show up here if the correct code is in the editor when the page loads. But I don’t see challenge outputs here in any case.

Take this for example. A very simple challenge, with no output and no console.log() statement being shown (you will see the console.log() when you follow the link, but not when you run the challenge - the console.log() output would never be seen in the typical FCC “workflow”). Instead, all you get is:

// running tests
// tests completed

Or if the answer is wrong, a series of error messages.

However, I also tend to think that the error messages going here is redundant because the test case indicators themselves clearly indicate what is passing and what is failing. I think it would be more useful to have console.log() statements and return values be shown here instead.

If no one else agrees, I think at the least, we should change the default text so that campers are not misled as to what will be shown in the “console”. e.g. something besides this since neither really seems to be true:

/**
  * Your output will go here.
  * Any console.log() statements
  * will appear in here as well.
*/

[no-stack-dub-sack]

@systimotic Maybe we can remove blocked and add confirmed back to the labels to make it clear this is a confirmed issue, since there seemed to be some misunderstanding when this was first re-labeled?

[no-stack-dub-sack]

@BerkeleyFalse @raisedadead I do remember that other issue about the wrapping the function calls in console.log() to get the output, but I’ve tested that in a few places, and still don’t see the output in the output box (again, unless the correct code is loaded from a past solution when the page loads, once you run it - no output). Example.

Also, in regards to uncaught errors - I’m not sure I’m seeing this functionality - any serious syntax errors prevents the code from running altogether and you end up with the flash message at the bottom right “Something went wrong…”

Lastly, if there are uncaught errors, or incorrect test cases, will the errors completely replace the output of console.log() statements within the code itself and/or the output of final function statement? Error messages are helpful, but being able to see what your code outputs or to log something mid-way through a transformation is more helpful if you are stuck on something.

Personally, I’m partial to the idea that all campers should be using the browser’s console anyway, but this won’t be the case with many new users who haven’t quite figured out how much better it is yet.