1741822 - Transform highlighter for `translate` on `:before` element are erroneous

Status: NEW

(DevTools :: Inspector: Rules, defect, P3)

Description

[Nicolas Chevobbe [:nchevobbe]]

Attachment: transform highlighter for before pseudo element

Steps to reproduce

1. Open data:text/html,<style>div:before {transform: translateX(100px);content: "";width: 20px;height: 20px;display: block;background: pink;}</style><div></div>
2. Right click on the pink square and select "inspect" to open the inspector
3. In the markup view, select the :before element
4. In the rule view, hover the translateX property value

Expected results

The highlighter is displayed, and shows that the square was moved 100px to the right

Actual results

The highlighter is displayed, but it seems that all the points of the square are link to the (0,0) point on the page (see attached screenshot)

---