From: Eduardo San Martin Morote Date: Thu, 26 Mar 2020 22:04:00 +0000 (+0100) Subject: refactor: remove Immutable usage X-Git-Tag: v4.0.0-alpha.4~11 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=89e47d56a819495967f4c2e9d47f4ff78d899ba6;p=thirdparty%2Fvuejs%2Frouter.git refactor: remove Immutable usage It's been breaking very often and is not providing a satisfactory solution. A better solution could be using Readonly at the specific places it is necessary. It could also make sense to expose a public type that is different from the one used internally --- diff --git a/src/components/Link.ts b/src/components/Link.ts index 0f2f916f..f02c5ba5 100644 --- a/src/components/Link.ts +++ b/src/components/Link.ts @@ -7,12 +7,7 @@ import { reactive, unref, } from 'vue' -import { - RouteLocation, - RouteLocationNormalized, - Immutable, - VueUseOptions, -} from '../types' +import { RouteLocation, RouteLocationNormalized, VueUseOptions } from '../types' import { isSameLocationObject, isSameRouteRecord } from '../utils' import { routerKey } from '../utils/injectionSymbols' import { RouteRecordNormalized } from '../matcher/types' @@ -124,8 +119,8 @@ function guardEvent(e: MouseEvent) { } function includesParams( - outter: Immutable, - inner: Immutable + outter: RouteLocationNormalized['params'], + inner: RouteLocationNormalized['params'] ): boolean { for (let key in inner) { let innerValue = inner[key] diff --git a/src/components/View.ts b/src/components/View.ts index 945e2cb7..587fa663 100644 --- a/src/components/View.ts +++ b/src/components/View.ts @@ -15,7 +15,6 @@ import { RouteLocationMatched, VueUseOptions, RouteLocationNormalizedResolved, - Immutable, } from '../types' import { matchedRouteKey, @@ -24,7 +23,7 @@ import { } from '../utils/injectionSymbols' interface ViewProps { - route: Immutable + route: RouteLocationNormalizedResolved name: string } diff --git a/src/matcher/index.ts b/src/matcher/index.ts index 9019df83..8e305931 100644 --- a/src/matcher/index.ts +++ b/src/matcher/index.ts @@ -25,8 +25,8 @@ interface RouterMatcher { name: Required['name'] ) => RouteRecordMatcher | undefined resolve: ( - location: Readonly, - currentLocation: Readonly + location: MatcherLocation, + currentLocation: MatcherLocationNormalized ) => MatcherLocationNormalized } diff --git a/src/router.ts b/src/router.ts index f3412f23..89907ee1 100644 --- a/src/router.ts +++ b/src/router.ts @@ -7,7 +7,6 @@ import { START_LOCATION_NORMALIZED, Lazy, TODO, - Immutable, MatcherLocationNormalized, RouteLocationNormalizedResolved, } from './types' @@ -81,7 +80,7 @@ export interface RouterOptions { export interface Router { history: RouterHistory - currentRoute: Ref> + currentRoute: Ref addRoute(parentName: string, route: RouteRecord): () => void addRoute(route: RouteRecord): () => void @@ -89,7 +88,7 @@ export interface Router { getRoutes(): RouteRecordNormalized[] resolve(to: RouteLocation): RouteLocationNormalized - createHref(to: Immutable): string + createHref(to: RouteLocationNormalized): string push(to: RouteLocation): Promise replace(to: RouteLocation): Promise @@ -118,7 +117,7 @@ export function createRouter({ const currentRoute = ref( START_LOCATION_NORMALIZED ) - let pendingLocation: Immutable = START_LOCATION_NORMALIZED + let pendingLocation: RouteLocationNormalized = START_LOCATION_NORMALIZED if (isClient && 'scrollRestoration' in window.history) { window.history.scrollRestoration = 'manual' @@ -217,11 +216,11 @@ export function createRouter({ async function pushWithRedirect( to: RouteLocation | RouteLocationNormalized, redirectedFrom: RouteLocationNormalized | undefined - ): Promise { + ): Promise { const toLocation: RouteLocationNormalized = (pendingLocation = // Some functions will pass a normalized location and we don't need to resolve it again typeof to === 'object' && 'matched' in to ? to : resolve(to)) - const from: RouteLocationNormalizedResolved = currentRoute.value + const from = currentRoute.value const data: HistoryState | undefined = (to as any).state // @ts-ignore: no need to check the string as force do not exist on a string const force: boolean | undefined = to.force @@ -617,20 +616,6 @@ function extractChangingRecords( return [leavingRecords, updatingRecords, enteringRecords] } -// function isSameLocation( -// a: Immutable, -// b: Immutable -// ): boolean { -// return ( -// a.name === b.name && -// a.path === b.path && -// a.hash === b.hash && -// isSameLocationObject(a.query, b.query) && -// a.matched.length === b.matched.length && -// a.matched.every((record, i) => isSameRouteRecord(record, b.matched[i])) -// ) -// } - function isSameRouteLocation( a: RouteLocationNormalized, b: RouteLocationNormalized diff --git a/src/types/index.ts b/src/types/index.ts index 2bf0f438..be9f9015 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -13,6 +13,7 @@ import { HistoryState } from '../history/common' export type Lazy = () => Promise export type Override = Pick> & U +// TODO: find a better way to type readonly types. Readonly is non recursive, maybe we should use it at multiple places. It would also allow preventing the problem Immutable create. export type Immutable = { readonly [P in keyof T]: Immutable } @@ -149,7 +150,7 @@ export interface RouteRecordCommon { props?: | boolean | Record - | ((to: Immutable) => Record) + | ((to: RouteLocationNormalized) => Record) // TODO: beforeEnter has no effect with redirect, move and test beforeEnter?: NavigationGuard | NavigationGuard[] meta?: Record @@ -160,7 +161,7 @@ export interface RouteRecordCommon { export type RouteRecordRedirectOption = | RouteLocation - | ((to: Immutable) => RouteLocation) + | ((to: RouteLocationNormalized) => RouteLocation) export interface RouteRecordRedirect extends RouteRecordCommon { redirect: RouteRecordRedirectOption beforeEnter?: never @@ -241,17 +242,14 @@ export interface NavigationGuard { ( this: V, // TODO: we could maybe add extra information like replace: true/false - to: Immutable, - from: Immutable, + to: RouteLocationNormalized, + from: RouteLocationNormalized, next: NavigationGuardCallback ): any } export interface PostNavigationGuard { - ( - to: Immutable, - from: Immutable - ): any + (to: RouteLocationNormalized, from: RouteLocationNormalized): any } export * from './type-guards' diff --git a/src/utils/index.ts b/src/utils/index.ts index ac3ec408..30633c29 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,7 +1,6 @@ import { RouteLocationNormalized, RouteParams, - Immutable, RouteComponent, RouteLocationNormalizedResolved, } from '../types' @@ -73,8 +72,8 @@ export function applyToParams( } export function isSameRouteRecord( - a: Immutable, - b: Immutable + a: RouteRecordNormalized, + b: RouteRecordNormalized ): boolean { // since the original record has an undefined value for aliasOf // but all aliases point to the original record, this will always compare @@ -83,16 +82,16 @@ export function isSameRouteRecord( } export function isSameLocationObject( - a: Immutable, - b: Immutable + a: RouteLocationNormalized['query'], + b: RouteLocationNormalized['query'] ): boolean export function isSameLocationObject( - a: Immutable, - b: Immutable + a: RouteLocationNormalized['params'], + b: RouteLocationNormalized['params'] ): boolean export function isSameLocationObject( - a: Immutable, - b: Immutable + a: RouteLocationNormalized['query' | 'params'], + b: RouteLocationNormalized['query' | 'params'] ): boolean { const aKeys = Object.keys(a) const bKeys = Object.keys(b) @@ -110,20 +109,13 @@ export function isSameLocationObject( } function isSameLocationObjectValue( - a: Immutable, - b: Immutable + a: LocationQueryValue | LocationQueryValue[], + b: LocationQueryValue | LocationQueryValue[] ): boolean +function isSameLocationObjectValue(a: RouteParams, b: RouteParams): boolean function isSameLocationObjectValue( - a: Immutable, - b: Immutable -): boolean -function isSameLocationObjectValue( - a: Immutable< - LocationQueryValue | LocationQueryValue[] | RouteParams | RouteParams[] - >, - b: Immutable< - LocationQueryValue | LocationQueryValue[] | RouteParams | RouteParams[] - > + a: LocationQueryValue | LocationQueryValue[] | RouteParams, + b: LocationQueryValue | LocationQueryValue[] | RouteParams ): boolean { if (typeof a !== typeof b) return false // both a and b are arrays diff --git a/src/utils/injectionSymbols.ts b/src/utils/injectionSymbols.ts index 5921c0ad..184e87d3 100644 --- a/src/utils/injectionSymbols.ts +++ b/src/utils/injectionSymbols.ts @@ -1,9 +1,5 @@ import { InjectionKey, ComputedRef } from 'vue' -import { - RouteLocationMatched, - Immutable, - RouteLocationNormalizedResolved, -} from '../types' +import { RouteLocationMatched, RouteLocationNormalizedResolved } from '../types' import { Router } from '../router' export const hasSymbol = @@ -24,5 +20,5 @@ export const viewDepthKey = PolySymbol('rvd') as InjectionKey export const routerKey = PolySymbol('r') as InjectionKey // rt = route location export const routeLocationKey = PolySymbol('rl') as InjectionKey< - Immutable + RouteLocationNormalizedResolved > diff --git a/yarn.lock b/yarn.lock index 387ad863..130e3de4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -722,34 +722,34 @@ dependencies: "@types/yargs-parser" "*" -"@vue/compiler-core@3.0.0-alpha.9": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.0.0-alpha.9.tgz#d54cee813bb444afbf347da7f49056e523197b70" - integrity sha512-Hx4yr83DwIS4B6WfEXWJYcD5EjGoBLQKx7EfoKTvp7++ssO574J/BgasJSUbw/DOm3sHumXZtWRDTn/SKSTs7Q== +"@vue/compiler-core@3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.0.0-alpha.10.tgz#39e8de2d7fe8a932cd08958200f37086a9d6841a" + integrity sha512-YXJJyFfkgmX3Rnf+sEcL8RR9a9UiHqB6ng1pzN1Dy8STASqUBdwinvi/xBuuCS7mDls12xn562y5CEATAwZs/Q== dependencies: "@babel/parser" "^7.8.6" "@babel/types" "^7.8.6" - "@vue/shared" "3.0.0-alpha.9" + "@vue/shared" "3.0.0-alpha.10" estree-walker "^0.8.1" source-map "^0.6.1" -"@vue/compiler-dom@3.0.0-alpha.9": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.0.0-alpha.9.tgz#cb93b9f25eaabaf084bcbae5518cd91565b09ba3" - integrity sha512-LgYtgKTcjjRWX41EMpjAdcvNTM1mSvV6Z9iXcGQs348PzcbihboFvaVqOkK14f9R1d5WsnCaYvUNuIGSNV0Xig== +"@vue/compiler-dom@3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.0.0-alpha.10.tgz#be9ec1d24d0c4d96d164f8e00a479bd88a45e55d" + integrity sha512-hOasMBUsmqccY9Qyytqmrup4AnxQ6zBHT8tC9QpfdtygvxrFK2uNvNZlPoZay2hB13fJjZgRdCyxELM0zB4Hww== dependencies: - "@vue/compiler-core" "3.0.0-alpha.9" - "@vue/shared" "3.0.0-alpha.9" + "@vue/compiler-core" "3.0.0-alpha.10" + "@vue/shared" "3.0.0-alpha.10" -"@vue/compiler-sfc@latest": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.0.0-alpha.9.tgz#5d28d9d18fd0c4fb7fbe0e08f85f333fd7ecc8b1" - integrity sha512-Wr4O0J/lO4Q5Li6RfhZFZNIuYlBkmhk6UxxgCWdW1iPko3/C/oI9/k2SBSiRQcGCE+J5N3l/x1elYlq77YHvHA== +"@vue/compiler-sfc@^3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.0.0-alpha.10.tgz#c2e148d224bdcf8b1a1be026e492c8a2e65401a1" + integrity sha512-JyZbNkAOTKcEk90/9eB+sqsBBCP5+exspDYLPmiL5HXak5G1+pQsVFB8sZAEqz35TMDoM2CxTLBuwKdhF6jEvQ== dependencies: - "@vue/compiler-core" "3.0.0-alpha.9" - "@vue/compiler-dom" "3.0.0-alpha.9" - "@vue/compiler-ssr" "3.0.0-alpha.9" - "@vue/shared" "3.0.0-alpha.9" + "@vue/compiler-core" "3.0.0-alpha.10" + "@vue/compiler-dom" "3.0.0-alpha.10" + "@vue/compiler-ssr" "3.0.0-alpha.10" + "@vue/shared" "3.0.0-alpha.10" consolidate "^0.15.1" hash-sum "^2.0.0" lru-cache "^5.1.1" @@ -758,42 +758,42 @@ postcss-selector-parser "^6.0.2" source-map "^0.6.1" -"@vue/compiler-ssr@3.0.0-alpha.9": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.0.0-alpha.9.tgz#e5b64601dfa24437a0e7b5c56b98de4458fa5334" - integrity sha512-BW3rpZyy6xxrvjGEM5vsadQrYH8kiG1MAO/8aKW4mgW+4Rj34MUATrWwYdmk+yVsgnaMirfUYuc4gRZbcTZCYw== +"@vue/compiler-ssr@3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.0.0-alpha.10.tgz#5f4cb1ddf748637087847401e0bd7f5bfa6bc166" + integrity sha512-9wwuz524VENQtIimzT70bG0Lqlk5L9l9+sah3Ghz8/kflOGOX2EyZKU3VhCOJ5cTt6CcFch63toKaVALCHzgtg== dependencies: - "@vue/compiler-dom" "3.0.0-alpha.9" - "@vue/shared" "3.0.0-alpha.9" + "@vue/compiler-dom" "3.0.0-alpha.10" + "@vue/shared" "3.0.0-alpha.10" -"@vue/reactivity@3.0.0-alpha.9": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.0.0-alpha.9.tgz#e8c8b5ecaad3a60978a503e4fdfd277644c49738" - integrity sha512-Z9jlQ2yjNQIcVBg1SSViUQH8UgVhXHFblw4c6Xrf7vgejjxAqJwk6DKNbAJlneeA3Z84Ul+1Q8JY4zClLagW/A== +"@vue/reactivity@3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.0.0-alpha.10.tgz#d859acd384e42d42086cfefbefe478825aaa9b82" + integrity sha512-H4E0kbQQuc9W0eVKkPLK5g1CwUQkMh4pUWEE/Gl2pZsnDVNJlvbZIMwKu6P5cjd30Nnbv2sG3+wcUGS4TplDuA== dependencies: - "@vue/shared" "3.0.0-alpha.9" + "@vue/shared" "3.0.0-alpha.10" -"@vue/runtime-core@3.0.0-alpha.9": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.0.0-alpha.9.tgz#295884f0cbec22be3fbcfce0ff1a2493e33abb67" - integrity sha512-mqTQ2kpKtUKwvMT23VDm6HEIt+8SxvOaL47aLs5uROs7Jamgp0K2oNkGH/MltWpaDkXVSsbSBBgijgYDsKlbZw== +"@vue/runtime-core@3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.0.0-alpha.10.tgz#abba11b4c8ed4933632050c0319f63fffe66bb86" + integrity sha512-b4YPU+DnowcthtcZSPgAxEExAq/dz31aQasiY1lvSB54y4T2QNYOydVYnZsFUMOFhN0Fh3+k5s1dTolorem1cw== dependencies: - "@vue/reactivity" "3.0.0-alpha.9" - "@vue/shared" "3.0.0-alpha.9" + "@vue/reactivity" "3.0.0-alpha.10" + "@vue/shared" "3.0.0-alpha.10" -"@vue/runtime-dom@3.0.0-alpha.9": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.0.0-alpha.9.tgz#dfbfcbd4e3bf69a74736c1c3d79780a31434ad6f" - integrity sha512-zWDW7Lg38PDoW+grQsSPzBauMMeY6A9yw/qaAzzgeN71EXJRInmv1fog/dVuWbD7/ZNc8E4jzDUJL16ryGbSmg== +"@vue/runtime-dom@3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.0.0-alpha.10.tgz#005880179a52001b4e4e76c816555cc0ce5d16a9" + integrity sha512-X0UcZlXBwZ0OW4yw3hA+8uE2CArPDf2LKk9aTIi3xrCeluQmJSEUsgDNxHBqvmNhVGqdi0kPB09NrOxfEtyPhw== dependencies: - "@vue/runtime-core" "3.0.0-alpha.9" - "@vue/shared" "3.0.0-alpha.9" + "@vue/runtime-core" "3.0.0-alpha.10" + "@vue/shared" "3.0.0-alpha.10" csstype "^2.6.8" -"@vue/shared@3.0.0-alpha.9": - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.0.0-alpha.9.tgz#681053df422dea1c8c2f54e860ef7c4b949b9852" - integrity sha512-34jsIMNwXJ6V6qlGx5ATw4YHTRxoKCyKN8MulRrUxo4BDhzEl1T1nsh6A9dsmJ8MGki/4MtYyxStTnPBQCLNfA== +"@vue/shared@3.0.0-alpha.10": + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.0.0-alpha.10.tgz#7026d9a81fa5f03ea03e9434be6286ed167684b8" + integrity sha512-b6VYQrhsp/N0QpuXdxs1xIDrBiqVzFNyAvyQgPk2ssQgWD6H2StoySDj99DWrum2+pJUDO2/2dLfGH8l180R6g== "@webassemblyjs/ast@1.9.0": version "1.9.0" @@ -8783,14 +8783,14 @@ vue-loader@next: merge-source-map "^1.1.0" source-map "^0.6.1" -vue@next: - version "3.0.0-alpha.9" - resolved "https://registry.yarnpkg.com/vue/-/vue-3.0.0-alpha.9.tgz#f84b6b52caf6753a8cefda370bd6bbd298b5b06a" - integrity sha512-zZrfbchyCQXF/+9B5fD4djlqzZ2XB39MxDzTaJKfuMjs/CgD2CTDiEVrOcP9HwMjr48cpARiFH13vvl4/F73RA== +vue@^3.0.0-alpha.10: + version "3.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/vue/-/vue-3.0.0-alpha.10.tgz#0f1cb5471edc41e0b0153ff07f462e376e03b0ae" + integrity sha512-USdgVs1bQfuiM5ivt2S2XGKOmDC+gKhhc3RNKjASUnh9kWv/vhNJlQiqIaUFiPN9SE9833fWy3PKOJFj9yZjPQ== dependencies: - "@vue/compiler-dom" "3.0.0-alpha.9" - "@vue/runtime-dom" "3.0.0-alpha.9" - "@vue/shared" "3.0.0-alpha.9" + "@vue/compiler-dom" "3.0.0-alpha.10" + "@vue/runtime-dom" "3.0.0-alpha.10" + "@vue/shared" "3.0.0-alpha.10" w3c-hr-time@^1.0.1: version "1.0.2"