Fix types and tests

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>

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' } })
           })
         }
       }

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' } })
           })
         }
       }

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,

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 = {

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),

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,

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,

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,

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,

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(
     {},
     {

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'

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'

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'

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'

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'

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