1464377 - Browser Toolbox highlighter is influenced by transforms

Status: RESOLVED DUPLICATE of bug 1094959

(DevTools :: Inspector, defect)

Description

[Sebastian Zartner [:sebo]]

The highlighter of the Browser Toolbox Inspector is affected by transforms applied to the highlighted elements.

Test case:
1. Open the Network panel on this page (Ctrl+Shift+E)
2. Reload the page
3. Open the Browser Toolbox (Ctrl+Shift+Alt+I)
4. Click the Inspector button
5. Hover the timeline of an entry within the Network panel

=> The dashed line of the highlighter frame is transformed by the 'transform' property applied to the inspected element.

Tested this in Nightly 62.0a1 (2018-05-25).

Sebastian

Comment 1

[Patrick Brosset <:pbro>]

Confirmed. 
This is because the highlighter we use in the browser toolbox is based on using a CSS outline around the hovered element.
This is because that's the only kind of highlighter we have right now that works in XUL documents.

A few comments:
- If you use the iframe picker in the browser toolbox and select an HTML document instead (netmonitor/index.html), then  the nicer box-model highlighter will be used, and this one does not suffer from this issue.
- We have a bug to make our highlighters work in XUL documents too: bug 1094959.
- We could implement another highlighter that doesn't transform with the nodes it highlights and that works in XUL documents, but that's not going to be a priority knowing that:
  - this does not impact the feature too much
  - you can use the frame picker if needed
  - XUL is being (slowly, very slowly) removed.

So, based on this, I believe we should close this bug. Perhaps as a dup of 1094959.

Comment 2

[Sebastian Zartner [:sebo]]

Thank you for the detailed explanation, Patrick!

Question is, what happens first, bug 1094959 or the removal of XUL.

Instead of closing this as a duplicate of 1094959 you probably should have marked this bug as being blocked by it, I guess, but not a big deal.

Sebastian