From dc0ec6bd4660e867a82641e8913f908f9ec2bb13 Mon Sep 17 00:00:00 2001
From: Dominik Schmidt <dev@dominik-schmidt.de>
Date: Sat, 14 Jan 2023 18:13:22 +0100
Subject: [PATCH] Fix types and tests

---
 .../__snapshots__/OcBreadcrumb.spec.ts.snap   | 16 +++----
 .../tests/unit/components/AppTemplate.spec.ts |  4 +-
 .../web-app-external/tests/unit/app.spec.ts   |  3 +-
 packages/web-app-files/src/router/common.ts   |  6 +--
 .../web-app-files/src/router/deprecated.ts    | 19 +++++---
 packages/web-app-files/src/router/index.ts    |  5 ++-
 packages/web-app-files/src/router/public.ts   |  6 +--
 packages/web-app-files/src/router/shares.ts   |  6 +--
 packages/web-app-files/src/router/spaces.ts   |  6 +--
 packages/web-app-files/src/router/trash.ts    |  6 +--
 packages/web-app-files/src/router/utils.ts    | 14 +++---
 packages/web-app-files/src/services/folder.ts |  2 +-
 .../src/services/folder/loaderFavorites.ts    |  2 +-
 .../services/folder/loaderSharedViaLink.ts    |  2 +-
 .../src/services/folder/loaderSharedWithMe.ts |  2 +-
 .../services/folder/loaderSharedWithOthers.ts |  2 +-
 .../unit/components/AppBar/AppBar.spec.ts     |  7 +--
 .../components/AppBar/CreateAndUpload.spec.ts |  5 ++-
 .../AppBar/SharesNavigation.spec.ts           | 17 ++++---
 .../unit/components/SideBar/FileInfo.spec.ts  |  5 ++-
 .../InviteCollaboratorForm.spec.ts            |  6 ++-
 .../SideBar/Shares/FileShares.spec.ts         |  7 ++-
 .../SideBar/Shares/SpaceMembers.spec.ts       |  7 ++-
 .../unit/components/SideBar/SideBar.spec.ts   |  5 ++-
 .../Spaces/SpaceContextActions.spec.ts        |  6 ++-
 .../driveResolver/useDriveResolver.spec.ts    | 23 +++++++---
 .../composables/scrollTo/useScrollTo.spec.ts  | 14 +++---
 .../upload/useUploadHelpers.spec.ts           |  7 +--
 .../unit/mixins/actions/acceptShare.spec.ts   |  7 ++-
 .../tests/unit/mixins/actions/delete.spec.ts  |  6 ++-
 .../tests/unit/mixins/spaces/setImage.spec.ts |  9 ++--
 .../unit/mixins/spaces/uploadImage.spec.ts    |  9 ++--
 .../tests/unit/router/utils.spec.ts           | 45 +++++++++++++------
 .../tests/unit/search/sdk.spec.ts             |  5 ++-
 .../tests/unit/views/Favorites.spec.ts        |  5 ++-
 .../tests/unit/views/FilesDrop.spec.ts        |  6 ++-
 .../unit/views/shares/SharedViaLink.spec.ts   |  7 +--
 .../unit/views/shares/SharedWithMe.spec.ts    |  6 +--
 .../views/shares/SharedWithOthers.spec.ts     |  6 +--
 .../unit/views/spaces/DriveResolver.spec.ts   | 10 +++--
 .../unit/views/spaces/GenericSpace.spec.ts    |  5 ++-
 .../unit/views/spaces/GenericTrash.spec.ts    |  7 +--
 .../tests/unit/views/spaces/Projects.spec.ts  |  7 +--
 .../src/composables/appDefaults/types.ts      |  5 ++-
 .../appDefaults/useAppDocumentTitle.ts        |  6 +--
 .../appDefaults/useAppFolderHandling.ts       |  4 +-
 .../appDefaults/useAppNavigation.ts           |  8 ++--
 .../src/composables/authContext/useRequest.ts |  5 +--
 .../web-pkg/src/composables/router/types.ts   |  1 -
 .../src/composables/router/useActiveApp.ts    |  5 ++-
 .../composables/router/useFileRouteReplace.ts |  2 +-
 .../src/composables/router/useRouteName.ts    |  2 +-
 .../src/composables/router/useRouteQuery.ts   |  3 +-
 .../src/helpers/router/routeOptions.ts        | 12 ++---
 .../composables/router/useRouteQuery.spec.ts  | 35 ++++++++++-----
 .../tests/unit/mixins/spaces/delete.spec.ts   |  9 ++--
 .../tests/unit/mixins/spaces/disable.spec.ts  |  9 ++--
 .../mixins/spaces/editDescription.spec.ts     |  9 ++--
 .../tests/unit/mixins/spaces/navigate.spec.ts |  6 ++-
 .../tests/unit/mixins/spaces/rename.spec.ts   |  9 ++--
 .../tests/unit/mixins/spaces/restore.spec.ts  |  9 ++--
 .../unit/mixins/spaces/setReadme.spec.ts      |  9 ++--
 packages/web-runtime/src/container/api.ts     | 12 ++---
 packages/web-runtime/src/container/types.ts   |  6 +--
 packages/web-runtime/src/router/helpers.ts    | 44 ++++++++++--------
 packages/web-runtime/src/router/index.ts      |  2 +-
 .../web-runtime/src/router/setupAuthGuard.ts  |  4 +-
 .../src/services/auth/authService.ts          |  6 +--
 .../tests/unit/router/index.spec.ts           |  2 +
 packages/web-test-helpers/src/helpers.ts      | 11 ++++-
 .../src/mocks/defaultComponentMocks.ts        | 16 +++----
 tests/unit/config/jest.init.js                |  7 +--
 72 files changed, 376 insertions(+), 232 deletions(-)

diff --git a/packages/design-system/src/components/OcBreadcrumb/__snapshots__/OcBreadcrumb.spec.ts.snap b/packages/design-system/src/components/OcBreadcrumb/__snapshots__/OcBreadcrumb.spec.ts.snap
index 57edbec70e2..b47e417a253 100644
--- a/packages/design-system/src/components/OcBreadcrumb/__snapshots__/OcBreadcrumb.spec.ts.snap
+++ b/packages/design-system/src/components/OcBreadcrumb/__snapshots__/OcBreadcrumb.spec.ts.snap
@@ -4,7 +4,7 @@ exports[`OcBreadcrumb displays all items 1`] = `
 <nav class="oc-breadcrumb oc-breadcrumb-default">
   <ol class="oc-breadcrumb-list oc-flex oc-m-rm oc-p-rm">
     <li class="oc-breadcrumb-list-item oc-flex oc-flex-middle">
-      <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">
+      <router-link-stub tag="a" to="[object Object]">
         <span>First folder</span>
       </router-link-stub>
       <oc-icon-stub accessiblelabel="" class="oc-mx-xs" color="var(--oc-color-text-default)" filltype="line" name="arrow-right-s" size="medium" type="span" variation="passive"></oc-icon-stub>
@@ -18,7 +18,7 @@ exports[`OcBreadcrumb displays all items 1`] = `
       <!--v-if-->
     </li>
     <li class="oc-breadcrumb-list-item oc-flex oc-flex-middle">
-      <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">
+      <router-link-stub tag="a" to="[object Object]">
         <span>Deep</span>
       </router-link-stub>
       <oc-icon-stub accessiblelabel="" class="oc-mx-xs" color="var(--oc-color-text-default)" filltype="line" name="arrow-right-s" size="medium" type="span" variation="passive"></oc-icon-stub>
@@ -38,13 +38,13 @@ exports[`OcBreadcrumb displays all items 1`] = `
     <oc-drop-stub dropid="oc-drop-2" mode="click" paddingsize="medium" position="bottom-start" toggle="">
       <ol>
         <li>
-          <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">Deep</router-link-stub>
+          <router-link-stub tag="a" to="[object Object]">Deep</router-link-stub>
         </li>
         <li>
           <oc-button-stub appearance="raw" gapsize="medium" justifycontent="left" size="medium" submit="button" type="button" variation="passive">Subfolder</oc-button-stub>
         </li>
         <li>
-          <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">First folder</router-link-stub>
+          <router-link-stub tag="a" to="[object Object]">First folder</router-link-stub>
         </li>
       </ol>
     </oc-drop-stub>
@@ -56,7 +56,7 @@ exports[`OcBreadcrumb sets correct variation 1`] = `
 <nav class="oc-breadcrumb oc-breadcrumb-lead">
   <ol class="oc-breadcrumb-list oc-flex oc-m-rm oc-p-rm">
     <li class="oc-breadcrumb-list-item oc-flex oc-flex-middle">
-      <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">
+      <router-link-stub tag="a" to="[object Object]">
         <span>First folder</span>
       </router-link-stub>
       <oc-icon-stub accessiblelabel="" class="oc-mx-xs" color="var(--oc-color-text-default)" filltype="line" name="arrow-right-s" size="medium" type="span" variation="passive"></oc-icon-stub>
@@ -70,7 +70,7 @@ exports[`OcBreadcrumb sets correct variation 1`] = `
       <!--v-if-->
     </li>
     <li class="oc-breadcrumb-list-item oc-flex oc-flex-middle">
-      <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">
+      <router-link-stub tag="a" to="[object Object]">
         <span>Deep</span>
       </router-link-stub>
       <oc-icon-stub accessiblelabel="" class="oc-mx-xs" color="var(--oc-color-text-default)" filltype="line" name="arrow-right-s" size="medium" type="span" variation="passive"></oc-icon-stub>
@@ -90,13 +90,13 @@ exports[`OcBreadcrumb sets correct variation 1`] = `
     <oc-drop-stub dropid="oc-drop-1" mode="click" paddingsize="medium" position="bottom-start" toggle="">
       <ol>
         <li>
-          <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">Deep</router-link-stub>
+          <router-link-stub tag="a" to="[object Object]">Deep</router-link-stub>
         </li>
         <li>
           <oc-button-stub appearance="raw" gapsize="medium" justifycontent="left" size="medium" submit="button" type="button" variation="passive">Subfolder</oc-button-stub>
         </li>
         <li>
-          <router-link-stub ariacurrentvalue="page" event="click" tag="a" to="[object Object]">First folder</router-link-stub>
+          <router-link-stub tag="a" to="[object Object]">First folder</router-link-stub>
         </li>
       </ol>
     </oc-drop-stub>
diff --git a/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts b/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts
index 7f5ce052e25..acfdd0d7e17 100644
--- a/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts
+++ b/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts
@@ -4,10 +4,12 @@ import {
   defaultComponentMocks,
   defaultPlugins,
   defaultStoreMockOptions,
+  RouteLocation,
   shallowMount
 } from 'web-test-helpers'
 import { eventBus } from 'web-pkg'
 import { SideBarEventTopics } from 'web-pkg/src/composables/sideBar'
