1329785 - Fix CodeMirror scrolling in the event popup

Status: NEW

(DevTools :: Inspector, defect, P3)

Description

[Gabriel Luong [:gl] (ΦωΦ)]

1.Open devtools-Inspector
2.Click (ev) button next when available
3.Click on a script to unfold it and see see see Event Listener code
4.Except the fact the scroll bars are way too transparent and hard to see most of the time, you can NOT grab them to scroll [press left mouse button on scrollbar, then move mouse]
5.But if there is list of lots of event listener script, you can grab the scroll bars to browse through that list. It works in that case.

Comment 1

[Gabriel Luong [:gl] (ΦωΦ)]

Mike, is this something you can look into?

Comment 2

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

If it is a windows box then I would need to set a box up first so it would be faster for somebody else to take a look.

If it is OSX or Linux I can take a look now.

Which OS are you using?

Comment 3

[Gabriel Luong [:gl] (ΦωΦ)]

(In reply to Michael Ratcliffe [:miker] [:mratcliffe] from comment #2)
> If it is a windows box then I would need to set a box up first so it would
> be faster for somebody else to take a look.
> 
> If it is OSX or Linux I can take a look now.
> 
> Which OS are you using?

I am using OSX and this definitely affects all OS afaik.

Comment 4

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

I have managed to reproduce this... on OSX "Preferences" -> "General" -> "Show scroll bars" needs to be set to always. I usually have mine set to "When scrolling" so I have never seen this bug (it is a completely different scrollbar).

Comment 5

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Attachment: event.html

# STR

  1. Open the attached file.
  2. Inspect the button.
  3. Click "ev" next to the button in the markup view.
  4. Click the popup to expand the handler.
  5. Try to scroll by clicking the scrollwheel with the mouse.

## Actual

The mousedown event appears to pass through the scrollbar so dragging the mouse simply selects text.

## Expected

The scrollbar button is grabbed by the mousedown event and can be scrolled until a mouseup event is encountered.

Comment 6

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Seems to be a CodeMirror issue... the scrollbar has the attribute clickthrough="always". removing this attribute makes the scrollbar clickable.

Comment 7

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Not a Codemirror issue... the problem seems to be that we have two overlapping scrollbars. I am not sure how we can change this so that everything still looks nice but I am sure we can find a way.

Comment 8

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

I have found a way to separate the scrollbars but there is still some issue... I suspect that something is swallowing the mousedown event.

Comment 9

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

It turns out that the container has the following CSS property:

```
filter: drop-shadow(0 3px 4px var(--theme-tooltip-shadow));
```

When this is enabled it bizarrely makes the scrollbar thumb unclickable.

This clearly a platform issue so I have logged bug 1331481 so they can take a look.

When bug 1331481 is fixed we still need to separate the scrollbars because they are directly over each other at the moment.

Comment 10

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Filter on Brobdingnagian.

Comment 11

[Patrick Brosset <:pbro>]

This has been a P1 for 3 months, and isn't fixed yet. Do we still consider this a high priority fix? If yes, we should work on it right now. If not, then we should triage it to P2 or something else.

Comment 12

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

(In reply to Patrick Brosset <:pbro> from comment #11)
> This has been a P1 for 3 months, and isn't fixed yet. Do we still consider
> this a high priority fix? If yes, we should work on it right now. If not,
> then we should triage it to P2 or something else.

Yes, it is an edge case so let's downgrade it... it is still in my TODO list.

Comment 13

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Filter on HOTFROG.

Comment 14

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

No user reports... downgrading this to P3.