Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Safari scroll behavior isn't patched on SSR #63

Open
jonathanmelville opened this issue Jul 22, 2021 · 2 comments
Open

Safari scroll behavior isn't patched on SSR #63

jonathanmelville opened this issue Jul 22, 2021 · 2 comments

Comments

@jonathanmelville
Copy link

When using vue-snap with SSR in a Nuxt app, I noticed that the scroll behavior of Safari isn't smooth when using the arrow buttons. After doing some digging I see where the seamless-scroll-pollyfill is being included to pollyfill Safari, but it's being excluded from the SSR.

This makes sense as the pollyfill looks for the window object which won't exist on the server, but it raises the question what is the recommended way of patching Safari if you're using SSR? Would the right approach be to include the polyfill in the mounted() hook on the client side?

@jonathanmelville
Copy link
Author

If anybody else encounters this, this is how I resolved it:

<script lang="ts">

import Vue from 'vue'
import { elementScrollToPolyfill } from 'seamless-scroll-polyfill'

export default Vue.extend({
  mounted() {
    if (!('scrollBehavior' in document.documentElement.style)) {
      elementScrollToPolyfill()
    }
  },
})
</script>

@jonathanmelville
Copy link
Author

Is this plugin still under active development?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant