Bug 156573 - CSS "repeating-linear-gradient" unstable/imprecise during resizing
Summary: CSS "repeating-linear-gradient" unstable/imprecise during resizing
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari 9
Hardware: Macintosh OS X 10.11
: P2 Minor
Assignee: Nobody
Keywords: InRadar
Depends on:
Reported: 2016-04-14 03:27 PDT by Tobi Reif
Modified: 2018-03-30 02:21 PDT (History)
2 users (show)

See Also:

Screenshot of https://codepen.io/anon/pen/VrmbRX in Safari 11.0.1 (13604.3.5) (295.71 KB, image/png)
2017-11-08 02:56 PST, Tobi Reif
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Tobi Reif 2016-04-14 03:27:46 PDT
Regarding this page:

In Safari 9, the pattern generated using CSS's "repeating-linear-gradient" is unstable/imprecise during resizing (when I move e.g. the right edge of the browser window).

(Probably best to try to reproduce it on a non-high-res screen.)

Related info:
In Chrome, the pattern is completely stable during resize.
Comment 1 Tobi Reif 2017-11-07 12:08:20 PST
Current URL: https://codepen.io/TobiReif/pen/BKrXMV .
Comment 2 Simon Fraser (smfr) 2017-11-07 14:17:18 PST
Can you simplify the test case to a single gradient with fewer stops?
Comment 3 Tobi Reif 2017-11-08 02:55:05 PST
Here you go:


Safari renders sets of 3 stripes, and also sets of 4 stripes. Also please resize ➞ chaos.

Works as expected in eg Chrome and Firefox.

I hope this can get fixed 😀
Comment 4 Tobi Reif 2017-11-08 02:56:18 PST
Created attachment 326317 [details]
Screenshot of https://codepen.io/anon/pen/VrmbRX in Safari 11.0.1 (13604.3.5)
Comment 5 Simon Fraser (smfr) 2017-11-08 07:21:39 PST
Thanks for the reduction!
Comment 6 Radar WebKit Bug Importer 2017-11-08 07:21:59 PST
Comment 7 Simon Fraser (smfr) 2017-11-08 11:14:46 PST
This is a bug in a framework below WebKit.
Comment 8 Tobi Reif 2017-11-08 12:06:28 PST
So it's necessary to file a bug report for that framework, right?
Comment 9 Tobi Reif 2017-11-28 04:21:11 PST
Current URL:

Has the issue been reported to the developers of the underlying framework?
Comment 10 Alexey Proskuryakov 2017-11-28 08:49:36 PST
Yes, it's been reported (the rdar:// link is an Apple internal link to the report). Marking as INVALID, as this is not a WebKit issue.

Thank you for reporting it!
Comment 11 Tobi Reif 2017-11-28 08:59:28 PST

Ideally you'd leave it open until https://tobireif.com/demos/css_pattern/ works correctly in Safari. I'd hope to automatically get an email notification, which would allow me to then delete the text in https://tobireif.com/demos/css_pattern/ -> "show info" :

"Might not work correctly in Safari: [link:]bug report."
Comment 12 Tobi Reif 2018-03-30 02:21:28 PDT
Works perfectly now. Thanks!