border-image-repeat:round output doesn't match other browsers #11668

brentfulgham · 2023-03-18T00:01:06Z

`255da9f`

border-image-repeat:round output doesn't match other browsers
https://bugs.webkit.org/show_bug.cgi?id=155955
<rdar://problem/28213711>

Reviewed by Tim Nguyen.

The RoundTile and SpaceTile didn't take the scale factors computed in NinePieceImage,
so would arrive at incorrect counts. This caused the logic to scale images when it
should have left them unscaled, and simply tiled (or spaced) the elements.

This change progresses four WPT tests:
(1) border-image-repeat-round.html
(2) border-image-round-and-stretch.html
(3) border-image-slice-percentage-test.html
(4) border-image-space-001.html

* Source/WebCore/platform/graphics/Image.cpp:
(WebCore::Image::drawTiled):

Canonical link: https://commits.webkit.org/261903@main

c64f115

Misc	iOS, tvOS & watchOS	macOS	Linux	Windows
✅ 🧪 style	✅ 🛠 ios	✅ 🛠 mac	✅ 🛠 wpe	~~🛠 wincairo~~
✅ 🧪 bindings	✅ 🛠 ios-sim	~~🛠 mac-AS-debug~~	~~🧪 wpe-wk2~~
✅ 🧪 webkitperl	~~🧪 ios-wk2~~	~~🧪 api-mac~~	✅ 🛠 gtk
	~~🧪 api-ios~~	~~🧪 mac-wk1~~	~~🧪 gtk-wk2~~
	✅ 🛠 tv	~~🧪 mac-wk2~~	~~🧪 api-gtk~~
	~~🛠 tv-sim~~	~~🧪 mac-AS-debug-wk2~~
	~~🛠 watch~~	~~🧪 mac-wk2-stress~~
❌ 🛠 🧪 merge	✅ 🛠 watch-sim

webkit-early-warning-system · 2023-03-18T00:01:12Z

EWS run on previous version of this PR (hash 2637927)

Misc	iOS, tvOS & watchOS	macOS	Linux	Windows
✅ 🧪 style	✅ 🛠 ios	✅ 🛠 mac	✅ 🛠 wpe	✅ 🛠 wincairo
✅ 🧪 bindings	✅ 🛠 ios-sim	✅ 🛠 mac-AS-debug	✅ 🧪 wpe-wk2
✅ 🧪 webkitperl	✅ 🧪 ios-wk2	✅ 🧪 api-mac	✅ 🛠 gtk
	✅ 🧪 api-ios	❌ 🧪 mac-wk1	✅ 🧪 gtk-wk2
	✅ 🛠 tv	✅ 🧪 mac-wk2	⏳ 🧪 api-gtk
	✅ 🛠 tv-sim	❌ 🧪 mac-AS-debug-wk2
	✅ 🛠 watch	✅ 🧪 mac-wk2-stress
	✅ 🛠 watch-sim

nt1m

Can we see the WPT progressions in this patch?

brentfulgham · 2023-03-18T00:03:28Z

Can we see the WPT progressions in this patch?

I'll update the test expectations shortly. I wanted to see if EWS found any other issues.

smfr

Does this implement this part of the spec?

"The middle image's width is scaled by the same factor as the top image unless that factor is zero or infinity, in which case the scaling factor of the bottom is substituted, and failing that, the width is not scaled. The height of the middle image is scaled by the same factor as the left image unless that factor is zero or infinity, in which case the scaling factor of the right image is substituted, and failing that, the height is not scaled."

brentfulgham · 2023-03-20T16:12:50Z

Does this implement this part of the spec?

"The middle image's width is scaled by the same factor ... failing that, the height is not scaled."

I believe this logic is implemented in NinePieceImage::computeMiddleTileScale, with the possible exception that while zero width (and height) are accounted for, I'm not sure if it recognizes infinity.

nt1m

r=me but please export to WPT

nt1m · 2023-03-20T18:46:16Z

LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/border-image-repeat-round.html

@@ -6,6 +6,7 @@
    <link rel="help" href="http://www.w3.org/TR/css3-background/#border-images">
    <link rel="match" href="reference/border-image-repeat-round-ref.html">
    <meta name="assert" content="diamonds in corners should be red, and other diamonds should be orange, it should be 4 orange diamonds on each side.">
