From: Eduardo San Martin Morote Date: Wed, 7 Oct 2020 09:16:43 +0000 (+0200) Subject: feat(devtools): better search X-Git-Tag: v4.0.0-rc.2~6 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=5d68a29386f34363b38c4138fbeae01ec538285e;p=thirdparty%2Fvuejs%2Frouter.git feat(devtools): better search --- diff --git a/e2e/webpack.config.js b/e2e/webpack.config.js index ebded67f..a3857dc3 100644 --- a/e2e/webpack.config.js +++ b/e2e/webpack.config.js @@ -16,6 +16,7 @@ fs.readdirSync(__dirname).forEach(dir => { const globalCss = resolve(__dirname, 'global.css') +/** @type {import('webpack').ConfigurationFactory} */ const config = (env = {}) => ({ // Expose __dirname to allow automatically setting basename. context: __dirname, @@ -74,7 +75,7 @@ const config = (env = {}) => ({ }, plugins: [ new webpack.DefinePlugin({ - __DEV__: JSON.stringify(process.env.NODE_ENV !== 'production'), + __DEV__: JSON.stringify(!env.prod), __CI__: JSON.stringify(process.env.CI || false), __BROWSER__: 'true', 'process.env': { diff --git a/playground/tsconfig.json b/playground/tsconfig.json index 85d58943..a6d5b8b9 100644 --- a/playground/tsconfig.json +++ b/playground/tsconfig.json @@ -1,5 +1,5 @@ { - "include": ["./**/*.ts"], + "include": ["*.ts", "api", "../src/global.d.ts", "shim.d.ts"], "compilerOptions": { "target": "es5" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */, "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */, diff --git a/src/devtools.ts b/src/devtools.ts index f3f77b6b..89d801dc 100644 --- a/src/devtools.ts +++ b/src/devtools.ts @@ -7,6 +7,7 @@ import { TimelineEvent, } from '@vue/devtools-api' import { watch } from 'vue' +import { decode } from './encoding' import { RouterMatcher } from './matcher' import { RouteRecordMatcher } from './matcher/pathMatcher' import { PathParser } from './matcher/pathParserRanker' @@ -107,7 +108,7 @@ export function addDevtools(app: App, router: Router, matcher: RouterMatcher) { router.beforeEach((to, from) => { const data: TimelineEvent['data'] = { - guard: formatDisplay('beforEach'), + guard: formatDisplay('beforeEach'), from: formatRouteLocation( from, 'Current Location during this navigation' @@ -175,13 +176,15 @@ export function addDevtools(app: App, router: Router, matcher: RouterMatcher) { api.on.getInspectorTree(payload => { if (payload.app === app && payload.inspectorId === routerInspectorId) { - const routes = matcher.getRoutes().filter( - route => - !route.parent && - (!payload.filter || + let routes = matcher.getRoutes() + if (payload.filter) { + routes = routes.filter( + route => + !route.parent && // save isActive state - isRouteMatching(route, payload.filter)) - ) + isRouteMatching(route, payload.filter.toLowerCase()) + ) + } // reset match state if no filter is provided if (!payload.filter) { routes.forEach(route => { @@ -355,8 +358,16 @@ function isRouteMatching(route: RouteRecordMatcher, filter: string): boolean { return false } + const path = route.record.path.toLowerCase() + const decodedPath = decode(path) + // also allow partial matching on the path - if (route.record.path.startsWith(filter)) return true + if ( + !filter.startsWith('/') && + (decodedPath.includes(filter) || path.includes(filter)) + ) + return true + if (decodedPath.startsWith(filter) || path.startsWith(filter)) return true if (route.record.name && String(route.record.name).includes(filter)) return true