1412278 - Resizing shapes using CSS shapes editor doesn't work properly within iframes

Status: VERIFIED FIXED

(DevTools :: Inspector, defect)

Description

[Sebastian Zartner [:sebo]]

Shapes used within the CSS clip-path property can't be properly resized using the CSS shapes editor when they are within an iframe.

Example:
1. Go to https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path
2. Inspect the HTML example for 'clip-path: circle(25%)'
3. Toggle the CSS shapes editor on
4. Try to resize the circle

=> The clipping circle resizes incorrectly. Afterwards the handler of the circle can't be dragged anymore.

Comment 1

[Mike Park [:mparkms]]

Attachment: Bug 1412278 - Fix CSS shapes editing for shapes in iframes where points are outside the frame.

Review commit: https://reviewboard.mozilla.org/r/195926/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/195926/

Comment 2

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

Comment on attachment 8924704 [details]
Bug 1412278 - Fix CSS shapes editing for shapes in iframes where points are outside the frame.

https://reviewboard.mozilla.org/r/195926/#review201152

::: devtools/server/actors/highlighters/shapes.js:766
(Diff revision 1)
>     *          relative to the page
>     *
>     * @memberof ShapesHighlighter
>     */
>    convertPercentToPageCoords(x, y) {
> -    let { top, left, width, height } = this.zoomAdjustedDimensions;
> +    let dims = (this.highlighterEnv.window.document === this.currentNode.ownerDocument) ?

We can remove the brackets.

Comment 3

[Mike Park [:mparkms]]

Comment on attachment 8924704 [details]
Bug 1412278 - Fix CSS shapes editing for shapes in iframes where points are outside the frame.

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/195926/diff/1-2/

Comment 4

[Ryan VanderMeulen [:RyanVM]]

Autoland can't push this until all pending issues in MozReview are marked as resolved.

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/c708d8efbaa3
Fix CSS shapes editing for shapes in iframes where points are outside the frame. r=gl

Comment 6

[Sebastian Hengst [:aryx] [limited availability until start of 2020] (needinfo on intermittent or backout)]

https://hg.mozilla.org/mozilla-central/rev/c708d8efbaa3

Comment 7

[Sebastian Zartner [:sebo]]

Works fine for me in Nightly 58.0a1 2017-11-08. Thank you for the quick fix!

Sebastian