feat: allow scrollToTop to be explicitly disabled (#4564)

Co-authored-by: James Homer <[email protected]>

packages/vue-app/template/router.js

@@ -59,8 +59,11 @@ const scrollBehavior = function (to, from, savedPosition) {
   // will retain current scroll position.
   let position = false
 
-  // if no children detected
-  if (to.matched.length < 2) {
+  // if no children detected and scrollToTop is not explicitly disabled
+  if (
+    to.matched.length < 2 &&
+    to.matched.every(r => r.components.default.options.scrollToTop !== false)
+  ) {
     // scroll to the top of the page
     position = { x: 0, y: 0 }
   } else if (to.matched.some(r => r.components.default.options.scrollToTop)) {

test/e2e/basic.browser.test.js

@@ -119,6 +119,15 @@ describe('basic browser', () => {
     expect(await page.$text('h1')).toBe('User: 1')
   })
 
+  test('/scroll-to-top', async () => {
+    const page = await browser.page(url('/scroll-to-top'))
+    await page.evaluate(() => window.scrollBy(0, window.innerHeight))
+    await page.nuxt.navigate('/scroll-to-top/other')
+    const pageYOffset = await page.evaluate(() => window.pageYOffset)
+    expect(pageYOffset).toBeGreaterThan(0)
+    page.close()
+  })
+
   test('/validate should display a 404', async () => {
     await page.nuxt.navigate('/validate')
 

test/fixtures/basic/pages/scroll-to-top/index.vue

@@ -0,0 +1,18 @@
+<template>
+  <div>
+    <NuxtLink to="/scroll-to-top/other">
+      go to other
+    </NuxtLink>
+  </div>
+</template>
+
+<script>
+export default {
+}
+</script>
+
+<style>
+div {
+  margin-top: 1500px;
+}
+</style>

test/fixtures/basic/pages/scroll-to-top/other.vue

@@ -0,0 +1,13 @@
+<template>
+  <div>
+    <NuxtLink to="/scroll-to-top">
+      go to index
+    </NuxtLink>
+  </div>
+</template>
+
+<script>
+export default {
+  scrollToTop: false
+}
+</script>