Skip to content

Commit 8dd8ceb

Browse files
committed
[fixed] Mark dynamic index routes as active
1 parent cb31040 commit 8dd8ceb

File tree

3 files changed

+61
-103
lines changed

3 files changed

+61
-103
lines changed

modules/__tests__/DynamicRoute-test.js

Lines changed: 0 additions & 100 deletions
This file was deleted.

modules/__tests__/isActive-test.js

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -297,4 +297,45 @@ describe('isActive', function () {
297297
})
298298
})
299299
})
300+
301+
describe('dynamic routes', function () {
302+
const routes = {
303+
path: '/',
304+
childRoutes: [
305+
{ path: 'foo' }
306+
],
307+
getIndexRoute(location, callback) {
308+
setTimeout(() => callback(null, {}))
309+
}
310+
}
311+
312+
describe('when not on index route', function () {
313+
it('does not show index as active', function (done) {
314+
render((
315+
<Router history={createHistory('/foo')} routes={routes} />
316+
), node, function () {
317+
expect(this.history.isActive('/')).toBe(true)
318+
expect(this.history.isActive('/', null, true)).toBe(false)
319+
expect(this.history.isActive('/foo')).toBe(true)
320+
done()
321+
})
322+
})
323+
})
324+
325+
describe('when on index route', function () {
326+
it('shows index as active', function (done) {
327+
render((
328+
<Router history={createHistory('/')} routes={routes} />
329+
), node, function () {
330+
// Need to wait for async match to complete.
331+
setTimeout(() => {
332+
expect(this.history.isActive('/')).toBe(true)
333+
expect(this.history.isActive('/', null, true)).toBe(true)
334+
expect(this.history.isActive('/foo')).toBe(false)
335+
done()
336+
})
337+
})
338+
})
339+
})
340+
})
300341
})

modules/isActive.js

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,11 +69,28 @@ function getMatchingRoute(pathname, activeRoutes, activeParams) {
6969
function routeIsActive(pathname, activeRoutes, activeParams, indexOnly) {
7070
let route = getMatchingRoute(pathname, activeRoutes, activeParams)
7171

72-
if (route == null)
72+
if (route == null) {
7373
return false
74+
}
75+
76+
if (indexOnly) {
77+
if (activeRoutes.length < 2) {
78+
return false
79+
}
7480

75-
if (indexOnly)
76-
return activeRoutes.length > 1 && activeRoutes[activeRoutes.length - 1] === route.indexRoute
81+
const lastRoute = activeRoutes[activeRoutes.length - 1]
82+
if (route.indexRoute) {
83+
return lastRoute === route.indexRoute
84+
}
85+
86+
// TODO: Should we also return true if lastRoute is route?
87+
88+
// In case the index route was configured via getIndexRoute.
89+
return (
90+
activeRoutes[activeRoutes.length - 2] === route &&
91+
!lastRoute.path // Pathless route must have been the index route.
92+
)
93+
}
7794

7895
return true
7996
}

0 commit comments

Comments
 (0)