Safari desktop inertial scrolling on scrollOverflow sections

[dolnikmate]

I have encountered an issue while using fullpage.js on Safari desktop. The problem arises when transitioning from fullscreen sections to a scrollable section (fp-auto-height with a lot of content, so its height is more than 100vh always, its scrollable because of that). It's only a safari issue on my end. Also i use the react-fullpage package for a nextjs project if that helps in determining the exact issue.

Here's the observed behavior: When I scroll from the fullscreen sections into the scrollable section, it seems to remember the initial swipe gesture used to transition between the sections. The scrollable section is mimicking the length of the swipe gesture made during the transition. The longer the swipe, the longer the scroll persists after reaching the scrollable section.

To provide a better understanding of this issue, I have recorded a video demonstration. Unfortunately, I am unable to record the actual project, but I have prepared a video showcasing the behavior on https://alvarotrigo.com/fullPage/extensions/scrolloverflow-reset.html . The video was captured on Firefox, where the behavior is the same as on Safari desktop for my project.

swipe.persist.fullpagejs.mov

[alvarotrigo]

https://alvarotrigo.com/fullPage/extensions/scrolloverflow-reset.html . The video was captured on Firefox, where the behavior is the same as on Safari desktop for my project.

This page is using the old version of fullPage.js, version 3. Which doesn't get updates anymore.

Are you able to reproduce the issue on the latest fullPage.js version 4.0.20?

[dolnikmate]

I just used this link for demonstration purposes, because the behavior is the same.
But if necessary i specify my end: I'm using "@fullpage/react-fullpage": "^0.1.39" inside a nextjs app, and this is the snippet from my code, using the ReactFullpage component(content is cleared out of each section, but the fp-auto-height section is holding a lot of things inside, will be seen on the video).

For demonstrating the exact behavior, i attach the following video:

behavior-showcase.mp4

[alvarotrigo]

Thanks for the clarification ;)

Yeap, looks like a bug.
I'll take a look at it, thanks for reporting it! 👍

[dolnikmate]

Hi, any update on this particular issue? Or a workaround i could use maybe?

[alvarotrigo]

Hi, any update on this particular issue? Or a workaround I could use maybe?

Nope.
This is way more tricky than it seems.

Safari keeps the inertial scrolling in the background and I can't find a way to get rid of it.
If you do, feel free to provide a PR ;)

[rouken-co]

+1 for this issue. If anyone finds a workaround please let me know!

[alvarotrigo]

@rouken-co @dolnikmate are you guys able to reproduce the issue here?
https://alvarotrigo.com/fullPage/examples/scrolling.html

I can't seem to do it the latest Safari Version 17.3.1 (19617.2.4.11.12).