1619933 - “Switch back to inline mode” button can overlaps “Clear the Web Console output” button when devtools window is very narrow

Status: NEW

(DevTools :: Console, defect, P2)

Description

[Alexandru Trif, QA [:atrif]]

Attachment: overlap_multiline.png

Affected versions

• 75.0a1 (20200303214128)
• 74.0 (20200302184608)
• 73.0.1 (20200217142647)

Affected platforms

• Ubuntu 18.04
• Windows 10x64
• macOS 10.15

Steps to reproduce

1. Open Firefox and Web Console.
2. Press Customize Developer Tools and Get help button (3-dot ellipsis on the top right of the web console).
3. Select the Separate Window option.
4. Hit Ctrl+B and resize the console horizontally making it smaller.

Expected result

• No glitches are shown from resizing.

Actual result

• “Switch back to inline mode” button overlaps the “Clear the Web Console output” button.

Regression Range

• I will search for one ASAP if there is one.

Notes

• Attached a screenshot with the issue.

Comment 1

[Nicolas Chevobbe [:nchevobbe]]

Note that this isn't something caused by the separate window, as it will also appear if you have the toolbox docked to the right and set it at a very narrow width.

Comment 2

[Alexandru Trif, QA [:atrif]]

(In reply to Nicolas Chevobbe [:nchevobbe] from comment #1)

Note that this isn't something caused by the separate window, as it will also appear if you have the toolbox docked to the right and set it at a very narrow width.

Yes, you are right, thank you!

I also searched for a regression range and here are the results:
Last good revision: 613a1aca13b5d6872d6c77465f33f5143b0d42b4
First bad revision: c05c17a1b9b1768cf9e91a97de196011d7408216
Pushlog:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=613a1aca13b5d6872d6c77465f33f5143b0d42b4&tochange=c05c17a1b9b1768cf9e91a97de196011d7408216
Possible regressor: bug 1567372.

Comment 3

[Nicolas Chevobbe [:nchevobbe]]

we've the evaluation context selector, we're going to have even more narrow space in the editor toolbar, so we should definitely think of a wrapping mechanism

Comment 4

[Cristian Fogel, QA [:cfogel]]

Attachment: Screenshot 0002-03-24 at 14.29.59.png

Just noticed the same issue with the browser console, as it min-width is smaller.