Closed Bug 1419792 Opened 3 years ago Closed 3 years ago
Shapes highlighter drawn inaccurately for shape-outside with negative margins (59 Branch)
749.48 KB, image/png
59 bytes, text/x-review-board-request
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:59.0) Gecko/20100101 Firefox/59.0 Build ID: 20171122103138 Steps to reproduce: 1. Go to https://meyerweb.com/eric/thoughts/2017/03/20/handiwork/ 2. Inspect the image of the red KitchenAid stand mixer on the left side of the article, partway down the page. 3. Click the shape-editor icon for the shape-outside property on the image (make sure you have layout.css.shape-outside.enabled enabled in about:config) **NOTE**: I indicated 59 Branch in the Summary instead of the Version dropdown because the dropdown only goes to 58 Branch. Actual results: The handles are drawn with respect to the image, but the actual effect of the shape is calculated with respect to area inside the margins. Moving the handles reflows the text correctly (it seems) for the resulting shape. See attached screenshot of how Chrome represents the image’s margins and the shape handles. There is a negative left margin used to pull the image out of the content, which appears to be what’s confusing the shape editor. To be clear: the calculation of the actual shape, and the resulting flow of text around said shape, appears to be correct. It’s the drawing of the shape-editor handles and lines that appears to be incorrect. Expected results: The editor handles should be placed, and the lines drawn, with respect to where the actual shape is calculated.
Component: Untriaged → Developer Tools: Inspector
Priority: -- → P2
Assignee: nobody → mpark
Status: UNCONFIRMED → ASSIGNED
Ever confirmed: true
Comment on attachment 8931016 [details] Bug 1419792 - Shapes highlighter drawn inaccurately for shape-outside with margins. https://reviewboard.mozilla.org/r/202098/#review207542 ::: devtools/server/actors/highlighters/shapes.js:1455 (Diff revision 1) > prefix: "inset(", > coordParser: this.insetPoints.bind(this) > }]; > const geometryTypes = ["margin", "border", "padding", "content"]; > > - // default to border > + // default to border for clip-path, margin for shape-outside s/,/, and
Attachment #8931016 - Flags: review?(gl) → review+
Pushed by firstname.lastname@example.org: https://hg.mozilla.org/integration/mozilla-inbound/rev/019c7b6b48a1 Shapes highlighter drawn inaccurately for shape-outside with margins. r=gl
Hi everyone, i have retested this issue on Windows 10 , Windows 7 , Mac OSx and Linux using the latest version of nightly 62.0a1 (2018-05-29) and i can Confirm it as Fixed. I will mark it accordingly.
You need to log in before you can comment on or make changes to this bug.