+    <meta name="fuzzy" content="0-92;0-3435">


Please use the longhand form for clarity, here and below.

Suggested change

<meta name="fuzzy" content="0-92;0-3435">

<meta name="fuzzy" content="maxDifference=0-92;totalPixels=0-3435">

webkit-early-warning-system · 2023-03-20T19:06:32Z

EWS run on previous version of this PR (hash 40ea80c)

Misc	iOS, tvOS & watchOS	macOS	Linux	Windows
✅ 🧪 style	✅ 🛠 ios	✅ 🛠 mac	⏳ 🛠 wpe	⏳ 🛠 wincairo
✅ 🧪 bindings	⏳ 🛠 ios-sim	⏳ 🛠 mac-AS-debug	⏳ 🧪 wpe-wk2
✅ 🧪 webkitperl	⏳ 🧪 ios-wk2	~~🧪 api-mac~~	✅ 🛠 gtk
	⏳ 🧪 api-ios	~~🧪 mac-wk1~~	~~🧪 gtk-wk2~~
	✅ 🛠 tv	~~🧪 mac-wk2~~	⏳ 🧪 api-gtk
	✅ 🛠 tv-sim	⏳ 🧪 mac-AS-debug-wk2
	⏳ 🛠 watch	~~🧪 mac-wk2-stress~~
	✅ 🛠 watch-sim

webkit-early-warning-system · 2023-03-20T20:37:22Z

EWS run on previous version of this PR (hash cc788d7)

Misc	iOS, tvOS & watchOS	macOS	Linux	Windows
✅ 🧪 style	✅ 🛠 ios	✅ 🛠 mac	✅ 🛠 wpe	✅ 🛠 wincairo
✅ 🧪 bindings	✅ 🛠 ios-sim	✅ 🛠 mac-AS-debug	❌ 🧪 wpe-wk2
✅ 🧪 webkitperl	~~🧪 ios-wk2~~	⏳ 🧪 api-mac	✅ 🛠 gtk
	~~🧪 api-ios~~	⏳ 🧪 mac-wk1	❌ 🧪 gtk-wk2
	✅ 🛠 tv	⏳ 🧪 mac-wk2	~~🧪 api-gtk~~
	✅ 🛠 tv-sim	~~🧪 mac-AS-debug-wk2~~
	✅ 🛠 watch	✅ 🧪 mac-wk2-stress
	✅ 🛠 watch-sim

webkit-early-warning-system · 2023-03-20T23:46:16Z

EWS run on current version of this PR (hash c64f115)

Misc	iOS, tvOS & watchOS	macOS	Linux	Windows
✅ 🧪 style	✅ 🛠 ios	✅ 🛠 mac	✅ 🛠 wpe	~~🛠 wincairo~~
✅ 🧪 bindings	✅ 🛠 ios-sim	~~🛠 mac-AS-debug~~	~~🧪 wpe-wk2~~
✅ 🧪 webkitperl	~~🧪 ios-wk2~~	~~🧪 api-mac~~	✅ 🛠 gtk
	~~🧪 api-ios~~	~~🧪 mac-wk1~~	~~🧪 gtk-wk2~~
	✅ 🛠 tv	~~🧪 mac-wk2~~	~~🧪 api-gtk~~
	~~🛠 tv-sim~~	~~🧪 mac-AS-debug-wk2~~
	~~🛠 watch~~	~~🧪 mac-wk2-stress~~
❌ 🛠 🧪 merge	✅ 🛠 watch-sim

https://bugs.webkit.org/show_bug.cgi?id=155955 <rdar://problem/28213711> Reviewed by Tim Nguyen. The RoundTile and SpaceTile didn't take the scale factors computed in NinePieceImage, so would arrive at incorrect counts. This caused the logic to scale images when it should have left them unscaled, and simply tiled (or spaced) the elements. This change progresses four WPT tests: (1) border-image-repeat-round.html (2) border-image-round-and-stretch.html (3) border-image-slice-percentage-test.html (4) border-image-space-001.html * Source/WebCore/platform/graphics/Image.cpp: (WebCore::Image::drawTiled): Canonical link: https://commits.webkit.org/261903@main

