1473949 - Non-optimal screen space usage in console due to location message

Status: NEW

(DevTools :: Console, defect, P2)

Description

[Andrey]

Attachment: Wrong screen space allocation example

User Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

Steps to reproduce:

Opened debug console (F12) showing a logged error message,
while using vertical debug panel layout (debug panel is on the right side of the browser window)


Actual results:

Screen space allocation inside debug console is absolutely ridiculous - see the attached picture file. The white area marked with red "WTF?" text remains empty for no real purpose, but it should be used to display more data.
Such a failed screen space allocation severely reduces debug console usability when it has vertical layout.



Expected results:

File name should be placed somehow else (on the top, ..., whatever), especially when console has vertical layout. Now it steals half space available for data display. But it should not.

Comment 1

[Nicolas Chevobbe [:nchevobbe]]

Hello Andrey,

This is a known issue and we'll have a look at this soon.

Comment 3

[Gregg OD]

Woah this issue is 4 years old! Holy cow, no chance of this getting fixed then. Us front end developers must move to chrome or what should we do? Also proxied objects are a mess and seeing as thats the latest javascript craze, it further makes using firefox for developing tough to debug.

Any idea if this will ever get fixed?

Comment 4

[fonzane]

Attachment: Bug 1473949 - Edited devtools/client/themes/webconsole.css for improved space usage of the developer console. I hope I put the changes in acceptable places in the css file. r=#devtools-reviewers

Comment 5

[fonzane]

Attachment: WIP: Bug 1473949 - More refined solution for console space usage.

Thank you nchevobbe, I appreciate that you reviewed my commit and put work into it. I refined the solution and tried to fix the errors you pointed out. Sadly, as you also pointed out, the nesting of the elements is very complex and it seems impossible to find an elegant and simple solution. I couldn't find any better way than to apply absolute positioning to some elements and set their position pixel-wise.

In .tree-node[aria-expanded="true"] I would've prefered to set the height depending on the consoles font-size. Yet I don't know if and how that would be possible.

As for your point 3, I left the changes that put "hello" and "world" on seperate lines. IMO these strings should not be concatenated but kept on seperate lines, as they are two different values. r=#devtools-reviewers

Depends on D164838

Comment 6

[fonzane]

Attachment: Bug 1473949 - More refined solution for console space usage r=#devtools-reviewers

Thank you nchevobbe, I appreciate that you reviewed my commit and put work into it. I refined the solution and tried to fix the errors you pointed out. Sadly, as you also pointed out, the nesting of the elements is very complex and it seems impossible to find an elegant and simple solution. I couldn't find any better way than to apply absolute positioning to some elements and set their position pixel-wise.

In .tree-node[aria-expanded="true"] I would've prefered to set the height depending on the consoles font-size. Yet I don't know if and how that would be possible.

As for your point 3, I left the changes that put "hello" and "world" on seperate lines. IMO these strings should not be concatenated but kept on seperate lines, as they are two different values.

Depends on D164838

Comment 7

[Jan Honza Odvarko [:Honza] (always need-info? me)]

This is great layout enhancement for the Console panel. Any chance we could revive the work here?
Anything blocking us from making a progress?

Another request for this feature made on Connect
https://connect.mozilla.org/t5/ideas/devtools-console-ui-improvements/idi-p/36745

Thank you!

Comment 8

[BugBot [:suhaib / :marco/ :calixte]]

Redirect a needinfo that is pending on an inactive user to the triage owner.
:nchevobbe, since the bug has recent activity, could you have a look please?

For more information, please visit BugBot documentation.

Comment 9

[BugBot [:suhaib / :marco/ :calixte]]

The bug assignee is inactive on Bugzilla, so the assignee is being reset.

Comment 10

[Nicolas Chevobbe [:nchevobbe]]

I tried to work on this a few time and it's been challenging, I'll check again and summarize my findings