If you think a bug might affect users in the 57 release, please set the correct tracking and status flags for Release Management.

Hard to skim console output

ASSIGNED
Assigned to

Status

()

Firefox
Developer Tools: Console
P3
normal
ASSIGNED
4 years ago
3 years ago

People

(Reporter: harth, Assigned: siddu)

Tracking

(Blocks: 1 bug)

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [lang=css])

Attachments

(2 attachments)

(Reporter)

Description

4 years ago
Created attachment 757066 [details]
Screenshot of Console output that is hard to grok

The console looks way better than the Error Console, but I find it takes longer to find errors I'm searching for because of the styling of the output.

I've attached a screenshot of some output I was looking at earlier. All the errors blend together.

Maybe a light grey divider line between messages is on order?
We could definitely use some styling help here and are open to suggestions. Separators might be a little harsh, but what about alternating background styles? And of course, a dark theme would be excellent.

Updated

4 years ago
Blocks: 778766
Priority: -- → P3
Created attachment 8374374 [details]
error-comparison.png

I'd like to chime in that when there is a syntax error, and it can be hard to detect that it has happened until looking closely.  For me, this is super common (maybe from missing a comma between properties object props, forgetting to close a bracket, etc), and I really like when that simple issue jumps out at me.  Maybe just printing JS errors in red could help with this?  Turning off net logs by default would also make it easier to find (this screenshot was taken on a brand new profile), though I still think that making errors stand out visually with text color would be very helpful.
(In reply to Brian Grinstead [:bgrins] from comment #2)
> Created attachment 8374374 [details]
> error-comparison.png
> 
> I'd like to chime in that when there is a syntax error, and it can be hard
> to detect that it has happened until looking closely.  For me, this is super
> common (maybe from missing a comma between properties object props,
> forgetting to close a bracket, etc), and I really like when that simple
> issue jumps out at me.  Maybe just printing JS errors in red could help with
> this?  Turning off net logs by default would also make it easier to find
> (this screenshot was taken on a brand new profile), though I still think
> that making errors stand out visually with text color would be very helpful.

Yep, I also vote for changing the text color of errors to red.
Maybe this could be a good first bug to tweak the styling?
Yes
Mentor: mihai.sucan@gmail.com
Whiteboard: [lang=css]
(Assignee)

Comment 6

3 years ago
I would like to assigned to this bug, could someone assign me please.
Assignee: nobody → siddu244
Status: NEW → ASSIGNED
Sorry, currently I'm unable to mentor any bugs, due to health reasons. Please ping someone else on irc in #devtools - colleagues will be able to answer any questions you have.
Mentor: mihai.sucan@gmail.com

Comment 8

3 years ago
Would like to pick up this bug if siddu is not working on this.
I think it's safe to start working on this bug, it's been a while without any updates. Nowadays we don't usually assign bugs before a patch is actually submitted.
You need to log in before you can comment on or make changes to this bug.