1271615 - Inspector: Collapse/Expand toggle in "ev" popup and "Edit As HTML" is too small

Status: NEW

(DevTools :: Inspector, defect, P3)

Description

[Jens]

Attachment: Expand_Collapse_Code_in_event_popup_inspector.png

User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:48.0) Gecko/20100101 Firefox/48.0
Build ID: 20160508004021

Steps to reproduce:

1. Go to Inspector
2. Hover mouse over "ev" bubble to open popup
3. I clicked on the left hand side of the popup and thought that this would lead me to this very line in the Debugger.


Actual results:

However, this seems to be a way to collapse and expand code. The toogle button is hardly recognizable.

See screenshot taken with Developer Edition 48. I also tried the Nightly branch, where the toggles are a bit better visible but not much.


Expected results:

Just make the toggle button bigger and better visible.

I guess this issue might be a first good bug with lang=js

Comment 1

[magicp]

I confirmed in Mac OS X, Linux and Windows
This issue is in the source editor (e.g. Style editor, Shader Editor, Scratchpad...)

[chrome://devtools/content/sourceeditor/codemirror/mozilla.css]

.CodeMirror-foldgutter-open:after {
  font-size: 120%;
  content: "\25BE";
}

.CodeMirror-foldgutter-folded:after {
  font-size: 120%;
  content: "\25B8";
}

Comment 2

[Patrick Brosset <:pbro>]

Inspector bug triage (filter on CLIMBING SHOES).

Comment 3

[Jens]

Attachment: Small toggles in Edit HTML

FWIW: The toggle buttons are also too small and misaligned in Edit HTML box of the Inspector.