+import { mock } from 'jest-mock-extended'
 
 const stubSelectors = {
   ocBreadcrumb: 'oc-breadcrumb-stub',
@@ -135,7 +137,7 @@ function getWrapper({ propsData = {} } = {}) {
         mocks: {
           ...defaultComponentMocks({
             gettext: false,
-            currentRoute: { query: { app: 'admin-settings' } }
+            currentRoute: mock<RouteLocation>({ query: { app: 'admin-settings' } })
           })
         }
       }
diff --git a/packages/web-app-external/tests/unit/app.spec.ts b/packages/web-app-external/tests/unit/app.spec.ts
index b2b8bd22a67..348d280796f 100644
--- a/packages/web-app-external/tests/unit/app.spec.ts
+++ b/packages/web-app-external/tests/unit/app.spec.ts
@@ -10,6 +10,7 @@ import { FileContext, useAppDefaults } from 'web-pkg/src/composables/appDefaults
 import { useAppDefaultsMock } from 'web-test-helpers/src/mocks/useAppDefaultsMock'
 import { ref } from 'vue'
 import { mock } from 'jest-mock-extended'
+import { RouteLocation } from 'web-test-helpers'
 
 jest.mock('web-pkg/src/composables/appDefaults', () => {
   const { queryItemAsString } = jest.requireActual('web-pkg/src/composables/appDefaults')
@@ -145,7 +146,7 @@ function createShallowMountWrapper(makeRequest = jest.fn().mockResolvedValue({ s
         mocks: {
           ...defaultComponentMocks({
             gettext: false,
-            currentRoute: { query: { app: 'exampleApp' } }
+            currentRoute: mock<RouteLocation>({ query: { app: 'exampleApp' } })
           })
         }
       }
diff --git a/packages/web-app-files/src/router/common.ts b/packages/web-app-files/src/router/common.ts
index 74e22b9ddb6..54a31959d52 100644
--- a/packages/web-app-files/src/router/common.ts
+++ b/packages/web-app-files/src/router/common.ts
@@ -1,10 +1,10 @@
 import { RouteComponents } from './router'
-import { Location, RouteConfig } from 'vue-router'
+import { RouteLocationNamedRaw, RouteRecordRaw } from 'vue-router'
 import { createLocation, $gettext, isLocationActiveDirector } from './utils'
 
 type commonTypes = 'files-common-favorites' | 'files-common-search'
 
-export const createLocationCommon = (name: commonTypes, location = {}): Location =>
+export const createLocationCommon = (name: commonTypes, location = {}): RouteLocationNamedRaw =>
   createLocation(name, location)
 
 export const locationFavorites = createLocationCommon('files-common-favorites')
@@ -15,7 +15,7 @@ export const isLocationCommonActive = isLocationActiveDirector<commonTypes>(
   locationSearch
 )
 
-export const buildRoutes = (components: RouteComponents): RouteConfig[] => [
+export const buildRoutes = (components: RouteComponents): RouteRecordRaw[] => [
   {
     path: '/search',
     component: components.App,
diff --git a/packages/web-app-files/src/router/deprecated.ts b/packages/web-app-files/src/router/deprecated.ts
index 8c7761f7856..4c7e3702989 100644
--- a/packages/web-app-files/src/router/deprecated.ts
+++ b/packages/web-app-files/src/router/deprecated.ts
@@ -1,4 +1,11 @@
-import { RouteConfig, Route, Location, RouteMeta, Router } from 'vue-router'
+import {
+  RouteRecordRaw,
+  RouteLocationNamedRaw,
+  RouteMeta,
+  Router,
+  RouteLocationPathRaw,
+  RouteLocationRaw
+} from 'vue-router'
 import { createLocationSpaces } from './spaces'
 import { createLocationShares } from './shares'
 import { createLocationCommon } from './common'
@@ -16,8 +23,8 @@ import { urlJoin } from 'web-client/src/utils'
 const deprecatedRedirect = (routeConfig: {
   path: string
   meta?: RouteMeta
-  redirect: (to: Route) => Location
-}): RouteConfig => {
+  redirect: (to: RouteLocationRaw) => Partial<RouteLocationPathRaw & RouteLocationNamedRaw>
+}): RouteRecordRaw => {
   return {
     meta: { ...routeConfig.meta, authContext: 'anonymous' }, // authContext belongs to the redirect target, not to the redirect itself.
     path: routeConfig.path,
@@ -26,7 +33,7 @@ const deprecatedRedirect = (routeConfig: {
 
       console.warn(
         `route "${routeConfig.path}" is deprecated, use "${
-          location.path || location.name
+          String(location.path) || String(location.name)
         }" instead.`
       )
 
@@ -39,7 +46,7 @@ const deprecatedRedirect = (routeConfig: {
  * listed routes only exist to keep backwards compatibility intact,
  * all routes written in  a flat syntax to keep them readable.
  */
-export const buildRoutes = (): RouteConfig[] =>
+export const buildRoutes = (): RouteLocationNamedRaw[] =>
   [
     {
       path: '/list',
@@ -101,7 +108,7 @@ export const buildRoutes = (): RouteConfig[] =>
  */
 export const isLocationActive = (
   router: Router,
-  ...comparatives: [Location, ...Location[]]
+  ...comparatives: [RouteLocationNamedRaw, ...RouteLocationNamedRaw[]]
 ): boolean => {
   const [first, ...rest] = comparatives.map((c) => {
     const newName = {
diff --git a/packages/web-app-files/src/router/index.ts b/packages/web-app-files/src/router/index.ts
index 22ca51f11f2..f4138f78516 100644
--- a/packages/web-app-files/src/router/index.ts
+++ b/packages/web-app-files/src/router/index.ts
@@ -1,4 +1,4 @@
-import { RouteConfig } from 'vue-router'
+import { RouteLocationNamedRaw } from 'vue-router'
 
 import {
   buildRoutes as buildCommonRoutes,
@@ -30,11 +30,12 @@ import {
 import type { ActiveRouteDirectorFunc } from './utils'
 
 const ROOT_ROUTE = {
+  name: 'root',
   path: '/',
   redirect: (to) => createLocationSpaces('files-spaces-generic', to)
 }
 
-const buildRoutes = (components: RouteComponents): RouteConfig[] => [
+const buildRoutes = (components: RouteComponents): RouteLocationNamedRaw[] => [
   ROOT_ROUTE,
   ...buildCommonRoutes(components),
   ...buildSharesRoutes(components),
diff --git a/packages/web-app-files/src/router/public.ts b/packages/web-app-files/src/router/public.ts
index 5e6e76f13d9..911537f1e18 100644
--- a/packages/web-app-files/src/router/public.ts
+++ b/packages/web-app-files/src/router/public.ts
@@ -1,10 +1,10 @@
 import { RouteComponents } from './router'
-import { Location, RouteConfig } from 'vue-router'
+import { RouteLocationNamedRaw, RouteRecordRaw } from 'vue-router'
 import { createLocation, isLocationActiveDirector, $gettext } from './utils'
 
 type shareTypes = 'files-public-link' | 'files-public-upload'
 
-export const createLocationPublic = (name: shareTypes, location = {}): Location =>
+export const createLocationPublic = (name: shareTypes, location = {}): RouteLocationNamedRaw =>
   createLocation(name, location)
 
 export const locationPublicLink = createLocationPublic('files-public-link')
@@ -15,7 +15,7 @@ export const isLocationPublicActive = isLocationActiveDirector<shareTypes>(
   locationPublicUpload
 )
 
-export const buildRoutes = (components: RouteComponents): RouteConfig[] => [
+export const buildRoutes = (components: RouteComponents): RouteRecordRaw[] => [
   {
     path: '/link',
     component: components.App,
diff --git a/packages/web-app-files/src/router/shares.ts b/packages/web-app-files/src/router/shares.ts
index a4f1c87cc4a..ddd768421c1 100644
--- a/packages/web-app-files/src/router/shares.ts
+++ b/packages/web-app-files/src/router/shares.ts
@@ -1,10 +1,10 @@
 import { RouteComponents } from './router'
-import { Location, RouteConfig } from 'vue-router'
+import { RouteLocationNamedRaw, RouteRecordRaw } from 'vue-router'
 import { createLocation, isLocationActiveDirector, $gettext } from './utils'
 
 type shareTypes = 'files-shares-with-me' | 'files-shares-with-others' | 'files-shares-via-link'
 
-export const createLocationShares = (name: shareTypes, location = {}): Location =>
+export const createLocationShares = (name: shareTypes, location = {}): RouteLocationNamedRaw =>
   createLocation(name, location)
 
 export const locationSharesWithMe = createLocationShares('files-shares-with-me')
@@ -17,7 +17,7 @@ export const isLocationSharesActive = isLocationActiveDirector<shareTypes>(
   locationSharesViaLink
 )
 
-export const buildRoutes = (components: RouteComponents): RouteConfig[] => [
+export const buildRoutes = (components: RouteComponents): RouteRecordRaw[] => [
   {
     path: '/shares',
     component: components.App,
diff --git a/packages/web-app-files/src/router/spaces.ts b/packages/web-app-files/src/router/spaces.ts
index cc2acc7f7ae..3f6cafdf647 100644
--- a/packages/web-app-files/src/router/spaces.ts
+++ b/packages/web-app-files/src/router/spaces.ts
@@ -1,10 +1,10 @@
-import { Location, RouteConfig } from 'vue-router'
+import { RouteLocationNamedRaw, RouteRecordRaw } from 'vue-router'
 import { RouteComponents } from './router'
 import { createLocation, isLocationActiveDirector, $gettext } from './utils'
 
 type spaceTypes = 'files-spaces-projects' | 'files-spaces-generic'
 
-export const createLocationSpaces = (name: spaceTypes, location = {}): Location =>
+export const createLocationSpaces = (name: spaceTypes, location = {}): RouteLocationNamedRaw =>
   createLocation(name, location)
 
 export const locationSpacesProjects = createLocationSpaces('files-spaces-projects')
@@ -17,7 +17,7 @@ export const isLocationSpacesActive = isLocationActiveDirector<spaceTypes>(
   locationSpacesGeneric
 )
 
-export const buildRoutes = (components: RouteComponents): RouteConfig[] => [
+export const buildRoutes = (components: RouteComponents): RouteRecordRaw[] => [
   {
     path: '/spaces',
     component: components.App,
diff --git a/packages/web-app-files/src/router/trash.ts b/packages/web-app-files/src/router/trash.ts
index aad4c61c007..0103a44fbd4 100644
--- a/packages/web-app-files/src/router/trash.ts
+++ b/packages/web-app-files/src/router/trash.ts
@@ -1,17 +1,17 @@
 import { RouteComponents } from './router'
-import { Location, RouteConfig } from 'vue-router'
+import { RouteLocationNamedRaw, RouteRecordRaw } from 'vue-router'
 import { createLocation, isLocationActiveDirector } from './utils'
 
 type trashTypes = 'files-trash-generic'
 
-export const createLocationTrash = (name: trashTypes, location = {}): Location =>
+export const createLocationTrash = (name: trashTypes, location = {}): RouteLocationNamedRaw =>
   createLocation(name, location)
 
 export const locationTrashGeneric = createLocationTrash('files-trash-generic')
 
 export const isLocationTrashActive = isLocationActiveDirector<trashTypes>(locationTrashGeneric)
 
-export const buildRoutes = (components: RouteComponents): RouteConfig[] => [
+export const buildRoutes = (components: RouteComponents): RouteRecordRaw[] => [
   {
     path: '/trash',
     component: components.App,
diff --git a/packages/web-app-files/src/router/utils.ts b/packages/web-app-files/src/router/utils.ts
index b608a5b85a4..10c407a5e55 100644
--- a/packages/web-app-files/src/router/utils.ts
+++ b/packages/web-app-files/src/router/utils.ts
@@ -1,5 +1,4 @@
-import { Location } from 'vue-router'
-import { Router } from 'web-pkg/src/types/router'
+import { Router, RouteLocationNamedRaw } from 'vue-router'
 import merge from 'lodash-es/merge'
 import { unref } from 'vue'
 
@@ -16,9 +15,9 @@ export interface ActiveRouteDirectorFunc<T extends string> {
  */
 export const isLocationActive = (
   router: Router,
-  ...comparatives: [Location, ...Location[]]
+  ...comparatives: [RouteLocationNamedRaw, ...RouteLocationNamedRaw[]]
 ): boolean => {
-  // FIXME: router.resolve cleans the path, we don't need it, if we can rely on
+  // FIXME: router.resolve cleans the path. we don't need it, if we can rely on
   // router.currentRoute to not have slashs encoded for paths
   const { href: currentHref } = router.resolve(unref(router.currentRoute))
   return comparatives
@@ -50,7 +49,7 @@ export const isLocationActive = (
  * @param defaultComparatives
  */
 export const isLocationActiveDirector = <T extends string>(
-  ...defaultComparatives: [Location, ...Location[]]
+  ...defaultComparatives: [RouteLocationNamedRaw, ...RouteLocationNamedRaw[]]
 ): ActiveRouteDirectorFunc<T> => {
   return (router: Router, ...comparatives: T[]): boolean => {
     if (!comparatives.length) {
@@ -86,7 +85,10 @@ export function $gettext(msg: string): string {
  * @param name
  * @param locations
  */
-export const createLocation = (name: string, ...locations: Location[]): Location =>
+export const createLocation = (
+  name: string,
+  ...locations: RouteLocationNamedRaw[]
+): RouteLocationNamedRaw =>
   merge(
     {},
     {
diff --git a/packages/web-app-files/src/services/folder.ts b/packages/web-app-files/src/services/folder.ts
index 43e677c3cdb..8d5da35dad7 100644
--- a/packages/web-app-files/src/services/folder.ts
+++ b/packages/web-app-files/src/services/folder.ts
@@ -1,4 +1,4 @@
-import Router from 'vue-router'
+import { Router } from 'vue-router'
 import { useTask } from 'vue-concurrency'
 import { useRouter, useClientService, useStore } from 'web-pkg/src/composables'
 import { unref } from 'vue'
diff --git a/packages/web-app-files/src/services/folder/loaderFavorites.ts b/packages/web-app-files/src/services/folder/loaderFavorites.ts
index 1b8c3bc0a27..1a1a79bed72 100644
--- a/packages/web-app-files/src/services/folder/loaderFavorites.ts
+++ b/packages/web-app-files/src/services/folder/loaderFavorites.ts
@@ -1,5 +1,5 @@
 import { FolderLoader, FolderLoaderTask, TaskContext } from '../folder'
-import Router from 'vue-router'
+import { Router } from 'vue-router'
 import { useTask } from 'vue-concurrency'
 import { DavProperties } from 'web-client/src/webdav/constants'
 import { buildResource } from 'web-client/src/helpers'
diff --git a/packages/web-app-files/src/services/folder/loaderSharedViaLink.ts b/packages/web-app-files/src/services/folder/loaderSharedViaLink.ts
index 22d368569e5..163064c6798 100644
--- a/packages/web-app-files/src/services/folder/loaderSharedViaLink.ts
+++ b/packages/web-app-files/src/services/folder/loaderSharedViaLink.ts
@@ -1,5 +1,5 @@
 import { FolderLoader, FolderLoaderTask, TaskContext } from '../folder'
-import Router from 'vue-router'
+import { Router } from 'vue-router'
 import { useTask } from 'vue-concurrency'
 import { isLocationSharesActive } from '../../router'
 import { ShareTypes } from 'web-client/src/helpers/share'
diff --git a/packages/web-app-files/src/services/folder/loaderSharedWithMe.ts b/packages/web-app-files/src/services/folder/loaderSharedWithMe.ts
index aa4513df8d6..8adc6cc41e5 100644
--- a/packages/web-app-files/src/services/folder/loaderSharedWithMe.ts
+++ b/packages/web-app-files/src/services/folder/loaderSharedWithMe.ts
@@ -1,5 +1,5 @@
 import { FolderLoader, FolderLoaderTask, TaskContext } from '../folder'
-import Router from 'vue-router'
+import { Router } from 'vue-router'
 import { useTask } from 'vue-concurrency'
 import { aggregateResourceShares } from '../../helpers/resources'
 import { isLocationSharesActive } from '../../router'
diff --git a/packages/web-app-files/src/services/folder/loaderSharedWithOthers.ts b/packages/web-app-files/src/services/folder/loaderSharedWithOthers.ts
index 38cc4d2ce5a..d3623799c23 100644
--- a/packages/web-app-files/src/services/folder/loaderSharedWithOthers.ts
+++ b/packages/web-app-files/src/services/folder/loaderSharedWithOthers.ts
@@ -1,5 +1,5 @@
 import { FolderLoader, FolderLoaderTask, TaskContext } from '../folder'
-import Router from 'vue-router'
+import { Router } from 'vue-router'
 import { useTask } from 'vue-concurrency'
 import { isLocationSharesActive } from '../../router'
 import { aggregateResourceShares } from '../../helpers/resources'
diff --git a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.ts b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.ts
index cd1fd84e0cd..709ea33a647 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.ts
+++ b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.ts
@@ -1,12 +1,13 @@
 import AppBar from 'web-app-files/src/components/AppBar/AppBar.vue'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Resource } from 'web-client'
 import {
   createStore,
   defaultComponentMocks,
   defaultPlugins,
   shallowMount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
 
 const selectedFiles = [mockDeep<Resource>(), mockDeep<Resource>()]
@@ -127,7 +128,7 @@ function getShallowWrapper(
 ) {
   const mocks = defaultComponentMocks({
     gettext: false,
-    currentRoute: { name: 'files-trash-generic' }
+    currentRoute: mock<RouteLocation>({ name: 'files-trash-generic' })
   })
   mocks.$route.meta.title = 'ExampleTitle'
   const storeOptions = defaultStoreMockOptions
diff --git a/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.ts b/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.ts
index d0cf31613dc..5a4130ea396 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.ts
+++ b/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.ts
@@ -12,6 +12,7 @@ import {
   defaultStoreMockOptions,
   defaultComponentMocks
 } from 'web-test-helpers'
+import { RouteLocation } from 'vue-router'
 
 jest.mock('web-pkg/src/composables/authContext')
 
@@ -277,7 +278,9 @@ function getWrapper({
   storeOptions.modules.Files.getters.clipboardResources.mockImplementation(() => clipboardResources)
   storeOptions.modules.Files.getters.files.mockImplementation(() => files)
   const store = createStore(storeOptions)
-  const mocks = { ...defaultComponentMocks({ currentRoute: { name: currentRouteName } }) }
+  const mocks = {
+    ...defaultComponentMocks({ currentRoute: mock<RouteLocation>({ name: currentRouteName }) })
+  }
   return {
     storeOptions,
     mocks,
diff --git a/packages/web-app-files/tests/unit/components/AppBar/SharesNavigation.spec.ts b/packages/web-app-files/tests/unit/components/AppBar/SharesNavigation.spec.ts
index 8843d298a40..e7e40d9bd60 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/SharesNavigation.spec.ts
+++ b/packages/web-app-files/tests/unit/components/AppBar/SharesNavigation.spec.ts
@@ -1,26 +1,27 @@
 import SharesNavigation from '../../../../src/components/AppBar/SharesNavigation.vue'
 import { locationSharesWithMe } from 'web-app-files/src/router/shares'
 import { mock } from 'jest-mock-extended'
-import { RouteRecordPublic } from 'vue-router/types/router'
+import { RouteRecordNormalized } from 'vue-router'
 import {
   createStore,
   defaultPlugins,
   defaultStubs,
   shallowMount,
   defaultStoreMockOptions,
-  defaultComponentMocks
+  defaultComponentMocks,
+  RouteLocation
 } from 'web-test-helpers'
 
 const routes = [
-  mock<RouteRecordPublic>({
+  mock<RouteRecordNormalized>({
     path: '/files/shares/with-me/',
     name: 'files-shares-with-me'
   }),
-  mock<RouteRecordPublic>({
+  mock<RouteRecordNormalized>({
     path: '/files/shares/with-others/',
     name: 'files-shares-with-others'
   }),
-  mock<RouteRecordPublic>({
+  mock<RouteRecordNormalized>({
     path: '/files/shares/via-link/',
     name: 'files-shares-via-link'
   })
@@ -36,12 +37,14 @@ describe('SharesNavigation component', () => {
 function getWrapper({ currentRouteName = locationSharesWithMe.name } = {}) {
   const storeOptions = { ...defaultStoreMockOptions }
   const store = createStore(storeOptions)
-  const mocks = defaultComponentMocks({ currentRoute: { name: currentRouteName } })
+  const mocks = defaultComponentMocks({
+    currentRoute: mock<RouteLocation>({ name: currentRouteName })
+  })
   mocks.$router.getRoutes.mockImplementation(() => routes)
   return {
     storeOptions,
     mocks,
-    wrapper: shallowMount(SharesNavigation as any, {
+    wrapper: shallowMount(SharesNavigation, {
       global: {
         stubs: defaultStubs,
         renderStubDefaultSlot: true,
diff --git a/packages/web-app-files/tests/unit/components/SideBar/FileInfo.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/FileInfo.spec.ts
index aed9726447c..a11f58cf4c0 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/FileInfo.spec.ts
+++ b/packages/web-app-files/tests/unit/components/SideBar/FileInfo.spec.ts
@@ -4,7 +4,8 @@ import {
   defaultComponentMocks,
   defaultPlugins,
   shallowMount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
 import { mock } from 'jest-mock-extended'
 import { Resource } from 'web-client'
@@ -43,7 +44,7 @@ function createWrapper() {
           displayedItem: file
         },
         mocks: {
-          ...defaultComponentMocks({ currentRoute: { path: '/files' } })
+          ...defaultComponentMocks({ currentRoute: mock<RouteLocation>({ path: '/files' }) })
         }
       }
     })
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/InviteCollaboratorForm.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/InviteCollaboratorForm.spec.ts
index 93f54a66059..53d412dd505 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/InviteCollaboratorForm.spec.ts
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/InviteCollaboratorForm.spec.ts
@@ -1,3 +1,4 @@
+import { mock } from 'jest-mock-extended'
 import InviteCollaboratorForm from 'web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/InviteCollaboratorForm.vue'
 import { ShareTypes } from 'web-client/src/helpers/share'
 import {
@@ -5,6 +6,7 @@ import {
   defaultComponentMocks,
   defaultPlugins,
   defaultStoreMockOptions,
+  RouteLocation,
   shallowMount
 } from 'web-test-helpers'
 
@@ -92,7 +94,9 @@ function getWrapper({
       },
       global: {
         plugins: [...defaultPlugins(), store],
-        mocks: defaultComponentMocks({ currentRoute: { params: { storageId } } })
+        mocks: defaultComponentMocks({
+          currentRoute: mock<RouteLocation>({ params: { storageId } })
+        })
       }
     })
   }
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.ts
index a9268065f71..0f87dd81c41 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.ts
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.ts
@@ -11,7 +11,8 @@ import {
   shallowMount,
   defaultStoreMockOptions,
   defaultComponentMocks,
-  defaultStubs
+  defaultStubs,
+  RouteLocation
 } from 'web-test-helpers'
 
 const getCollaborator = () => ({
@@ -237,7 +238,9 @@ function getWrapper({
       props: { space },
       global: {
         plugins: [...defaultPlugins(), store],
-        mocks: defaultComponentMocks({ currentRoute: { name: currentRouteName } }),
+        mocks: defaultComponentMocks({
+          currentRoute: mock<RouteLocation>({ name: currentRouteName })
+        }),
         provide: {
           incomingParentShare: {}
         },
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.ts
index dd766719c86..2dfd5491d9e 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.ts
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.ts
@@ -14,7 +14,8 @@ import {
   mount,
   shallowMount,
   defaultStoreMockOptions,
-  defaultComponentMocks
+  defaultComponentMocks,
+  RouteLocation
 } from 'web-test-helpers'
 
 const memberMocks = {
@@ -172,7 +173,9 @@ function getWrapper({
     },
     global: {
       plugins: [...defaultPlugins(), store],
-      mocks: defaultComponentMocks({ currentRoute: { name: currentRouteName } }),
+      mocks: defaultComponentMocks({
+        currentRoute: mock<RouteLocation>({ name: currentRouteName })
+      }),
       provide: {
         displayedItem: space
       },
diff --git a/packages/web-app-files/tests/unit/components/SideBar/SideBar.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/SideBar.spec.ts
index d82a2c33c91..68b3e0ee6b2 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/SideBar.spec.ts
+++ b/packages/web-app-files/tests/unit/components/SideBar/SideBar.spec.ts
@@ -7,12 +7,13 @@ import {
 import InnerSideBar from 'web-pkg/src/components/sideBar/SideBar.vue'
 import SideBar from 'web-app-files/src/components/SideBar/SideBar.vue'
 import { Resource } from 'web-client/src/helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import {
   createStore,
   defaultComponentMocks,
   defaultPlugins,
   defaultStoreMockOptions,
+  RouteLocation,
   shallowMount
 } from 'web-test-helpers'
 
@@ -156,7 +157,7 @@ function createWrapper({
           'click-outside': jest.fn()
         },
         mocks: {
-          ...defaultComponentMocks({ currentRoute: currentRoute as unknown })
+          ...defaultComponentMocks({ currentRoute: mock<RouteLocation>(currentRoute as any) })
         }
       }
     })
diff --git a/packages/web-app-files/tests/unit/components/Spaces/SpaceContextActions.spec.ts b/packages/web-app-files/tests/unit/components/Spaces/SpaceContextActions.spec.ts
index fe53a0b0e01..eddb92d5ca4 100644
--- a/packages/web-app-files/tests/unit/components/Spaces/SpaceContextActions.spec.ts
+++ b/packages/web-app-files/tests/unit/components/Spaces/SpaceContextActions.spec.ts
@@ -5,8 +5,10 @@ import {
   defaultComponentMocks,
   defaultPlugins,
   mount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
+import { mock } from 'jest-mock-extended'
 
 const spaceMock = {
   id: '1',
@@ -32,7 +34,7 @@ function getWrapper(space) {
       },
       global: {
         mocks: {
-          ...defaultComponentMocks({ currentRoute: { path: '/files' } })
+          ...defaultComponentMocks({ currentRoute: mock<RouteLocation>({ path: '/files' }) })
         },
         plugins: [...defaultPlugins(), store]
       }
diff --git a/packages/web-app-files/tests/unit/composables/driveResolver/useDriveResolver.spec.ts b/packages/web-app-files/tests/unit/composables/driveResolver/useDriveResolver.spec.ts
index f27a2d518bf..fdc08cfa719 100644
--- a/packages/web-app-files/tests/unit/composables/driveResolver/useDriveResolver.spec.ts
+++ b/packages/web-app-files/tests/unit/composables/driveResolver/useDriveResolver.spec.ts
@@ -1,12 +1,13 @@
 import { useCapabilitySpacesEnabled, useDriveResolver } from 'web-pkg/src'
 import { computed, ref, unref } from 'vue'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { isShareSpaceResource, SpaceResource } from 'web-client/src/helpers'
 import {
   createStore,
   getComposableWrapper,
   defaultStoreMockOptions,
-  defaultComponentMocks
+  defaultComponentMocks,
+  RouteLocation
 } from 'web-test-helpers'
 
 jest.unmock('web-app-files/src/composables')
@@ -79,7 +80,11 @@ describe('useDriveResolver', () => {
       },
       {
         mocks: defaultComponentMocks({
-          currentRoute: { name: 'files-spaces-generic', path: '/', query: { fileId } }
+          currentRoute: mock<RouteLocation>({
+            name: 'files-spaces-generic',
+            path: '/',
+            query: { fileId }
+          })
         }),
         store
       }
@@ -106,7 +111,11 @@ describe('useDriveResolver', () => {
       },
       {
         mocks: defaultComponentMocks({
-          currentRoute: { name: 'files-spaces-generic', path: '/', query: { fileId: undefined } }
+          currentRoute: mock<RouteLocation>({
+            name: 'files-spaces-generic',
+            path: '/',
+            query: { fileId: undefined }
+          })
         }),
         store
       }
@@ -133,7 +142,11 @@ describe('useDriveResolver', () => {
       },
       {
         mocks: defaultComponentMocks({
-          currentRoute: { name: 'files-spaces-generic', path: '/', query: { fileId: undefined } }
+          currentRoute: mock<RouteLocation>({
+            name: 'files-spaces-generic',
+            path: '/',
+            query: { fileId: undefined }
+          })
         }),
         store
       }
diff --git a/packages/web-app-files/tests/unit/composables/scrollTo/useScrollTo.spec.ts b/packages/web-app-files/tests/unit/composables/scrollTo/useScrollTo.spec.ts
index ddf5bcda9e3..b38d523d3e5 100644
--- a/packages/web-app-files/tests/unit/composables/scrollTo/useScrollTo.spec.ts
+++ b/packages/web-app-files/tests/unit/composables/scrollTo/useScrollTo.spec.ts
@@ -1,10 +1,10 @@
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { useScrollTo } from 'web-app-files/src/composables/scrollTo'
 import { Resource } from 'web-client/src'
 import { eventBus } from 'web-pkg/src'
 import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultComponentMocks'
 import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
-import { getComposableWrapper } from 'web-test-helpers'
+import { getComposableWrapper, RouteLocation } from 'web-test-helpers'
 
 describe('useScrollTo', () => {
   it('should be valid', () => {
@@ -92,7 +92,9 @@ describe('useScrollTo', () => {
         },
         {
           mocks: {
-            ...defaultComponentMocks({ currentRoute: { query: { scrollTo: resourceId } } })
+            ...defaultComponentMocks({
+              currentRoute: mock<RouteLocation>({ query: { scrollTo: resourceId } })
+            })
           },
           store: defaultStoreMockOptions
         }
@@ -110,7 +112,7 @@ describe('useScrollTo', () => {
         {
           mocks: {
             ...defaultComponentMocks({
-              currentRoute: { query: { scrollTo: resourceId } }
+              currentRoute: mock<RouteLocation>({ query: { scrollTo: resourceId } })
             }),
             $store: { commit: jest.fn() }
           },
@@ -130,7 +132,9 @@ describe('useScrollTo', () => {
         {
           mocks: {
             ...defaultComponentMocks({
-              currentRoute: { query: { scrollTo: resourceId, details: 'details' } }
+              currentRoute: mock<RouteLocation>({
+                query: { scrollTo: resourceId, details: 'details' }
+              })
             }),
             $store: { commit: jest.fn() }
           },
diff --git a/packages/web-app-files/tests/unit/composables/upload/useUploadHelpers.spec.ts b/packages/web-app-files/tests/unit/composables/upload/useUploadHelpers.spec.ts
index 165ee2579e6..5f8a880a560 100644
--- a/packages/web-app-files/tests/unit/composables/upload/useUploadHelpers.spec.ts
+++ b/packages/web-app-files/tests/unit/composables/upload/useUploadHelpers.spec.ts
@@ -1,5 +1,5 @@
 import { useUploadHelpers } from '../../../../src/composables/upload'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { SpaceResource } from 'web-client/src/helpers'
 import {
   createStore,
@@ -9,6 +9,7 @@ import {
 } from 'web-test-helpers'
 import { ComputedRef, computed } from 'vue'
 import { UppyService } from 'web-runtime/src/services/uppyService'
+import { RouteLocation } from 'vue-router'
 
 describe('useUploadHelpers', () => {
   const currentPathMock = 'path'
@@ -39,12 +40,12 @@ describe('useUploadHelpers', () => {
 
   it('converts normal files to uppy resources', () => {
     const mocks = defaultComponentMocks({
-      currentRoute: {
+      currentRoute: mock<RouteLocation>({
         name: 'some-route',
         params: {
           item: currentPathMock
         }
-      }
+      })
     })
     mocks.$clientService.owncloudSdk.files.getFileUrl.mockResolvedValue(uploadPathMock)
     mocks.$clientService.owncloudSdk.files.fileInfo.mockResolvedValue(mockFile)
diff --git a/packages/web-app-files/tests/unit/mixins/actions/acceptShare.spec.ts b/packages/web-app-files/tests/unit/mixins/actions/acceptShare.spec.ts
index 88499747965..f2732e4fa08 100644
--- a/packages/web-app-files/tests/unit/mixins/actions/acceptShare.spec.ts
+++ b/packages/web-app-files/tests/unit/mixins/actions/acceptShare.spec.ts
@@ -1,6 +1,7 @@
+import { mock } from 'jest-mock-extended'
 import acceptShare from 'web-app-files/src/mixins/actions/acceptShare'
 import { ShareStatus } from 'web-client/src/helpers/share'
-import { defaultComponentMocks, mount } from 'web-test-helpers'
+import { defaultComponentMocks, mount, RouteLocation } from 'web-test-helpers'
 
 const sharesWithMeLocation = 'files-shares-with-me'
 const sharesWithOthersLocation = 'files-shares-with-others'
@@ -47,7 +48,9 @@ describe('acceptShare', () => {
 function getWrapper(routeName = sharesWithMeLocation) {
   return {
     wrapper: mount(Component, {
-      global: { mocks: defaultComponentMocks({ currentRoute: { name: routeName } }) }
+      global: {
+        mocks: defaultComponentMocks({ currentRoute: mock<RouteLocation>({ name: routeName }) })
+      }
     })
   }
 }
diff --git a/packages/web-app-files/tests/unit/mixins/actions/delete.spec.ts b/packages/web-app-files/tests/unit/mixins/actions/delete.spec.ts
index 31fd00be7de..2dbd04dba10 100644
--- a/packages/web-app-files/tests/unit/mixins/actions/delete.spec.ts
+++ b/packages/web-app-files/tests/unit/mixins/actions/delete.spec.ts
@@ -1,3 +1,4 @@
+import { mock } from 'jest-mock-extended'
 import Delete from 'web-app-files/src/mixins/actions/delete.js'
 
 import {
@@ -5,7 +6,8 @@ import {
   defaultComponentMocks,
   defaultPlugins,
   shallowMount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
 
 const Component = {
@@ -59,7 +61,7 @@ function getWrapper({ deletePermanent = false, invalidLocation = false } = {}) {
     ? 'files-trash-generic'
     : 'files-spaces-generic'
   const mocks = {
-    ...defaultComponentMocks({ currentRoute: { name: routeName } }),
+    ...defaultComponentMocks({ currentRoute: mock<RouteLocation>({ name: routeName }) }),
     space: { driveType: 'personal', spaceRoles: { viewer: [], editor: [], manager: [] } }
   }
   const storeOptions = defaultStoreMockOptions
diff --git a/packages/web-app-files/tests/unit/mixins/spaces/setImage.spec.ts b/packages/web-app-files/tests/unit/mixins/spaces/setImage.spec.ts
index 43f9c2810ef..93b0ef5d6e8 100644
--- a/packages/web-app-files/tests/unit/mixins/spaces/setImage.spec.ts
+++ b/packages/web-app-files/tests/unit/mixins/spaces/setImage.spec.ts
@@ -1,7 +1,7 @@
 import setImage from 'web-app-files/src/mixins/spaces/actions/setImage'
 import { thumbnailService } from '../../../../src/services'
 import { buildSpace, Resource } from 'web-client/src/helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { ClientService, clientService } from 'web-pkg'
 import { Graph } from 'web-client'
 import {
@@ -9,7 +9,8 @@ import {
   defaultPlugins,
   mount,
   defaultStoreMockOptions,
-  defaultComponentMocks
+  defaultComponentMocks,
+  RouteLocation
 } from 'web-test-helpers'
 
 const Component = {
@@ -156,7 +157,9 @@ describe('setImage', () => {
 function getWrapper(space) {
   const clientMock = mockDeep<ClientService>()
   clientMock.webdav.getFileInfo.mockResolvedValue(mockDeep<Resource>())
-  const defaultMocks = defaultComponentMocks({ currentRoute: { name: 'files-spaces-generic' } })
+  const defaultMocks = defaultComponentMocks({
+    currentRoute: mock<RouteLocation>({ name: 'files-spaces-generic' })
+  })
   const storeOptions = {
     ...defaultStoreMockOptions,
     modules: { ...defaultStoreMockOptions.modules, user: { state: { id: 'alice', uuid: 1 } } }
diff --git a/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.ts b/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.ts
index 70aa075cae3..d23a676c47e 100644
--- a/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.ts
+++ b/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.ts
@@ -1,6 +1,6 @@
 import uploadImage from 'web-app-files/src/mixins/spaces/actions/uploadImage.js'
 import { thumbnailService } from '../../../../src/services'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { OwnCloudSdk } from 'web-client/src/types'
 import { Graph } from 'web-client'
 import { clientService } from 'web-pkg'
@@ -9,7 +9,8 @@ import {
   defaultPlugins,
   mount,
   defaultStoreMockOptions,
-  defaultComponentMocks
+  defaultComponentMocks,
+  RouteLocation
 } from 'web-test-helpers'
 
 const Component = {
@@ -64,7 +65,9 @@ describe('uploadImage', () => {
 
 function getWrapper(resolvePutFileContents = true) {
   const clientMock = mockDeep<OwnCloudSdk>()
-  const defaultMocks = defaultComponentMocks({ currentRoute: { name: 'files-spaces-generic' } })
+  const defaultMocks = defaultComponentMocks({
+    currentRoute: mock<RouteLocation>({ name: 'files-spaces-generic' })
+  })
   const mocks = {
     ...defaultMocks,
     $client: {
diff --git a/packages/web-app-files/tests/unit/router/utils.spec.ts b/packages/web-app-files/tests/unit/router/utils.spec.ts
index a77159bff82..8119edfb1fc 100644
--- a/packages/web-app-files/tests/unit/router/utils.spec.ts
+++ b/packages/web-app-files/tests/unit/router/utils.spec.ts
@@ -15,8 +15,14 @@ describe('utils', () => {
         resolve: (r: any) => mock<RouteLocation & { href: string }>({ href: r.name })
       })
 
-      expect(isLocationActive(fakeRouter, { name: 'foo' })).toBe(true)
-      expect(isLocationActive(fakeRouter, { name: 'foo' }, { name: 'bar' })).toBe(true)
+      expect(isLocationActive(fakeRouter, mock<RouteLocation>({ name: 'foo' }))).toBe(true)
+      expect(
+        isLocationActive(
+          fakeRouter,
+          mock<RouteLocation>({ name: 'foo' }),
+          mock<RouteLocation>({ name: 'bar' })
+        )
+      ).toBe(true)
     })
 
     it('returns false if all locations inactive', () => {
@@ -25,8 +31,14 @@ describe('utils', () => {
         resolve: (r: any) => mock<RouteLocation & { href: string }>({ href: r.name })
       })
 
-      expect(isLocationActive(fakeRouter, { name: 'bar' })).toBe(false)
-      expect(isLocationActive(fakeRouter, { name: 'bar' }, { name: 'baz' })).toBe(false)
+      expect(isLocationActive(fakeRouter, mock<RouteLocation>({ name: 'bar' }))).toBe(false)
+      expect(
+        isLocationActive(
+          fakeRouter,
+          mock<RouteLocation>({ name: 'bar' }),
+          mock<RouteLocation>({ name: 'baz' })
+        )
+      ).toBe(false)
     })
   })
 
@@ -38,9 +50,9 @@ describe('utils', () => {
       })
 
       const isFilesLocationActive = isLocationActiveDirector(
-        { name: 'foo' },
-        { name: 'bar' },
-        { name: 'baz' }
+        mock<RouteLocation>({ name: 'foo' }),
+        mock<RouteLocation>({ name: 'bar' }),
+        mock<RouteLocation>({ name: 'baz' })
       )
       expect(isFilesLocationActive(fakeRouter)).toBe(false)
 
@@ -56,20 +68,25 @@ describe('utils', () => {
         resolve: (r: any) => mock<RouteLocation & { href: string }>({ href: r.name })
       })
 
-      const isFilesLocationActive = isLocationActiveDirector({ name: 'foo' }, { name: 'bar' })
+      const isFilesLocationActive = isLocationActiveDirector(
+        mock<RouteLocation>({ name: 'foo' }),
+        mock<RouteLocation>({ name: 'bar' })
+      )
       expect(() => isFilesLocationActive(fakeRouter, 'unknown')).toThrow()
     })
   })
 
   describe('createLocationDirector', () => {
     test('creates a location and handle arguments', () => {
-      const testLocation = createLocation('foo', {
-        path: '/should-not-add',
-        params: { foo: 'foo-param-value' },
-        query: { bar: 'bar-query-value' }
-      })
+      const testLocation = createLocation(
+        'foo',
+        mock<RouteLocation>({
+          path: '/should-not-add',
+          params: { foo: 'foo-param-value' },
+          query: { bar: 'bar-query-value' }
+        })
+      )
       expect(testLocation.name).toBe('foo')
-      expect(testLocation.path).toBeFalsy()
       expect(testLocation.params.foo).toBe('foo-param-value')
       expect(testLocation.query.bar).toBe('bar-query-value')
     })
diff --git a/packages/web-app-files/tests/unit/search/sdk.spec.ts b/packages/web-app-files/tests/unit/search/sdk.spec.ts
index 184d1aa26fa..bbbb310b3f6 100644
--- a/packages/web-app-files/tests/unit/search/sdk.spec.ts
+++ b/packages/web-app-files/tests/unit/search/sdk.spec.ts
@@ -1,8 +1,9 @@
 import { SDKSearch } from '../../../src/search'
 import { clientService } from 'web-pkg/src/services'
 import { Store } from 'vuex'
-import { Router } from 'vue-router'
+import { RouteLocation, Router } from 'vue-router'
 import { mock, mockDeep } from 'jest-mock-extended'
+import { ref } from 'vue'
 
 const searchMock = jest.fn()
 jest.spyOn(clientService, 'owncloudSdk', 'get').mockImplementation(
@@ -49,7 +50,7 @@ describe('SDKProvider', () => {
         const search = new SDKSearch(
           store,
           mock<Router>({
-            currentRoute: { name: v.route }
+            currentRoute: ref(mock<RouteLocation>({ name: v.route }))
           })
         )
 
diff --git a/packages/web-app-files/tests/unit/views/Favorites.spec.ts b/packages/web-app-files/tests/unit/views/Favorites.spec.ts
index 4c7ab7860d6..aabfc6c0ca6 100644
--- a/packages/web-app-files/tests/unit/views/Favorites.spec.ts
+++ b/packages/web-app-files/tests/unit/views/Favorites.spec.ts
@@ -2,7 +2,7 @@ import Favorites from '../../../src/views/Favorites.vue'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from 'vue'
-import { mockDeep } from 'jest-mock-extended'
+import { mockDeep, mock } from 'jest-mock-extended'
 import { Resource } from 'web-client'
 import {
   createStore,
@@ -12,6 +12,7 @@ import {
   defaultStoreMockOptions,
   defaultComponentMocks
 } from 'web-test-helpers'
+import { RouteLocation } from 'vue-router'
 
 jest.mock('web-app-files/src/composables')
 
@@ -51,7 +52,7 @@ function getMountedWrapper({ mocks = {}, files = [], loading = false } = {}) {
   )
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: 'files-common-favorites' }
+      currentRoute: mock<RouteLocation>({ name: 'files-common-favorites' })
     }),
     ...(mocks && mocks)
   }
diff --git a/packages/web-app-files/tests/unit/views/FilesDrop.spec.ts b/packages/web-app-files/tests/unit/views/FilesDrop.spec.ts
index cc02045945b..9c78c0cd9d1 100644
--- a/packages/web-app-files/tests/unit/views/FilesDrop.spec.ts
+++ b/packages/web-app-files/tests/unit/views/FilesDrop.spec.ts
@@ -5,8 +5,10 @@ import {
   mount,
   defaultStoreMockOptions,
   defaultComponentMocks,
-  defaultStubs
+  defaultStubs,
+  RouteLocation
 } from 'web-test-helpers'
+import { mock } from 'jest-mock-extended'
 
 describe('FilesDrop view', () => {
   it('drop container always present', () => {
@@ -29,7 +31,7 @@ describe('FilesDrop view', () => {
 function getMountedWrapper({ mocks = {}, loading = false } = {}) {
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: 'files-common-favorites' }
+      currentRoute: mock<RouteLocation>({ name: 'files-common-favorites' })
     }),
     $client: {
       publicFiles: { list: jest.fn(() => Promise.resolve([{ getProperty: jest.fn() }])) }
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts b/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts
index 4db40374952..8d50041b6ca 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts
+++ b/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts
@@ -2,7 +2,7 @@ import SharedViaLink from '../../../../src/views/shares/SharedViaLink.vue'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from 'vue'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Resource } from 'web-client'
 import {
   createStore,
@@ -10,7 +10,8 @@ import {
   mount,
   defaultStoreMockOptions,
   defaultComponentMocks,
-  defaultStubs
+  defaultStubs,
+  RouteLocation
 } from 'web-test-helpers'
 
 jest.mock('web-app-files/src/composables')
@@ -55,7 +56,7 @@ function getMountedWrapper({ mocks = {}, files = [], loading = false } = {}) {
   )
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: 'files-shares-via-link' }
+      currentRoute: mock<RouteLocation>({ name: 'files-shares-via-link' })
     }),
     ...(mocks && mocks)
   }
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts b/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts
index 15dca33657d..e5abb82fb79 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts
+++ b/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts
@@ -3,9 +3,9 @@ import { useResourcesViewDefaults, useSort } from 'web-app-files/src/composables
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ShareStatus } from 'web-client/src/helpers/share'
 import { ref } from 'vue'
-import { defaultStubs } from 'web-test-helpers'
+import { defaultStubs, RouteLocation } from 'web-test-helpers'
 import { useSortMock } from 'web-app-files/tests/mocks/useSortMock'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Resource } from 'web-client'
 import {
   createStore,
@@ -92,7 +92,7 @@ function getMountedWrapper({ mocks = {}, loading = false, files = [] } = {}) {
   jest.mocked(useSort).mockImplementation((options) => useSortMock({ items: options.items }))
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: 'files-shares-with-me' }
+      currentRoute: mock<RouteLocation>({ name: 'files-shares-with-me' })
     }),
     ...(mocks && mocks)
   }
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts b/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts
index 7e24b3ce2b5..0a28c822561 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts
+++ b/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts
@@ -2,8 +2,8 @@ import SharedWithOthers from '../../../../src/views/shares/SharedWithOthers.vue'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from 'vue'
-import { defaultStubs } from 'web-test-helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { defaultStubs, RouteLocation } from 'web-test-helpers'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Resource } from 'web-client'
 import {
   createStore,
@@ -55,7 +55,7 @@ function getMountedWrapper({ mocks = {}, files = [], loading = false } = {}) {
   )
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: 'files-shares-with-others' }
+      currentRoute: mock<RouteLocation>({ name: 'files-shares-with-others' })
     }),
     ...(mocks && mocks)
   }
diff --git a/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts b/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts
index ddc3e4c9538..2410e5d7b6f 100644
--- a/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts
@@ -1,7 +1,7 @@
 import DriveResolver from '../../../../src/views/spaces/DriveResolver.vue'
 import { useDriveResolver } from 'web-pkg/src/composables'
 import { computed, ref } from 'vue'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { ClientService } from 'web-pkg/src'
 import { locationPublicUpload } from 'web-app-files/src/router/public'
 import { PublicSpaceResource, SpaceResource } from 'web-client/src/helpers'
@@ -12,7 +12,8 @@ import {
   mount,
   defaultStoreMockOptions,
   defaultComponentMocks,
-  defaultStubs
+  defaultStubs,
+  RouteLocation
 } from 'web-test-helpers'
 
 jest.mock('web-pkg/src/composables/driveResolver')
@@ -67,7 +68,10 @@ function getMountedWrapper({
   }))
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: currentRouteName, params: { driveAliasAndItem: '/' } }
+      currentRoute: mock<RouteLocation>({
+        name: currentRouteName,
+        params: { driveAliasAndItem: '/' }
+      })
     }),
     ...(mocks && mocks)
   }
diff --git a/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts b/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts
index 1b13cb92857..5dcbd868261 100644
--- a/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts
@@ -10,7 +10,8 @@ import {
   mount,
   defaultStoreMockOptions,
   defaultComponentMocks,
-  defaultStubs
+  defaultStubs,
+  RouteLocation
 } from 'web-test-helpers'
 
 jest.mock('web-app-files/src/composables')
@@ -134,7 +135,7 @@ function getMountedWrapper({
     })
   )
   const defaultMocks = {
-    ...defaultComponentMocks({ currentRoute }),
+    ...defaultComponentMocks({ currentRoute: mock<RouteLocation>(currentRoute) }),
     ...(mocks && mocks)
   }
   const storeOptions = { ...defaultStoreMockOptions }
diff --git a/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts b/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts
index 8f246f214bf..c8d88344bdd 100644
--- a/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts
@@ -2,7 +2,7 @@ import GenericTrash from '../../../../src/views/spaces/GenericTrash.vue'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from 'vue'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Resource } from 'web-client'
 import { SpaceResource } from 'web-client/src/helpers'
 import {
@@ -11,7 +11,8 @@ import {
   mount,
   defaultStoreMockOptions,
   defaultComponentMocks,
-  defaultStubs
+  defaultStubs,
+  RouteLocation
 } from 'web-test-helpers'
 
 jest.mock('web-app-files/src/composables')
@@ -65,7 +66,7 @@ function getMountedWrapper({ mocks = {}, props = {}, files = [], loading = false
   )
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: 'files-trash-generic' }
+      currentRoute: mock<RouteLocation>({ name: 'files-trash-generic' })
     }),
     ...(mocks && mocks)
   }
diff --git a/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts b/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts
index 2eea9420bce..27050f28030 100644
--- a/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts
@@ -1,5 +1,5 @@
 import Projects from '../../../../src/views/spaces/Projects.vue'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { SpaceResource } from 'web-client/src/helpers'
 import {
   createStore,
@@ -7,7 +7,8 @@ import {
   mount,
   defaultStoreMockOptions,
   defaultComponentMocks,
-  defaultStubs
+  defaultStubs,
+  RouteLocation
 } from 'web-test-helpers'
 
 describe('Projects view', () => {
@@ -60,7 +61,7 @@ describe('Projects view', () => {
 function getMountedWrapper({ mocks = {}, spaces = [] } = {}) {
   const defaultMocks = {
     ...defaultComponentMocks({
-      currentRoute: { name: 'files-spaces-projects' }
+      currentRoute: mock<RouteLocation>({ name: 'files-spaces-projects' })
     }),
     ...(mocks && mocks)
   }
diff --git a/packages/web-pkg/src/composables/appDefaults/types.ts b/packages/web-pkg/src/composables/appDefaults/types.ts
index aa76111b3ff..f3f05c004d1 100644
--- a/packages/web-pkg/src/composables/appDefaults/types.ts
+++ b/packages/web-pkg/src/composables/appDefaults/types.ts
@@ -1,6 +1,7 @@
 import { MaybeRef } from '../../utils'
-import { LocationParams, LocationQuery } from '../router'
+import { LocationQuery } from '../router'
 import { SpaceResource } from 'web-client/src/helpers'
+import { RouteParams } from 'vue-router'
 export interface FileContext {
   path: MaybeRef<string>
   driveAliasAndItem: MaybeRef<string>
@@ -9,7 +10,7 @@ export interface FileContext {
   itemId: MaybeRef<string>
   fileName: MaybeRef<string>
   routeName: MaybeRef<string>
-  routeParams: MaybeRef<LocationParams>
+  routeParams: MaybeRef<RouteParams>
   routeQuery: MaybeRef<LocationQuery>
 }
 
diff --git a/packages/web-pkg/src/composables/appDefaults/useAppDocumentTitle.ts b/packages/web-pkg/src/composables/appDefaults/useAppDocumentTitle.ts
index a902c7b2d83..e98a008d1c8 100644
--- a/packages/web-pkg/src/composables/appDefaults/useAppDocumentTitle.ts
+++ b/packages/web-pkg/src/composables/appDefaults/useAppDocumentTitle.ts
@@ -4,7 +4,7 @@ import { FileContext } from './types'
 import { useAppMeta } from './useAppMeta'
 import { useDocumentTitle } from './useDocumentTitle'
 import { Store } from 'vuex'
-import { Route } from 'vue-router'
+import { RouteLocationNormalizedLoaded } from 'vue-router'
 import { MaybeRef, useTranslations } from 'web-pkg'
 
 interface AppDocumentTitleOptions {
@@ -12,7 +12,7 @@ interface AppDocumentTitleOptions {
   applicationId: string
   applicationName?: MaybeRef<string>
   currentFileContext: Ref<FileContext>
-  currentRoute?: Ref<Route>
+  currentRoute?: Ref<RouteLocationNormalizedLoaded>
 }
 
 export function useAppDocumentTitle({
@@ -28,7 +28,7 @@ export function useAppDocumentTitle({
   const titleSegments = computed(() => {
     const baseTitle =
       basename(unref(unref(currentFileContext).fileName)) ||
-      $gettext(unref(currentRoute)?.meta?.title)
+      $gettext(unref(currentRoute)?.meta?.title as string)
     const meta = unref(unref(appMeta).applicationMeta)
 
     return [baseTitle, unref(applicationName) || meta.name || meta.id].filter(Boolean)
diff --git a/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts b/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts
index 9cb14f526c3..407d63ac75d 100644
--- a/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts
+++ b/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts
@@ -4,14 +4,14 @@ import { dirname } from 'path'
 import { ClientService, MaybeRef, useAppFileHandling } from 'web-pkg'
 import { Resource } from 'web-client'
 import { FileContext } from './types'
-import { Route } from 'vue-router'
+import { RouteLocationNormalizedLoaded } from 'vue-router'
 import { useFileRouteReplace } from '../router/useFileRouteReplace'
 import { DavProperty } from 'web-client/src/webdav/constants'
 import { useAuthService } from '../authContext/useAuthService'
 
 interface AppFolderHandlingOptions {
   store: Store<any>
-  currentRoute: Ref<Route>
+  currentRoute: Ref<RouteLocationNormalizedLoaded>
   clientService?: ClientService
 }
 
diff --git a/packages/web-pkg/src/composables/appDefaults/useAppNavigation.ts b/packages/web-pkg/src/composables/appDefaults/useAppNavigation.ts
index 9ef1104b3d4..13f9d7296bc 100644
--- a/packages/web-pkg/src/composables/appDefaults/useAppNavigation.ts
+++ b/packages/web-pkg/src/composables/appDefaults/useAppNavigation.ts
@@ -1,9 +1,9 @@
 import { unref } from 'vue'
-import { Location, Router } from 'vue-router'
+import { RouteLocation, Router, RouteParams } from 'vue-router'
 
 import { MaybeRef } from '../../utils'
 import { FileContext } from './types'
-import { LocationQuery, LocationParams } from '../router'
+import { LocationQuery } from '../router'
 import { Resource } from 'web-client'
 import { useFileRouteReplace } from '../router/useFileRouteReplace'
 
@@ -29,7 +29,7 @@ const contextRouteQueryKey = 'contextRouteQuery'
   and break them here once on purpose in encapsulated
   functions
 */
-export const routeToContextQuery = (location: Location): LocationQuery => {
+export const routeToContextQuery = (location: RouteLocation): LocationQuery => {
   const { params, query } = location
 
   const contextQuery = {}
@@ -48,7 +48,7 @@ export const routeToContextQuery = (location: Location): LocationQuery => {
 }
 export const contextQueryToFileContextProps = (
   query: LocationQuery
-): { routeName: string; routeParams: LocationParams; routeQuery: LocationQuery } => {
+): { routeName: string; routeParams: RouteParams; routeQuery: LocationQuery } => {
   return {
     routeName: queryItemAsString(query[contextRouteNameKey]),
     routeParams: query[contextRouteParamsKey] as any,
diff --git a/packages/web-pkg/src/composables/authContext/useRequest.ts b/packages/web-pkg/src/composables/authContext/useRequest.ts
index 15d4fefac8e..77c27318592 100644
--- a/packages/web-pkg/src/composables/authContext/useRequest.ts
+++ b/packages/web-pkg/src/composables/authContext/useRequest.ts
@@ -1,18 +1,17 @@
 import { unref } from 'vue'
 import { useClientService } from '../clientService'
 import type { Store } from 'vuex'
-import type { Route } from 'vue-router'
+import type { Router, RouteLocationNormalizedLoaded } from 'vue-router'
 import type { Method, AxiosRequestConfig, AxiosResponse } from 'axios'
 import { ClientService } from '../../services'
 import { useAccessToken, usePublicLinkPassword, usePublicLinkToken, usePublicLinkContext } from './'
 import { useStore } from '../store'
-import Router from 'vue-router'
 
 interface RequestOptions {
   router?: Router
   store?: Store<any>
   clientService?: ClientService
-  currentRoute?: Route
+  currentRoute?: RouteLocationNormalizedLoaded
 }
 
 export interface RequestResult {
diff --git a/packages/web-pkg/src/composables/router/types.ts b/packages/web-pkg/src/composables/router/types.ts
index f0880de49b6..c35e7a23f3b 100644
--- a/packages/web-pkg/src/composables/router/types.ts
+++ b/packages/web-pkg/src/composables/router/types.ts
@@ -6,7 +6,6 @@ export type QueryValue = string | (string | null)[]
 export type LocationQuery = Dictionary<QueryValue>
 
 export type ParamValue = string
-export type LocationParams = Dictionary<ParamValue>
 
 export const authContextValues = ['anonymous', 'user', 'publicLink', 'hybrid'] as const
 export type AuthContext = typeof authContextValues[number]
diff --git a/packages/web-pkg/src/composables/router/useActiveApp.ts b/packages/web-pkg/src/composables/router/useActiveApp.ts
index 4f35b7f82c7..84c378ba035 100644
--- a/packages/web-pkg/src/composables/router/useActiveApp.ts
+++ b/packages/web-pkg/src/composables/router/useActiveApp.ts
@@ -1,7 +1,8 @@
 import { computed, ComputedRef, unref } from 'vue'
-import { useRoute } from 'vue-router'
+import { useRoute } from './useRoute'
+import { RouteLocationNormalizedLoaded } from 'vue-router'
 
-export const activeApp = (route: Route): string => {
+export const activeApp = (route: RouteLocationNormalizedLoaded): string => {
   return route.path.split('/')[1]
 }
 
diff --git a/packages/web-pkg/src/composables/router/useFileRouteReplace.ts b/packages/web-pkg/src/composables/router/useFileRouteReplace.ts
index 19564a9ab47..ba7c4dda48b 100644
--- a/packages/web-pkg/src/composables/router/useFileRouteReplace.ts
+++ b/packages/web-pkg/src/composables/router/useFileRouteReplace.ts
@@ -2,7 +2,7 @@ import { useRouter } from './useRouter'
 import { useConfigurationManager } from '../configuration'
 import { Resource, SpaceResource } from 'web-client/src/helpers'
 import { createFileRouteOptions, mergeFileRouteOptions } from '../../helpers/router'
-import Router from 'vue-router'
+import { Router } from 'vue-router'
 import { ConfigurationManager } from '../../configuration'
 import { unref } from 'vue'
 
diff --git a/packages/web-pkg/src/composables/router/useRouteName.ts b/packages/web-pkg/src/composables/router/useRouteName.ts
index 75af9e9028f..c2543e5d236 100644
--- a/packages/web-pkg/src/composables/router/useRouteName.ts
+++ b/packages/web-pkg/src/composables/router/useRouteName.ts
@@ -4,6 +4,6 @@ import { useRoute } from './useRoute'
 export const useRouteName = (): ComputedRef<string> => {
   const route = useRoute()
   return computed(() => {
-    return unref(route).name
+    return unref(route).name as string
   })
 }
diff --git a/packages/web-pkg/src/composables/router/useRouteQuery.ts b/packages/web-pkg/src/composables/router/useRouteQuery.ts
index 198d596237c..244417a0586 100644
--- a/packages/web-pkg/src/composables/router/useRouteQuery.ts
+++ b/packages/web-pkg/src/composables/router/useRouteQuery.ts
@@ -1,4 +1,4 @@
-import { computed, Ref, unref } from 'vue'
+import { computed, Ref, toRef, unref } from 'vue'
 import { useRouter } from './useRouter'
 import { QueryValue } from './types'
 
@@ -14,6 +14,7 @@ export const useRouteQuery = (name: string, defaultValue?: QueryValue): Ref<Quer
         return
       }
       await router.replace({
+        ...unref(router.currentRoute),
         query: {
           ...unref(router.currentRoute).query,
           [name]: v
diff --git a/packages/web-pkg/src/helpers/router/routeOptions.ts b/packages/web-pkg/src/helpers/router/routeOptions.ts
index acb399fdb7c..fcbdc51dabb 100644
--- a/packages/web-pkg/src/helpers/router/routeOptions.ts
+++ b/packages/web-pkg/src/helpers/router/routeOptions.ts
@@ -1,8 +1,8 @@
 import { isShareSpaceResource, Resource, SpaceResource } from 'web-client/src/helpers'
 import { configurationManager, ConfigurationManager } from '../../configuration'
-import { LocationParams, LocationQuery } from '../../composables'
+import { LocationQuery } from '../../composables'
 import { isUndefined } from 'lodash-es'
-import { Route } from 'vue-router'
+import { RouteLocation, RouteParams } from 'vue-router'
 
 /**
  * Creates route options for routing into a file location:
@@ -20,7 +20,7 @@ export const createFileRouteOptions = (
   space: SpaceResource,
   target: { path?: string; fileId?: string | number },
   options?: { configurationManager?: ConfigurationManager }
-): { params: LocationParams; query: LocationQuery } => {
+): { params: RouteParams; query: LocationQuery } => {
   const config = options?.configurationManager || configurationManager
   return {
     params: {
@@ -35,9 +35,9 @@ export const createFileRouteOptions = (
 }
 
 export const mergeFileRouteOptions = (
-  originalRoute: Route,
-  routeOptions: { params: LocationParams; query: LocationQuery }
-): Route => {
+  originalRoute: RouteLocation,
+  routeOptions: { params: RouteParams; query: LocationQuery }
+): RouteLocation => {
   return Object.assign({}, originalRoute, {
     params: {
       ...originalRoute.params,
diff --git a/packages/web-pkg/tests/unit/composables/router/useRouteQuery.spec.ts b/packages/web-pkg/tests/unit/composables/router/useRouteQuery.spec.ts
index b0664839de2..0f69f30f784 100644
--- a/packages/web-pkg/tests/unit/composables/router/useRouteQuery.spec.ts
+++ b/packages/web-pkg/tests/unit/composables/router/useRouteQuery.spec.ts
@@ -4,7 +4,12 @@ import { getComposableWrapper, createRouter } from 'web-test-helpers'
 
 describe('useRouteQuery', () => {
   it('is reactive', async () => {
-    const router = createRouter()
+    const router = createRouter({
+      routes: [{ path: '/', redirect: null }]
+    })
+    router.push('/')
+    await router.isReady()
+
     let fooQuery: Ref
     let fooValue: ComputedRef
 
@@ -33,16 +38,22 @@ describe('useRouteQuery', () => {
     expect(fooValue.value).toBe(1)
 
     fooQuery.value = '2'
-    await nextTick()
+
+    // FIXME: why do we have to wait for so many ticks?
+    // Why don't we have to do that for any other expectation in the whole file?!
+    for (let i = 0; i < 32; i++) {
+      await nextTick()
+    }
+
     expect(wrapper.find('#fooQuery').element.innerHTML).toBe('2')
     expect(wrapper.find('#fooValue').element.innerHTML).toBe('2')
 
-    await router.push({ query: { foo: '3' } })
+    await router.push({ path: '/', query: { foo: '3' } })
     await nextTick()
     expect(wrapper.find('#fooQuery').element.innerHTML).toBe('3')
     expect(wrapper.find('#fooValue').element.innerHTML).toBe('3')
 
-    await router.push({})
+    await router.push({ path: '/', query: {} })
     await nextTick()
     expect(wrapper.find('#fooQuery').element.innerHTML).toBe('1')
     expect(wrapper.find('#fooValue').element.innerHTML).toBe('1')
@@ -53,12 +64,13 @@ describe('useRouteQuery', () => {
 
     const mocks = { $router: router }
     getComposableWrapper(
-      () => {
+      async () => {
         const fooQuery = useRouteQuery('foo', 'defaultValue')
 
         expect(fooQuery.value).toBe('defaultValue')
 
-        router.push({ query: { foo: 'foo-1' } })
+        router.push({ path: '/', query: { foo: 'foo-1' } })
+        await nextTick()
         expect(fooQuery.value).toBe('foo-1')
 
         router.push({})
@@ -73,11 +85,12 @@ describe('useRouteQuery', () => {
 
     const mocks = { $router: router }
     getComposableWrapper(
-      () => {
+      async () => {
         const fooQuery = useRouteQuery('foo')
         const barQuery = useRouteQuery('bar')
 
-        router.push({ query: { foo: 'foo-1' } })
+        router.push({ path: '/', query: { foo: 'foo-1' } })
+        await nextTick()
         expect(fooQuery.value).toBe('foo-1')
         expect(barQuery.value).toBeFalsy()
 
@@ -98,10 +111,11 @@ describe('useRouteQuery', () => {
 
     const mocks = { $router: router }
     getComposableWrapper(
-      () => {
+      async () => {
         const fooQuery = useRouteQuery('foo')
 
         router.push({ path: '/home', query: { foo: 'bar' } })
+        await nextTick()
         expect(fooQuery.value).toBe('bar')
 
         router.push({ path: '/sub' })
@@ -116,13 +130,14 @@ describe('useRouteQuery', () => {
 
     const mocks = { $router: router }
     getComposableWrapper(
-      () => {
+      async () => {
         const fooQuery = useRouteQuery('foo')
 
         router.push({ path: '/home' })
         expect(fooQuery.value).toBeUndefined()
 
         fooQuery.value = 'changedThroughRef'
+        await nextTick()
         expect(unref(router.currentRoute).query.foo).toBe('changedThroughRef')
       },
       { mocks }
diff --git a/packages/web-pkg/tests/unit/mixins/spaces/delete.spec.ts b/packages/web-pkg/tests/unit/mixins/spaces/delete.spec.ts
index 1a01682d23c..63fc16a26e9 100644
--- a/packages/web-pkg/tests/unit/mixins/spaces/delete.spec.ts
+++ b/packages/web-pkg/tests/unit/mixins/spaces/delete.spec.ts
@@ -6,9 +6,10 @@ import {
   defaultPlugins,
   mockAxiosResolve,
   mount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { clientService } from 'web-pkg'
 import { Graph } from 'web-client'
 
@@ -119,7 +120,9 @@ function getWrapper(graphMock = mockDeep<Graph>()) {
     wrapper: mount(Component, {
       global: {
         plugins: [...defaultPlugins(), store],
-        mocks: defaultComponentMocks({ currentRoute: { name: 'files-spaces-projects' } })
+        mocks: defaultComponentMocks({
+          currentRoute: mock<RouteLocation>({ name: 'files-spaces-projects' })
+        })
       }
     })
   }
diff --git a/packages/web-pkg/tests/unit/mixins/spaces/disable.spec.ts b/packages/web-pkg/tests/unit/mixins/spaces/disable.spec.ts
index 2088567e7c7..abdda2d8e1e 100644
--- a/packages/web-pkg/tests/unit/mixins/spaces/disable.spec.ts
+++ b/packages/web-pkg/tests/unit/mixins/spaces/disable.spec.ts
@@ -6,9 +6,10 @@ import {
   defaultPlugins,
   mockAxiosResolve,
   mount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Graph } from 'web-client'
 import { clientService } from 'web-pkg'
 
@@ -116,7 +117,9 @@ function getWrapper(graphMock = mockDeep<Graph>()) {
     wrapper: mount(Component, {
       global: {
         plugins: [...defaultPlugins(), store],
-        mocks: defaultComponentMocks({ currentRoute: { name: 'files-spaces-projects' } })
+        mocks: defaultComponentMocks({
+          currentRoute: mock<RouteLocation>({ name: 'files-spaces-projects' })
+        })
       }
     })
   }
diff --git a/packages/web-pkg/tests/unit/mixins/spaces/editDescription.spec.ts b/packages/web-pkg/tests/unit/mixins/spaces/editDescription.spec.ts
index 1ac65576fbe..e0a5852e03e 100644
--- a/packages/web-pkg/tests/unit/mixins/spaces/editDescription.spec.ts
+++ b/packages/web-pkg/tests/unit/mixins/spaces/editDescription.spec.ts
@@ -5,9 +5,10 @@ import {
   defaultPlugins,
   mockAxiosResolve,
   mount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Graph } from 'web-client'
 import { clientService } from 'web-pkg'
 
@@ -71,7 +72,9 @@ function getWrapper(graphMock = mockDeep<Graph>()) {
     wrapper: mount(Component, {
       global: {
         plugins: [...defaultPlugins(), store],
-        mocks: defaultComponentMocks({ currentRoute: { name: 'files-spaces-projects' } })
+        mocks: defaultComponentMocks({
+          currentRoute: mock<RouteLocation>({ name: 'files-spaces-projects' })
+        })
       }
     })
   }
diff --git a/packages/web-pkg/tests/unit/mixins/spaces/navigate.spec.ts b/packages/web-pkg/tests/unit/mixins/spaces/navigate.spec.ts
index e2d246c8b0b..e873bf3d162 100644
--- a/packages/web-pkg/tests/unit/mixins/spaces/navigate.spec.ts
+++ b/packages/web-pkg/tests/unit/mixins/spaces/navigate.spec.ts
@@ -1,10 +1,12 @@
+import { mock } from 'jest-mock-extended'
 import Navigate from 'web-pkg/src/mixins/spaces/navigate'
 import {
   createStore,
   defaultComponentMocks,
   defaultPlugins,
   mount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
 
 const Component = {
@@ -46,7 +48,7 @@ describe('navigate', () => {
 })
 
 function getWrapper({ invalidLocation = false } = {}) {
-  const currentRoute = { name: '', params: { driveAliasAndItem: '' } }
+  const currentRoute = mock<RouteLocation>({ name: '', params: { driveAliasAndItem: '' } })
   if (invalidLocation) {
     currentRoute.name = 'files-spaces-generic'
   } else {
diff --git a/packages/web-pkg/tests/unit/mixins/spaces/rename.spec.ts b/packages/web-pkg/tests/unit/mixins/spaces/rename.spec.ts
index 8b81ba1b12f..9c2b907e952 100644
--- a/packages/web-pkg/tests/unit/mixins/spaces/rename.spec.ts
+++ b/packages/web-pkg/tests/unit/mixins/spaces/rename.spec.ts
@@ -1,5 +1,5 @@
 import rename from 'web-pkg/src/mixins/spaces/rename'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Graph } from 'web-client'
 import { clientService } from 'web-pkg'
 import {
@@ -8,7 +8,8 @@ import {
   defaultPlugins,
   mockAxiosResolve,
   mount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
 
 const Component = {
@@ -102,7 +103,9 @@ function getWrapper(graphMock = mockDeep<Graph>()) {
     wrapper: mount(Component, {
       global: {
         plugins: [...defaultPlugins(), store],
-        mocks: defaultComponentMocks({ currentRoute: { name: 'files-spaces-projects' } })
+        mocks: defaultComponentMocks({
+          currentRoute: mock<RouteLocation>({ name: 'files-spaces-projects' })
+        })
       }
     })
   }
diff --git a/packages/web-pkg/tests/unit/mixins/spaces/restore.spec.ts b/packages/web-pkg/tests/unit/mixins/spaces/restore.spec.ts
index 99344bc86c7..630e83bce6e 100644
--- a/packages/web-pkg/tests/unit/mixins/spaces/restore.spec.ts
+++ b/packages/web-pkg/tests/unit/mixins/spaces/restore.spec.ts
@@ -1,6 +1,6 @@
 import restore from 'web-pkg/src/mixins/spaces/restore'
 import { buildSpace } from 'web-client/src/helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { Graph } from 'web-client'
 import { clientService } from 'web-pkg'
 import {
@@ -9,7 +9,8 @@ import {
   defaultPlugins,
   mockAxiosResolve,
   mount,
-  defaultStoreMockOptions
+  defaultStoreMockOptions,
+  RouteLocation
 } from 'web-test-helpers'
 
 const Component = {
@@ -117,7 +118,9 @@ function getWrapper(graphMock = mockDeep<Graph>()) {
     wrapper: mount(Component, {
       global: {
         plugins: [...defaultPlugins(), store],
-        mocks: defaultComponentMocks({ currentRoute: { name: 'files-spaces-projects' } })
+        mocks: defaultComponentMocks({
+          currentRoute: mock<RouteLocation>({ name: 'files-spaces-projects' })
+        })
       }
     })
   }
diff --git a/packages/web-pkg/tests/unit/mixins/spaces/setReadme.spec.ts b/packages/web-pkg/tests/unit/mixins/spaces/setReadme.spec.ts
index f9fd3a7a459..e220e73a8bf 100644
--- a/packages/web-pkg/tests/unit/mixins/spaces/setReadme.spec.ts
+++ b/packages/web-pkg/tests/unit/mixins/spaces/setReadme.spec.ts
@@ -1,13 +1,14 @@
 import setReadme from 'web-pkg/src/mixins/spaces/setReadme'
 import { buildSpace } from 'web-client/src/helpers'
-import { mockDeep } from 'jest-mock-extended'
+import { mock, mockDeep } from 'jest-mock-extended'
 import { OwnCloudSdk } from 'web-client/src/types'
 import {
   createStore,
   defaultPlugins,
   mount,
   defaultStoreMockOptions,
-  defaultComponentMocks
+  defaultComponentMocks,
+  RouteLocation
 } from 'web-test-helpers'
 
 const Component = {
@@ -98,7 +99,9 @@ describe('setReadme', () => {
 
 function getWrapper(resolveGetFileContents = true, space = undefined) {
   const clientMock = mockDeep<OwnCloudSdk>()
-  const defaultMocks = defaultComponentMocks({ currentRoute: { name: 'files-spaces-generic' } })
+  const defaultMocks = defaultComponentMocks({
+    currentRoute: mock<RouteLocation>({ name: 'files-spaces-generic' })
+  })
   const mocks = {
     ...defaultMocks,
     $client: {
diff --git a/packages/web-runtime/src/container/api.ts b/packages/web-runtime/src/container/api.ts
index 59b39e0eb37..1cf52079513 100644
--- a/packages/web-runtime/src/container/api.ts
+++ b/packages/web-runtime/src/container/api.ts
@@ -1,4 +1,4 @@
-import { RouteConfig, Router } from 'vue-router'
+import { RouteRecordRaw, Router } from 'vue-router'
 import clone from 'lodash-es/clone'
 import {
   RuntimeApi,
@@ -18,7 +18,7 @@ import { App, Component, h } from 'vue'
  * @param router
  * @param routes
  */
-const announceRoutes = (applicationId: string, router: Router, routes: RouteConfig[]): void => {
+const announceRoutes = (applicationId: string, router: Router, routes: RouteRecordRaw[]): void => {
   if (!isArray(routes)) {
     throw new ApiError("routes can't be blank")
   }
@@ -33,7 +33,8 @@ const announceRoutes = (applicationId: string, router: Router, routes: RouteConf
 
       const route = clone(applicationRoute)
       if (route.name) {
-        route.name = applicationId === route.name ? route.name : namespaceRouteName(route.name)
+        route.name =
+          applicationId === route.name ? route.name : namespaceRouteName(String(route.name))
       }
 
       route.path = `/${encodeURI(applicationId)}${route.path}`
@@ -46,7 +47,7 @@ const announceRoutes = (applicationId: string, router: Router, routes: RouteConf
 
           const r = clone(childRoute)
           if (childRoute.name) {
-            r.name = namespaceRouteName(childRoute.name)
+            r.name = namespaceRouteName(String(childRoute.name))
           }
           return r
         })
@@ -250,7 +251,8 @@ export const buildRuntimeApi = ({
   }
 
   return {
-    announceRoutes: (routes: RouteConfig[]): void => announceRoutes(applicationId, router, routes),
+    announceRoutes: (routes: RouteRecordRaw[]): void =>
+      announceRoutes(applicationId, router, routes),
     announceNavigationItems: (navigationItems: ApplicationNavigationItem[]): void =>
       announceNavigationItems(applicationId, store, navigationItems),
     announceTranslations: (appTranslations: ApplicationTranslations): void =>
diff --git a/packages/web-runtime/src/container/types.ts b/packages/web-runtime/src/container/types.ts
index 594fe6e5ccc..5ab5c360fc4 100644
--- a/packages/web-runtime/src/container/types.ts
+++ b/packages/web-runtime/src/container/types.ts
@@ -1,5 +1,5 @@
 import { Store } from 'vuex'
-import { RouteConfig, Router } from 'vue-router'
+import { RouteRecordRaw, Router } from 'vue-router'
 import { App, Component } from 'vue'
 
 /** shim configuration for now, should be typed in a later step */
@@ -65,7 +65,7 @@ export interface ApplicationTranslations {
 export interface ClassicApplicationScript {
   appInfo?: ApplicationInformation
   store?: Store<any>
-  routes?: RouteConfig[]
+  routes?: RouteRecordRaw[]
   navItems?: ApplicationNavigationItem[]
   quickActions?: ApplicationQuickActions
   translations?: ApplicationTranslations
@@ -76,7 +76,7 @@ export interface ClassicApplicationScript {
 
 /** RuntimeApi defines the publicly available runtime api */
 export interface RuntimeApi {
-  announceRoutes: (routes: RouteConfig[]) => void
+  announceRoutes: (routes: RouteRecordRaw[]) => void
   announceNavigationItems: (navigationItems: ApplicationNavigationItem[]) => void
   announceTranslations: (appTranslations: ApplicationTranslations) => void
   announceQuickActions: (quickActions: ApplicationQuickActions) => void
diff --git a/packages/web-runtime/src/router/helpers.ts b/packages/web-runtime/src/router/helpers.ts
index eae077c09be..2de0d769138 100644
--- a/packages/web-runtime/src/router/helpers.ts
+++ b/packages/web-runtime/src/router/helpers.ts
@@ -1,9 +1,9 @@
 import { base, router } from './index'
-import { Route, Router, RouteRecordPublic } from 'vue-router'
+import { RouteLocation, RouteParams, Router, RouteRecordNormalized } from 'vue-router'
 import {
+  AuthContext,
   authContextValues,
   contextQueryToFileContextProps,
-  LocationParams,
   WebRouteMeta
 } from 'web-pkg/src/composables'
 
@@ -44,7 +44,7 @@ export const buildUrl = (pathname) => {
  * @param to {Route}
  * @returns {boolean}
  */
-export const isUserContext = (router: Router, to: Route): boolean => {
+export const isUserContext = (router: Router, to: RouteLocation): boolean => {
   const meta = getRouteMeta(to)
   if (meta.authContext === 'user') {
     return true
@@ -54,7 +54,10 @@ export const isUserContext = (router: Router, to: Route): boolean => {
   }
 
   const contextRoute = getContextRoute(router, to)
-  return !contextRoute || getRouteMeta({ meta: contextRoute.meta } as Route).authContext === 'user'
+  return (
+    !contextRoute ||
+    getRouteMeta({ meta: contextRoute.meta } as RouteLocation).authContext === 'user'
+  )
 }
 
 /**
@@ -64,8 +67,8 @@ export const isUserContext = (router: Router, to: Route): boolean => {
  * @param to {Route}
  * @returns {boolean}
  */
-export const isPublicLinkContext = (router: Router, to: Route): boolean => {
-  if (to.params.driveAliasAndItem?.startsWith('public/')) {
+export const isPublicLinkContext = (router: Router, to: RouteLocation): boolean => {
+  if ((to.params.driveAliasAndItem as string)?.startsWith('public/')) {
     return true
   }
 
@@ -79,7 +82,8 @@ export const isPublicLinkContext = (router: Router, to: Route): boolean => {
 
   const contextRoute = getContextRoute(router, to)
   return (
-    contextRoute && getRouteMeta({ meta: contextRoute.meta } as Route).authContext === 'publicLink'
+    contextRoute &&
+    getRouteMeta({ meta: contextRoute.meta } as RouteLocation).authContext === 'publicLink'
   )
 }
 
@@ -89,7 +93,7 @@ export const isPublicLinkContext = (router: Router, to: Route): boolean => {
  * @param to {Route}
  * @returns {string}
  */
-export const extractPublicLinkToken = (to: Route): string => {
+export const extractPublicLinkToken = (to: RouteLocation): string => {
   const contextRouteParams = contextQueryToFileContextProps(to.query)?.routeParams
   if (contextRouteParams) {
     return extractPublicLinkTokenFromRouteParams(contextRouteParams)
@@ -102,14 +106,14 @@ export const extractPublicLinkToken = (to: Route): string => {
  *
  * @param params {LocationParams}
  */
-const extractPublicLinkTokenFromRouteParams = (params: LocationParams): string => {
+const extractPublicLinkTokenFromRouteParams = (params: RouteParams): string => {
   if (Object.prototype.hasOwnProperty.call(params, 'driveAliasAndItem')) {
-    if (!params.driveAliasAndItem.startsWith('public/')) {
+    if (!(params.driveAliasAndItem as string).startsWith('public/')) {
       return ''
     }
-    return params.driveAliasAndItem.split('/')[1]
+    return (params.driveAliasAndItem as string).split('/')[1]
   }
-  return (params.item || params.filePath || params.token || '').split('/')[0]
+  return ((params.item || params.filePath || params.token || '') as string).split('/')[0]
 }
 
 /**
@@ -119,7 +123,7 @@ const extractPublicLinkTokenFromRouteParams = (params: LocationParams): string =
  * @param to {Route}
  * @returns {boolean}
  */
-export const isAnonymousContext = (router: Router, to: Route): boolean => {
+export const isAnonymousContext = (router: Router, to: RouteLocation): boolean => {
   return getRouteMeta(to).authContext === 'anonymous'
 }
 
@@ -133,7 +137,7 @@ export const isAnonymousContext = (router: Router, to: Route): boolean => {
  * the preview app is supposed to load files from is transported via the contextRouteName, contextRouteParams and contextRouteQuery
  * in the URL (provided by the context that opens the preview app in the first place).
  */
-const getContextRoute = (router: Router, to: Route): RouteRecordPublic | null => {
+const getContextRoute = (router: Router, to: RouteLocation): RouteRecordNormalized | null => {
   const contextRouteNameKey = 'contextRouteName'
   if (!to.query || !to.query[contextRouteNameKey]) {
     return null
@@ -142,7 +146,7 @@ const getContextRoute = (router: Router, to: Route): RouteRecordPublic | null =>
   return router.getRoutes().find((r) => r.name === to.query[contextRouteNameKey])
 }
 
-const getRouteMeta = (to: Route): WebRouteMeta => {
+const getRouteMeta = (to: RouteLocation): WebRouteMeta => {
   if (!to.meta) {
     return {
       authContext: 'user'
@@ -153,18 +157,20 @@ const getRouteMeta = (to: Route): WebRouteMeta => {
   if (!to.meta.authContext && Object.prototype.hasOwnProperty.call(to.meta, 'auth')) {
     to.meta.authContext = to.meta.auth ? 'user' : 'hybrid'
     console.warn(
-      `route key meta.auth is deprecated. Please switch to meta.authContext="${to.meta.authContext}" in route "${to.name}".`
+      `route key meta.auth is deprecated. Please switch to meta.authContext="${
+        to.meta.authContext
+      }" in route "${String(to.name)}".`
     )
   }
 
   if (to?.meta?.authContext) {
-    if (authContextValues.includes(to.meta.authContext)) {
+    if (authContextValues.includes(to.meta.authContext as AuthContext)) {
       return to.meta
     }
     console.warn(
-      `invalid authContext "${to.meta.authContext}" in route "${
+      `invalid authContext "${to.meta.authContext}" in route "${String(
         to.name
-      }". must be one of [${authContextValues.join(', ')}].`
+      )}". must be one of [${authContextValues.join(', ')}].`
     )
   }
   if (to?.meta) {
diff --git a/packages/web-runtime/src/router/index.ts b/packages/web-runtime/src/router/index.ts
index 0ddc6b95673..41c0e431cb6 100644
--- a/packages/web-runtime/src/router/index.ts
+++ b/packages/web-runtime/src/router/index.ts
@@ -22,7 +22,7 @@ function $gettext(msg) {
   return msg
 }
 
-export const createRouter = (options?: RouterOptions) => {
+export const createRouter = (options: RouterOptions) => {
   ;(window as any).__HACK__router = _createRouter(options)
   return (window as any).__HACK__router
 }
diff --git a/packages/web-runtime/src/router/setupAuthGuard.ts b/packages/web-runtime/src/router/setupAuthGuard.ts
index b67221e7e90..4d42533c528 100644
--- a/packages/web-runtime/src/router/setupAuthGuard.ts
+++ b/packages/web-runtime/src/router/setupAuthGuard.ts
@@ -1,5 +1,5 @@
 import { extractPublicLinkToken, isPublicLinkContext, isUserContext } from './index'
-import Router, { Route } from 'vue-router'
+import { Router, RouteLocation } from 'vue-router'
 import Vue from 'vue'
 import { contextRouteNameKey, queryItemAsString } from 'web-pkg/src/composables'
 
@@ -35,7 +35,7 @@ export const setupAuthGuard = (router: Router) => {
   })
 }
 
-export const hasContextRouteNameChanged = (to: Route, from: Route): boolean => {
+export const hasContextRouteNameChanged = (to: RouteLocation, from: RouteLocation): boolean => {
   if (!to.query[contextRouteNameKey] && !from.query[contextRouteNameKey]) {
     return false
   }
diff --git a/packages/web-runtime/src/services/auth/authService.ts b/packages/web-runtime/src/services/auth/authService.ts
index 9a1b4e0350a..0c7e17417b5 100644
--- a/packages/web-runtime/src/services/auth/authService.ts
+++ b/packages/web-runtime/src/services/auth/authService.ts
@@ -3,7 +3,7 @@ import { PublicLinkManager } from './publicLinkManager'
 import { Store } from 'vuex'
 import { ClientService } from 'web-pkg/src/services'
 import { ConfigurationManager } from 'web-pkg/src/configuration'
-import { Route, Router } from 'vue-router'
+import { RouteLocation, Router } from 'vue-router'
 import { extractPublicLinkToken, isPublicLinkContext, isUserContext } from '../../router'
 import { unref } from 'vue'
 
@@ -38,7 +38,7 @@ export class AuthService {
    *
    * @param to {Route}
    */
-  public async initializeContext(to: Route) {
+  public async initializeContext(to: RouteLocation) {
     if (!this.publicLinkManager) {
       this.publicLinkManager = new PublicLinkManager({
         clientService: this.clientService,
@@ -179,7 +179,7 @@ export class AuthService {
     await this.userManager.signinSilentCallback()
   }
 
-  public async handleAuthError(route: Route) {
+  public async handleAuthError(route: RouteLocation) {
     if (isPublicLinkContext(this.router, route)) {
       const token = extractPublicLinkToken(route)
       this.publicLinkManager.clear(token)
diff --git a/packages/web-runtime/tests/unit/router/index.spec.ts b/packages/web-runtime/tests/unit/router/index.spec.ts
index 8e4e8737371..c8e5a6de665 100644
--- a/packages/web-runtime/tests/unit/router/index.spec.ts
+++ b/packages/web-runtime/tests/unit/router/index.spec.ts
@@ -30,6 +30,8 @@ describe('buildUrl', () => {
     const { buildUrl } = await import('../../../src/router')
     jest.resetModules()
 
+    // hide warnings for non-existent routes
+    jest.spyOn(console, 'warn').mockImplementation(() => undefined)
     expect(buildUrl(path)).toBe(expected)
   })
 })
diff --git a/packages/web-test-helpers/src/helpers.ts b/packages/web-test-helpers/src/helpers.ts
index efdf2e639b8..6f76811a377 100644
--- a/packages/web-test-helpers/src/helpers.ts
+++ b/packages/web-test-helpers/src/helpers.ts
@@ -2,6 +2,8 @@ import { createStore as _createStore, StoreOptions } from 'vuex'
 import { mount as _mount, MountingOptions } from '@vue/test-utils'
 import { defineComponent } from 'vue'
 import { defaultPlugins } from 'web-test-helpers'
+import { createRouter as _createRouter } from 'web-runtime/src/router'
+import { createMemoryHistory, RouterOptions } from 'vue-router'
 
 jest.spyOn(console, 'warn').mockImplementation(() => undefined)
 
@@ -41,5 +43,12 @@ export const getStoreInstance = <T>(storeOptions: StoreOptions<T>) => {
   return _createStore(storeOptions)
 }
 
-export { createRouter } from 'web-runtime/src/router'
+export type { RouteLocation } from 'vue-router'
 export { RouterLinkStub } from '@vue/test-utils'
+export const createRouter = (options?: Partial<RouterOptions>) =>
+  _createRouter({
+    history: createMemoryHistory(),
+    routes: [],
+    strict: false,
+    ...options
+  })
diff --git a/packages/web-test-helpers/src/mocks/defaultComponentMocks.ts b/packages/web-test-helpers/src/mocks/defaultComponentMocks.ts
index f0080c518ed..a3b7a681e64 100644
--- a/packages/web-test-helpers/src/mocks/defaultComponentMocks.ts
+++ b/packages/web-test-helpers/src/mocks/defaultComponentMocks.ts
@@ -1,28 +1,24 @@
 import { mockDeep } from 'jest-mock-extended'
 import { ClientService } from 'web-pkg/src/services'
-import Router, { RawLocation, Route } from 'vue-router'
+import { Router, RouteLocationNormalizedLoaded, RouteLocationRaw, RouteLocation } from 'vue-router'
 import { UppyService } from 'web-runtime/src/services/uppyService'
 import { OwnCloudSdk } from 'web-client/src/types'
+import { ref } from 'vue'
 
 export interface ComponentMocksOptions {
   gettext?: boolean
-  currentRoute?: {
-    name?: string
-    path?: string
-    query?: { [key: string]: string }
-    params?: { [key: string]: any }
-  }
+  currentRoute?: RouteLocation
 }
 
 export const defaultComponentMocks = ({
   gettext = true,
   currentRoute = undefined
 }: ComponentMocksOptions = {}) => {
-  const $router = mockDeep<Router>({ ...(currentRoute && { currentRoute }) })
+  const $router = mockDeep<Router>({ ...(currentRoute && { currentRoute: ref(currentRoute) }) })
   $router.resolve.mockImplementation(
-    (to: RawLocation) => ({ href: (to as any).name, location: { path: '' } } as any)
+    (to: RouteLocationRaw) => ({ href: (to as any).name, location: { path: '' } } as any)
   )
-  const $route = mockDeep<Route>()
+  const $route = mockDeep<RouteLocationNormalizedLoaded>()
   $route.path = currentRoute?.path || '/'
 
   // FIXME: this is bad ... we can't override $router like this ....
diff --git a/tests/unit/config/jest.init.js b/tests/unit/config/jest.init.js
index 862161802c0..b70b72f5142 100644
--- a/tests/unit/config/jest.init.js
+++ b/tests/unit/config/jest.init.js
@@ -1,4 +1,4 @@
-import Vue, { configureCompat } from 'vue'
+import Vue, { configureCompat, h } from 'vue'
 import { config } from '@vue/test-utils'
 import fetchMock from 'jest-fetch-mock'
 
@@ -22,11 +22,12 @@ config.mocks = {
 }
 
 Vue.component('RouterLink', {
+  name: 'RouterLink',
   props: {
     tag: { type: String, default: 'a' },
     to: { type: [String, Object], default: '' }
   },
-  render(createElement) {
+  render() {
     let path = this.$props.to
 
     if (!!path && typeof path !== 'string') {
@@ -41,6 +42,6 @@ Vue.component('RouterLink', {
       }
     }
 
-    return createElement(this.tag, { attrs: { href: path } }, this.$slots.default)
+    return h(this.tag, { attrs: { href: path } }, this.$slots.default)
   }
 })