Grid outline mouseover is slow

VERIFIED FIXED in Firefox 55

Status

()

Firefox
Developer Tools: Inspector
P3
normal
VERIFIED FIXED
5 months ago
2 months ago

People

(Reporter: pbro, Assigned: gl)

Tracking

(Blocks: 1 bug)

unspecified
Firefox 55
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox55 verified)

Details

MozReview Requests

()

Submitter Diff Changes Open Issues Last Updated
Loading...
Error loading review requests:

Attachments

(1 attachment)

(Reporter)

Description

5 months ago
While reviewing bug 1343447 I was testing the new grid outline widget. The widget supports mouse events so that, as you move, cells will get highlighted in the page.

STR:
- open this URL:
data:text/html,<div style="display:grid;grid-template-rows:repeat(50, 100px);grid-template-columns:repeat(20, 100px);">
- open the layout panel
- select the grid
- move your mouse very quickly over the outline, for a while

You will see that at some point, the cells don't get highlighted in the page in real time. The cell highlighter in the page either lags behind, or stays blocked at some previous cell, and finally highlights the right cell after a few seconds.

We should throttle this, otherwise it's pretty useless.
(Assignee)

Updated

5 months ago
Blocks: 1181227, 1347964
Priority: -- → P3
(Assignee)

Updated

5 months ago
Assignee: nobody → gl
Status: NEW → ASSIGNED
Comment hidden (mozreview-request)
(Reporter)

Comment 2

5 months ago
mozreview-review
Comment on attachment 8849246 [details]
Bug 1348256 - Throttle the grid outline mouseover.

https://reviewboard.mozilla.org/r/122062/#review125404

::: devtools/client/inspector/grids/components/GridOutline.js:13
(Diff revision 1)
>    require("devtools/client/shared/vendor/react");
> +const { throttle } = require("devtools/client/inspector/shared/utils");
>  
>  const Types = require("../types");
>  
> +const GRID_CELL_MOUSEOVER_TIMEOUT = 150;

Please add a comment before this const explaining what it is and that it's important for perf reasons, etc...
Attachment #8849246 - Flags: review?(pbrosset) → review+

Comment 3

5 months ago
Pushed by gabriel.luong@gmail.com:
https://hg.mozilla.org/integration/mozilla-inbound/rev/0c88e3aa3e3a
Throttle the grid outline mouseover. r=pbro

Comment 4

5 months ago
bugherder
https://hg.mozilla.org/mozilla-central/rev/0c88e3aa3e3a
Status: ASSIGNED → RESOLVED
Last Resolved: 5 months ago
status-firefox55: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → Firefox 55
(Assignee)

Updated

5 months ago
Flags: qe-verify+

Comment 5

4 months ago
I have reproduced this issue on Firefox nightly according to (2017-03-17)

Fixing bug is verified on Latest Firefox Nightly--- Build ID:(20170429030208),User Agent:Mozilla/5.0 (Windows NT 6.1; rv:55.0) Gecko/20100101 Firefox/55.0

Tested OS-- Windows7 32bit
[testday-20170428]
I reproduced this issue using Fx55.0a1, build ID: 20170317111607, on Windows 10 x64.
I can confirm this issue is fixed, I verified using Fx55.0b3, on Windows 10 x64, macOS X 10.12.5 and Ubuntu 14.04 LTS.

Cheers!
Status: RESOLVED → VERIFIED
status-firefox55: fixed → verified
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.