228686 2021-07-31 20:47:29 -0700 scroll-snap-stop: always behaves like scroll-snap-stop: normal when using smooth scrolling 2022-05-11 06:06:20 -0700 1 1 1 Unclassified WebKit Scrolling Safari Technology Preview iPhone / iPad iOS 14 RESOLVED WORKSFORME InRadar P2 Normal --- 1 simon webkit-unassigned augus.dupin mrobinson simon.fraser webkit-bug-importer oldest_to_newest 1781125 0 simon 2021-07-31 20:47:29 -0700 I have a horizontal image carousel with five images and five navigation buttons. The slides are each 100vw in width and positioned with scroll-snapping. I am using iOS 15 Beta 4 and I have enabled 'CSSOM View Smooth Scrolling' under Experimental WebKit Features. /* partial css */ #gallery { scroll-snap-type: x mandatory; display: flex; } .slide { scroll-snap-align: center; scroll-snap-stop: normal; min-width: 100vw; width: 100vw; } The scrolling is triggered programatically when clicking a button using: document.getElementById('gallery').scrollTo({ left: offset, behavior: 'smooth' }); // offset is x position of n'th slide If I click to go from slide 1 > slide 5 then that obviously passes over all the snap stops in between. Then what happens is Safari abruptly stops on the second slide's snap point (the first it reaches). The behavior is exactly what I would expect from: scroll-snap-stop: always This is not supposed to happen with scroll-snap-stop: normal https://www.w3.org/TR/css-scroll-snap-1/#scroll-snap-stop Demo pending. Similar bug: https://bugs.webkit.org/show_bug.cgi?id=145330 https://bugs.webkit.org/show_bug.cgi?id=223406 1782915 1 mrobinson 2021-08-09 10:26:02 -0700 Hi Simon, thanks for reporting this issue! Do you have a testcase for this bug? 1782916 2 webkit-bug-importer 2021-08-09 10:26:19 -0700 <rdar://problem/81701291> 1867901 3 459108 augus.dupin 2022-05-10 04:54:09 -0700 Created attachment 459108 testcase I don't know whether there was initially a problem or not, but there is no problem today. I made a testcase where you can see that there is no problem with smooth scrolling over items with `scroll-snap-stop: normal` or `scroll-snap-stop: always`. It scrolls smoothly to the desired position in both cases, as intended. This ticket should probably be marked as fixed. 1868112 4 mrobinson 2022-05-11 06:06:20 -0700 Thanks! 459108 2022-05-10 04:54:09 -0700 2022-05-10 04:54:09 -0700 testcase scroll-snap-stop-smooth-scrolling.html text/html 1560 augus.dupin PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICAgIDxoZWFkPgogICAgICAgIDxtZXRh IGNoYXJzZXQ9IlVURi04IiAvPgogICAgICAgIDxtZXRhIGh0dHAtZXF1aXY9IlgtVUEtQ29tcGF0 aWJsZSIgY29udGVudD0iSUU9ZWRnZSIgLz4KICAgICAgICA8bWV0YSBuYW1lPSJ2aWV3cG9ydCIg Y29udGVudD0id2lkdGg9ZGV2aWNlLXdpZHRoLCBpbml0aWFsLXNjYWxlPTEuMCIgLz4KICAgICAg ICA8dGl0bGU+U2Nyb2xsLXNuYXAtc3RvcCBhbmQgc21vb3RoIHNjcm9sbGluZzwvdGl0bGU+CiAg ICAgICAgPHN0eWxlPgogICAgICAgICAgICBib2R5IHsKICAgICAgICAgICAgICAgIG1hcmdpbjog MDsKICAgICAgICAgICAgfQogICAgICAgICAgICBidXR0b24gewogICAgICAgICAgICAgICAgcG9z aXRpb246IGZpeGVkOwogICAgICAgICAgICB9CiAgICAgICAgICAgICNnYWxsZXJ5IHsKICAgICAg ICAgICAgICAgIHdpZHRoOiAxMDB2dzsKICAgICAgICAgICAgICAgIGhlaWdodDogMTAwdmg7Cgog ICAgICAgICAgICAgICAgb3ZlcmZsb3cteDogYXV0bzsKICAgICAgICAgICAgICAgIHNjcm9sbC1z bmFwLXR5cGU6IHggbWFuZGF0b3J5OwoKICAgICAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7CiAg ICAgICAgICAgIH0KICAgICAgICAgICAgLnNsaWRlIHsKICAgICAgICAgICAgICAgIHNjcm9sbC1z bmFwLWFsaWduOiBjZW50ZXI7CiAgICAgICAgICAgICAgICBzY3JvbGwtc25hcC1zdG9wOiBub3Jt YWw7CgogICAgICAgICAgICAgICAgbWluLXdpZHRoOiAxMDB2dzsKICAgICAgICAgICAgICAgIHdp ZHRoOiAxMDB2dzsKCiAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiBvcmFuZ2U7CiAg ICAgICAgICAgIH0KICAgICAgICAgICAgLnNsaWRlOm50aC1jaGlsZCgybikgewogICAgICAgICAg ICAgICAgYmFja2dyb3VuZC1jb2xvcjogZ3JlZW47CiAgICAgICAgICAgIH0KICAgICAgICA8L3N0 eWxlPgogICAgPC9oZWFkPgogICAgPGJvZHk+CiAgICAgICAgPGJ1dHRvbj5TY3JvbGwgdG8gMzwv YnV0dG9uPgogICAgICAgIDxkaXYgaWQ9ImdhbGxlcnkiPgogICAgICAgICAgICA8ZGl2IGNsYXNz PSJzbGlkZSI+PC9kaXY+CiAgICAgICAgICAgIDxkaXYgY2xhc3M9InNsaWRlIj48L2Rpdj4KICAg ICAgICAgICAgPGRpdiBjbGFzcz0ic2xpZGUiPjwvZGl2PgogICAgICAgICAgICA8ZGl2IGNsYXNz PSJzbGlkZSI+PC9kaXY+CiAgICAgICAgICAgIDxkaXYgY2xhc3M9InNsaWRlIj48L2Rpdj4KICAg ICAgICA8L2Rpdj4KICAgIDwvYm9keT4KICAgIDxzY3JpcHQ+CiAgICAgICAgY29uc3QgYnV0dG9u ID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcigiYnV0dG9uIik7CgogICAgICAgIGJ1dHRvbi5hZGRF dmVudExpc3RlbmVyKCJjbGljayIsICgpID0+IHsKICAgICAgICAgICAgZ2FsbGVyeS5zY3JvbGxU byh7CiAgICAgICAgICAgICAgICBsZWZ0OiB3aW5kb3cuaW5uZXJXaWR0aCAqIDIsCiAgICAgICAg ICAgICAgICBiZWhhdmlvcjogInNtb290aCIsCiAgICAgICAgICAgIH0pOwogICAgICAgIH0pOwog ICAgPC9zY3JpcHQ+CjwvaHRtbD4K