From 65e0ba4c12cdd1d12d4c3613e8965eb0c01fa1ca Mon Sep 17 00:00:00 2001 From: Cody Jackson Date: Wed, 21 Feb 2024 16:34:18 -0700 Subject: [PATCH] Removing everything related to scrollTrigger. The latest vue router seems to behave exactly as it does with the modified scrollBehavior so it can all be removed. --- shell/components/nuxt/nuxt-child.js | 5 -- shell/config/router.js | 2 - shell/initialize/client.js | 11 ---- shell/utils/router.scrollBehavior.js | 78 ---------------------------- 4 files changed, 96 deletions(-) delete mode 100644 shell/utils/router.scrollBehavior.js diff --git a/shell/components/nuxt/nuxt-child.js b/shell/components/nuxt/nuxt-child.js index 5429fa5abb3..fd8a70a8375 100644 --- a/shell/components/nuxt/nuxt-child.js +++ b/shell/components/nuxt/nuxt-child.js @@ -30,13 +30,8 @@ export default { const listeners = {} - // Add triggerScroll event on beforeEnter (fix #1376) const beforeEnter = listeners.beforeEnter listeners.beforeEnter = (el) => { - // Ensure to trigger scroll event after calling scrollBehavior - window.$nuxt.$nextTick(() => { - window.$nuxt.$emit('triggerScroll') - }) if (beforeEnter) { return beforeEnter.call(_parent, el) } diff --git a/shell/config/router.js b/shell/config/router.js index 8bfffcd2856..c010eeb825f 100644 --- a/shell/config/router.js +++ b/shell/config/router.js @@ -2,7 +2,6 @@ import Vue from 'vue'; import Router from 'vue-router'; import { normalizeURL } from 'ufo'; import { interopDefault } from '../utils/nuxt'; -import scrollBehavior from '../utils/router.scrollBehavior.js'; const emptyFn = () => {}; @@ -12,7 +11,6 @@ export const routerOptions = { mode: 'history', // Note: router base comes from the ROUTER_BASE env var base: process.env.routerBase || '/', - scrollBehavior, routes: [ { diff --git a/shell/initialize/client.js b/shell/initialize/client.js index 7f2210990bc..f91bde107ca 100644 --- a/shell/initialize/client.js +++ b/shell/initialize/client.js @@ -488,8 +488,6 @@ function fixPrepatch(to, ___) { const instances = getMatchedComponentsInstances(to); const Components = getMatchedComponents(to); - let triggerScroll = false; - Vue.nextTick(() => { instances.forEach((instance, i) => { if (!instance || instance._isDestroyed) { @@ -507,18 +505,9 @@ function fixPrepatch(to, ___) { for (const key in newData) { Vue.set(instance.$data, key, newData[key]); } - - triggerScroll = true; } }); - if (triggerScroll) { - // Ensure to trigger scroll event after calling scrollBehavior - window.$nuxt.$nextTick(() => { - window.$nuxt.$emit('triggerScroll'); - }); - } - checkForErrors(this); // Hot reloading diff --git a/shell/utils/router.scrollBehavior.js b/shell/utils/router.scrollBehavior.js deleted file mode 100644 index 2558043ae7c..00000000000 --- a/shell/utils/router.scrollBehavior.js +++ /dev/null @@ -1,78 +0,0 @@ -import { getMatchedComponents, setScrollRestoration } from './nuxt'; - -if ('scrollRestoration' in window.history) { - setScrollRestoration('manual'); - - // reset scrollRestoration to auto when leaving page, allowing page reload - // and back-navigation from other pages to use the browser to restore the - // scrolling position. - window.addEventListener('beforeunload', () => { - setScrollRestoration('auto'); - }); - - // Setting scrollRestoration to manual again when returning to this page. - window.addEventListener('load', () => { - setScrollRestoration('manual'); - }); -} - -function shouldScrollToTop(route) { - const Pages = getMatchedComponents(route); - - if (Pages.length === 1) { - const { options = {} } = Pages[0]; - - return options.scrollToTop !== false; - } - - return Pages.some(({ options }) => options && options.scrollToTop); -} - -export default function(to, from, savedPosition) { - // If the returned position is falsy or an empty object, will retain current scroll position - let position = false; - const isRouteChanged = to !== from; - - // savedPosition is only available for popstate navigations (back button) - if (savedPosition) { - position = savedPosition; - } else if (isRouteChanged && shouldScrollToTop(to)) { - position = { x: 0, y: 0 }; - } - - const nuxt = window.$nuxt; - - if ( - // Initial load (vuejs/vue-router#3199) - !isRouteChanged || - // Route hash changes - (to.path === from.path && to.hash !== from.hash) - ) { - nuxt.$nextTick(() => nuxt.$emit('triggerScroll')); - } - - return new Promise((resolve) => { - // wait for the out transition to complete (if necessary) - nuxt.$once('triggerScroll', () => { - // coords will be used if no selector is provided, - // or if the selector didn't match any element. - if (to.hash) { - let hash = to.hash; - - // CSS.escape() is not supported with IE and Edge. - if (typeof window.CSS !== 'undefined' && typeof window.CSS.escape !== 'undefined') { - hash = `#${ window.CSS.escape(hash.substr(1)) }`; - } - try { - if (document.querySelector(hash)) { - // scroll to anchor by returning the selector - position = { selector: hash }; - } - } catch (e) { - console.warn('Failed to save scroll position. Please add CSS.escape() polyfill (https://github.com/mathiasbynens/CSS.escape).'); // eslint-disable-line no-console - } - } - resolve(position); - }); - }); -}