Skip to content

Warn about root paths without a leading slash (fix #2550) #2591

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Aug 30, 2019
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions src/create-route-map.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,16 @@ export function createRouteMap (
}
}

// warn if routes do not include leading slashes
const pathsMissingSlashes = pathList
.filter(path => !!path && path.charAt(0) !== '*' && path.charAt(0) !== '/')
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think a single find is simpler. No need for the map and I don't really understand the last filter call
We can also remove the !!path check as it's a string

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

find is much simpler but unfortunately I do not think it's supported by this version of nightwatch which causes e2e tests to fail.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

you are totally right! Thank you for catching that, it would fail on IE as well. Then let's keep the filter and display the list of failing routes since the information is there already. If the routes could be displayed one per line, that would be perfect as it would be more readable (I don't remember how it was before)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It used to be just comma separated, but one per line sounds better

.map(path => path.split('/')[0])
.filter((path, index, pathList) => pathList.indexOf(path) === index)

if (pathsMissingSlashes.length > 0) {
warn(false, `The following routes require a leading slash in their paths: ${pathsMissingSlashes.join(', ')}`)
}

return {
pathList,
pathMap,
Expand Down
42 changes: 42 additions & 0 deletions test/unit/specs/create-map.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,48 @@ describe('Creating Route Map', function () {
expect(console.warn.calls.argsFor(0)[0]).toMatch('vue-router] Duplicate param keys in route with path: "/foo/:id/bar/:id"')
})

it('in development, warn if a path is missing a leading slash', function () {
process.env.NODE_ENV = 'development'
maps = createRouteMap([
{ path: '/', name: 'home', component: Home },
{ path: 'bar', name: 'bar', component: Bar },
{ path: 'foo', name: 'foo', component: Foo,
children: [
{ path: 'bar/:id', component: Bar }
]
},
{ path: '*', name: 'any', component: Baz }
])
expect(console.warn).toHaveBeenCalledTimes(1)
expect(console.warn.calls.argsFor(0)[0]).toEqual('[vue-router] The following routes require a leading slash in their paths: bar, foo')
})

it('in development, it has not logged a missing leading slash warning when all paths have slashes', function () {
process.env.NODE_ENV = 'development'
maps = createRouteMap([
{ path: '/', name: 'home', component: Home },
{ path: '/bar', name: 'bar', component: Bar },
{ path: '/foo', name: 'foo', component: Foo,
children: [
{ path: 'bar/:id', component: Bar }
]
},
{ path: '*', name: 'any', component: Baz }
])
expect(console.warn).not.toHaveBeenCalled()
})

it('in production, it has not logged a missing leading slash warning', function () {
process.env.NODE_ENV = 'production'
maps = createRouteMap([
{ path: '/', name: 'home', component: Home },
{ path: 'bar', name: 'bar', component: Bar },
{ path: 'foo', name: 'foo', component: Foo },
{ path: '*', name: 'any', component: Baz }
])
expect(console.warn).not.toHaveBeenCalled()
})

describe('path-to-regexp options', function () {
const routes = [
{ path: '/foo', name: 'foo', component: Foo },
Expand Down