Subject: Web Console output: clarify policy for “undefined” after console.log()
Hello DevTools team,
I want a clear, official statement on Web Console output behavior.
In Firefox Web Console, after I run:
console.log("TEST")
the console prints the log line, then also prints undefined as the evaluation result. I understand that console.log() returns undefined, and that the console shows an evaluation result as part of REPL behavior.
My request:
-
Can you confirm this as intentional UI policy (not a defect)?
-
Is there a documented reference that defines this behavior and its rationale?
-
Does Firefox offer a setting to hide evaluation results for commands such as console.log(), or a mode that shows only console messages?
-
If no option exists, does a proposal exist for a preference or UI toggle (messages only vs messages plus evaluation result)?
Repro steps:
-
Open DevTools → Console
-
Run: console.log("TEST")
-
Observe: log output plus a separate undefined evaluation result
This behavior can confuse users, since undefined looks like an error even when script output stays correct.
Thanks for guidance and for any public documentation links.
Best regards,
Can you confirm this as intentional UI policy (not a defect)?
if you evaluate something in the console, we display the returned value. The spec do indicate that console.log returns undefined (Console Standard + Console Standard)
Is there a documented reference that defines this behavior and its rationale?
I don’t think it’s documented, but as said before, you evaluate something in the console, we show the returned value.
Does Firefox offer a setting to hide evaluation results for commands such as console.log(), or a mode that shows only console messages?
If no option exists, does a proposal exist for a preference or UI toggle (messages only vs messages plus evaluation result)?
No, we don’t have such thing. Hiding evaluation results could be confusing to the users.
There’s no proposal, for any UI that would hide evaluation results, I don’t think it would worth the cost of adding such thing?
Note that if you don’t have to wrap things in a console.log to have the result in the console.If you evaluate document.title, you will get the result printed.
Is there any other reason you’d want the evaluation results to be hidden?
Hello, thanks for the clear answer.
My main reason is this: in teaching or quick demo moments, the extra undefined line looks like an error to new users, even when output stays correct. I accept that the rule “show the return value” makes sense for a REPL.
Yes, I also use document.title directly, and I can get the result that way.
But I also want to ask this: for console.log(), what approach does the team recommend as “correct usage”? In other words, for a user who wants to show a value via console.log but also wants the result to appear without an “undefined looks like an error” impression, is there a practical, recommended pattern? For example, is there a suggested way to print a message and also show a meaningful evaluation result line instead of undefined?
Maybe a compromise can avoid confusion:
- Keep evaluation results by default.
- Add a small UI hint or a label such as “return value” near the arrow output, so users read it as a value, not as an error.
- Or add a short doc note in DevTools docs under the Web Console UI tour: “Arrow output shows the return value of the last expression;
console.log returns undefined.”
Would such a doc note or a UI label fit team goals?
But I also want to ask this: for console.log(), what approach does the team recommend as “correct usage”? In other words, for a user who wants to show a value via console.log but also wants the result to appear without an “undefined looks like an error” impression, is there a practical, recommended pattern? For example, is there a suggested way to print a message and also show a meaningful evaluation result line instead of undefined?
I’d say don’t use console.log in such case, you can directly do document.title instead of console.log(document.title), and it’s shorter, so I’d say use that.
undefined is not an error, it’s just a value, but I understand it can be spammy / confusing
I don’t think there’s a lot we can do here though. We evaluate an expression, this could be anything (e.g. console.log(document.title); myUndefinedVar;)
Add a small UI hint or a label such as “return value” near the arrow output,
there’s a title on the icon:
Or add a short doc note in DevTools docs under the Web Console UI tour: “Arrow output shows the return value of the last expression; console.log returns undefined.”
we could maybe do that, and explain that you don’t have to wrap things in console.log when evaluating in the console
Hello, thanks for the doc note idea.
This topic causes confusion for many users. On the internet, many threads and Q&A posts focus on the extra undefined line after console.log(...), and many people read it as an error. A short note in the DevTools docs can prevent that confusion and set the right expectation.
References:
So yes, a doc note can help a lot: users expect a clear explanation or a practical “what to do in the console” answer, and this can fill that gap.
Best regards
