1288389 - Make the new eyedropper UI adapt to the zoom level in the page.

Status: NEW

(DevTools :: Inspector, defect, P2)

Description

[Patrick Brosset <:pbro>]

Since bug 1262439, the eyedropper has become a highlighter.
This means that it is injected into the content page and, therefore, is subject to its zoom level.

Right now, if you zoom in or out, the eyedropper UI becomes bigger or smaller, like the rest of the page.

However, the eyedropper UI is a logical part of devtools, not the page. It just happens to be in the page.

So, just like we do for other highlighters (like the box-model one), we'd like to make it adapt to the zoom level.

When the page is zoomed in, make the eyedropper smaller so it still looks the same.
And when the page is zoomed out, make the eyedropper bugger, so it still looks the same.

We have a helper function already that should do that: 
http://searchfox.org/mozilla-central/rev/6bb28c9903fe38d445cd2d3b17af4eabdade9335/devtools/server/actors/highlighters/utils/markup.js#480-514
but it produces really bad results in that case. The eyedropper appears pixelated or blurry.

Comment 1

[Patrick Brosset <:pbro>]

Inspector bug triage (filter on CLIMBING SHOES).

Comment 3

[arni2033]

(In reply to Patrick Brosset <:pbro> from comment #0)
> but it produces really bad results in that case. The eyedropper appears pixelated or blurry.
... Yes, just like in any other case it's used, like bug 1204914. If in this bug you're going to apply
that function to the new eyedropper, and also fix the blur effect, please make sure it's also fixed in
bug 1204914. But I as a user personally prefer the following options:
a) to use that function anyway and ignore the blur effect for now, because
  (I'm 99% sure) it's a Core:Layout bug and won't go away anytime soon
b) to back out bug 1262439 to provide a good UI
c) to use new XUL panels API to re-implement XUL panel for the eyedropper
  (and possibly for highlighter in bug 1204914)