webkit-commit-queue · 2023-03-21T01:25:18Z

Committed 261903@main (255da9f): https://commits.webkit.org/261903@main

Reviewed commits have been landed. Closing PR #11668 and removing active labels.

brentfulgham self-assigned this Mar 18, 2023

brentfulgham added the Layout and Rendering For bugs with layout and rendering of Web pages. label Mar 18, 2023

nt1m requested a review from smfr March 18, 2023 00:01

nt1m reviewed Mar 18, 2023

View reviewed changes

webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Mar 18, 2023

smfr reviewed Mar 18, 2023

View reviewed changes

brentfulgham removed the merging-blocked Applied to prevent a change from being merged label Mar 20, 2023

brentfulgham force-pushed the eng/border-image-repeatround-output-doesnt-match-other-browsers branch from 2637927 to 40ea80c Compare March 20, 2023 18:06

nt1m approved these changes Mar 20, 2023

View reviewed changes

brentfulgham force-pushed the eng/border-image-repeatround-output-doesnt-match-other-browsers branch from 40ea80c to cc788d7 Compare March 20, 2023 20:37

webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Mar 20, 2023

brentfulgham removed the merging-blocked Applied to prevent a change from being merged label Mar 20, 2023

brentfulgham force-pushed the eng/border-image-repeatround-output-doesnt-match-other-browsers branch from cc788d7 to c64f115 Compare March 20, 2023 23:44

brentfulgham added the merge-queue Applied to send a pull request to merge-queue label Mar 20, 2023

webkit-commit-queue force-pushed the eng/border-image-repeatround-output-doesnt-match-other-browsers branch from c64f115 to 78a59f4 Compare March 21, 2023 01:20

webkit-commit-queue force-pushed the eng/border-image-repeatround-output-doesnt-match-other-browsers branch from 78a59f4 to 255da9f Compare March 21, 2023 01:24

webkit-commit-queue merged commit 255da9f into WebKit:main Mar 21, 2023

webkit-commit-queue removed the merge-queue Applied to send a pull request to merge-queue label Mar 21, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

border-image-repeat:round output doesn't match other browsers #11668

border-image-repeat:round output doesn't match other browsers #11668

brentfulgham commented Mar 18, 2023 •

edited by webkit-early-warning-system

webkit-early-warning-system commented Mar 18, 2023 •

edited

nt1m left a comment

brentfulgham commented Mar 18, 2023

smfr left a comment

brentfulgham commented Mar 20, 2023

nt1m left a comment

nt1m Mar 20, 2023

webkit-early-warning-system commented Mar 20, 2023 •

edited

webkit-early-warning-system commented Mar 20, 2023 •

edited

webkit-early-warning-system commented Mar 20, 2023 •

edited

webkit-commit-queue commented Mar 21, 2023

	<meta name="fuzzy" content="0-92;0-3435">
	<meta name="fuzzy" content="maxDifference=0-92;totalPixels=0-3435">

border-image-repeat:round output doesn't match other browsers #11668

border-image-repeat:round output doesn't match other browsers #11668

Conversation

brentfulgham commented Mar 18, 2023 • edited by webkit-early-warning-system

255da9f

webkit-early-warning-system commented Mar 18, 2023 • edited

nt1m left a comment

Choose a reason for hiding this comment

brentfulgham commented Mar 18, 2023

smfr left a comment

Choose a reason for hiding this comment

brentfulgham commented Mar 20, 2023

nt1m left a comment

Choose a reason for hiding this comment

nt1m Mar 20, 2023

Choose a reason for hiding this comment

webkit-early-warning-system commented Mar 20, 2023 • edited

webkit-early-warning-system commented Mar 20, 2023 • edited

webkit-early-warning-system commented Mar 20, 2023 • edited

webkit-commit-queue commented Mar 21, 2023

brentfulgham commented Mar 18, 2023 •

edited by webkit-early-warning-system

`255da9f`

webkit-early-warning-system commented Mar 18, 2023 •

edited

webkit-early-warning-system commented Mar 20, 2023 •

edited

webkit-early-warning-system commented Mar 20, 2023 •

edited

webkit-early-warning-system commented Mar 20, 2023 •

edited