237616 2022-03-08 12:37:45 -0800 WebKit doesn't properly scale 'shape-outside' image area on floats 2022-03-10 10:18:09 -0800 1 1 1 Unclassified WebKit Layout and Rendering Safari 15 Unspecified Unspecified NEW InRadar P2 Normal --- 1 dholbert webkit-unassigned bfulgham simon.fraser webkit-bug-importer zalan oldest_to_newest 1849368 0 dholbert 2022-03-08 12:37:45 -0800 (note: this same bug exists in WebKit and Chromium. The Chromium version of this bug report is at https://bugs.chromium.org/p/chromium/issues/detail?id=1304373 .) What steps will reproduce the problem? (1) Load https://bugzilla.mozilla.org/attachment.cgi?id=9266906 What is the expected result? The "abc" text should be at the right edge of the black area on each line. What happens instead? The "abc" text is at the same position on the first 3 lines, and at a different position but still too-far-to-the-right on the 4th line. Firefox gives the expected result here. Chrome and Safari (Chromium/Blink + WebKit) give the above-described result which I'm pretty sure is incorrect. The relevant spec text is here, in the css-shapes-1 spec (where shape-outside is defined): https://www.w3.org/TR/css-shapes-1/#shapes-from-image Quoting: > The image is sized and positioned as if it were a replaced element whose specified width and height are the same as the element’s used content box size. In my testcase, I've included a replaced element (`<img>`) of that size on each line, so that you can see the proper size/position of the shape-outside image. Firefox seems to honor this spec text, whereas Chromium/WebKit don't seem to resize the shape-outside image at all, as far as I can tell. 1849371 1 454144 dholbert 2022-03-08 12:38:24 -0800 Created attachment 454144 testcase Here's a copy of the testcase that I linked in the initial comment, BTW. 1850157 2 webkit-bug-importer 2022-03-10 10:18:09 -0800 <rdar://problem/90106520> 454144 2022-03-08 12:38:24 -0800 2022-03-08 12:38:24 -0800 testcase test.html text/html 1667 dholbert PCFET0NUWVBFIGh0bWw+CjxodG1sPgo8aGVhZD4KICA8bWV0YSBjaGFyc2V0PSJ1dGYtOCIvPgog IDx0aXRsZT5UZXN0PC90aXRsZT4KICA8c3R5bGU+CiAgYm9keSB7IGNvbG9yOiBmdWNoc2lhOyB9 CiAgLnNoYXBlIHsKICAgIGhlaWdodDogMTBweDsKICAgIGJvcmRlcjogMnB4IHNvbGlkIGN5YW47 CiAgICBib3JkZXItYm90dG9tOiBub25lOwogICAgYmFja2dyb3VuZC1yZXBlYXQ6IG5vLXJlcGVh dDsKICAgIGZsb2F0OiBsZWZ0OwogICAgc2hhcGUtb3V0c2lkZTogdXJsKCdkYXRhOmltYWdlL3Bu ZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQVN3QUFBQUtDQVlBQUFBTyUyRjJQcUFB QUFOMGxFUVZSbzN1M1VNUUVBQUFqRHNJRiUyRnoyQ0NqMFJDajFhU0Nkd3JDYmpXRWdDR0JXQlln R0VCR0JhQVlRR0dCV0JZQUlZRiUyRkxEcWhnRVVOVjVaJTJGUUFBQUFCSlJVNUVya0pnZ2clM0Ql M0QnKTsKICB9CiAgaW1nIHsKICAgIGRpc3BsYXk6IGJsb2NrOwogICAgaGVpZ2h0OiAxMDAlOwog ICAgd2lkdGg6IDEwMCU7CiAgfQogIGJyIHsgY2xlYXI6IGJvdGg7IH0KICA8L3N0eWxlPgo8L2hl YWQ+Cjxib2R5PgogIDxkaXYgY2xhc3M9InNoYXBlIiBzdHlsZT0id2lkdGg6NjAwcHgiPgogICAg PGltZyBzcmM9ImRhdGE6aW1hZ2UvcG5nO2Jhc2U2NCxpVkJPUncwS0dnb0FBQUFOU1VoRVVnQUFB U3dBQUFBS0NBWUFBQUFPJTJGMlBxQUFBQU4wbEVRVlJvM3UzVU1RRUFBQWpEc0lGJTJGejJDQ2ow UkNqMWFTQ2R3ckNialdFZ0NHQldCWWdHRUJHQmFBWVFHR0JXQllBSVlGJTJGTERxaGdFVU5WNVol MkZRQUFBQUJKUlU1RXJrSmdnZyUzRCUzRCI+CiAgPC9kaXY+CiAgYWJjCgogIDxicj4KICA8ZGl2 IGNsYXNzPSJzaGFwZSIgc3R5bGU9IndpZHRoOjMwMHB4Ij4KICAgIDxpbWcgc3JjPSJkYXRhOmlt YWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQVN3QUFBQUtDQVlBQUFBTyUy RjJQcUFBQUFOMGxFUVZSbzN1M1VNUUVBQUFqRHNJRiUyRnoyQ0NqMFJDajFhU0Nkd3JDYmpXRWdD R0JXQllnR0VCR0JhQVlRR0dCV0JZQUlZRiUyRkxEcWhnRVVOVjVaJTJGUUFBQUFCSlJVNUVya0pn Z2clM0QlM0QiPgogIDwvZGl2PgogIGFiYwoKICA8YnI+CiAgPGRpdiBjbGFzcz0ic2hhcGUiIHN0 eWxlPSJ3aWR0aDoxODBweCI+CiAgICA8aW1nIHNyYz0iZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlW Qk9SdzBLR2dvQUFBQU5TVWhFVWdBQUFTd0FBQUFLQ0FZQUFBQU8lMkYyUHFBQUFBTjBsRVFWUm8z dTNVTVFFQUFBakRzSUYlMkZ6MkNDajBSQ2oxYVNDZHdyQ2JqV0VnQ0dCV0JZZ0dFQkdCYUFZUUdH QldCWUFJWUYlMkZMRHFoZ0VVTlY1WiUyRlFBQUFBQkpSVTVFcmtKZ2dnJTNEJTNEIj4KICA8L2Rp dj4KICBhYmMKCiAgPGJyPgogIDxkaXYgY2xhc3M9InNoYXBlIiBzdHlsZT0id2lkdGg6NDBweCI+ CiAgICA8aW1nIHNyYz0iZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlWQk9SdzBLR2dvQUFBQU5TVWhF VWdBQUFTd0FBQUFLQ0FZQUFBQU8lMkYyUHFBQUFBTjBsRVFWUm8zdTNVTVFFQUFBakRzSUYlMkZ6 MkNDajBSQ2oxYVNDZHdyQ2JqV0VnQ0dCV0JZZ0dFQkdCYUFZUUdHQldCWUFJWUYlMkZMRHFoZ0VV TlY1WiUyRlFBQUFBQkpSVTVFcmtKZ2dnJTNEJTNEIj4KICA8L2Rpdj4KICBhYmMKPC9kaXY+Cjwv Ym9keT4KPC9odG1sPgo=