Skip to content

Commit a9c1418

Browse files
committed
feat: add route options
1 parent 9e3789c commit a9c1418

27 files changed

+560
-288
lines changed

e2e/docs/router/navigate-by-link.md

+22-2
Original file line numberDiff line numberDiff line change
@@ -16,13 +16,33 @@
1616
<a :href="$withBase('/404.html#404')" class="not-found-with-hash">404</a>
1717
<a :href="$withBase('/404.html#404?notFound=true')" class="not-found-with-hash-and-query">404</a>
1818

19+
## HTML Clean Links
20+
21+
<a :href="$withBase('/')" class="home">Home</a>
22+
<a :href="$withBase('/404')" class="not-found">404</a>
23+
<a :href="$withBase('/?home=true')" class="home-with-query">Home</a>
24+
<a :href="$withBase('/?home=true#home')" class="home-with-query-and-hash">Home</a>
25+
<a :href="$withBase('/404#404')" class="not-found-with-hash">404</a>
26+
<a :href="$withBase('/404#404?notFound=true')" class="not-found-with-hash-and-query">404</a>
27+
28+
## Markdown Clean Links
29+
30+
> Non-recommended usage. HTML paths could not be prepended with `base` correctly.
31+
32+
- [Home](/)
33+
- [404](/404)
34+
- [Home with query](/?home=true)
35+
- [Home with query and hash](/?home=true#home)
36+
- [404 with hash](/404#404)
37+
- [404 with hash and query](/404#404?notFound=true)
38+
1939
## Markdown Links with html paths
2040

41+
> Non-recommended usage. HTML paths could not be prepended with `base` correctly.
42+
2143
- [Home](/)
2244
- [404](/404.html)
2345
- [Home with query](/?home=true)
2446
- [Home with query and hash](/?home=true#home)
2547
- [404 with hash](/404.html#404)
2648
- [404 with hash and query](/404.html#404?notFound=true)
27-
28-
> Non-recommended usage. HTML paths could not be prepended with `base` correctly.

e2e/docs/router/navigate-by-router.md

+52-18
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,71 @@
1-
<button id="home" @click="goHome">Home</button>
2-
<button id="not-found" @click="go404">404</button>
1+
<div id="full">
2+
<button class="home" @click="goHome">Home</button>
3+
<button class="not-found" @click="go404">404</button>
4+
<button class="home-with-query" @click="goHomeWithQuery">Home</button>
5+
<button class="home-with-query-and-hash" @click="goHomeWithQueryAndHash">Home</button>
6+
<button class="not-found-with-hash" @click="go404WithHash">404</button>
7+
<button class="not-found-with-hash-and-query" @click="go404WithHashAndQuery">404</button>
8+
</div>
39

4-
<button id="home-with-query" @click="goHomeWithQuery">Home</button>
5-
<button id="home-with-query-and-hash" @click="goHomeWithQueryAndHash">Home</button>
6-
<button id="not-found-with-hash" @click="go404WithHash">404</button>
7-
<button id="not-found-with-hash-and-query" @click="go404WithHashAndQuery">404</button>
10+
<div id="clean">
11+
<button class="home" @click="goHome">Home</button>
12+
<button class="not-found" @click="go404">404</button>
13+
<button class="home-with-query" @click="goHomeWithQuery">Home</button>
14+
<button class="home-with-query-and-hash" @click="goHomeWithQueryAndHash">Home</button>
15+
<button class="not-found-with-hash" @click="go404WithHash">404</button>
16+
<button class="not-found-with-hash-and-query" @click="go404WithHashAndQuery">404</button>
17+
</div>
818

919
<script setup lang="ts">
1020
import { useRouter } from 'vuepress/client';
1121

1222
const router = useRouter();
1323

14-
const goHome = () => {
15-
router.push('/');
24+
const goHome = (event) => {
25+
if (event.currentTarget.parentElement.id === 'full') {
26+
router.push('/index.html');
27+
} else {
28+
router.push('/');
29+
}
1630
}
1731

18-
const go404 = () => {
19-
router.push('/404.html');
32+
const go404 = (event) => {
33+
if (event.currentTarget.parentElement.id === 'full') {
34+
router.push('/404.html');
35+
} else {
36+
router.push('/404');
37+
}
2038
}
2139

22-
const goHomeWithQuery = () => {
23-
router.push('/?home=true');
40+
const goHomeWithQuery = (event) => {
41+
if (event.currentTarget.parentElement.id === 'full') {
42+
router.push('/index.html?home=true');
43+
} else {
44+
router.push('/?home=true');
45+
}
2446
}
2547

26-
const goHomeWithQueryAndHash = () => {
27-
router.push('/?home=true#home');
48+
const goHomeWithQueryAndHash = (event) => {
49+
if (event.currentTarget.parentElement.id === 'full') {
50+
router.push('/index.html?home=true#home');
51+
} else {
52+
router.push('/?home=true#home');
53+
}
2854
}
2955

30-
const go404WithHash = () => {
31-
router.push('/404.html#404');
56+
const go404WithHash = (event) => {
57+
if (event.currentTarget.parentElement.id === 'full') {
58+
router.push('/404.html#404');
59+
} else {
60+
router.push('/404#404');
61+
}
3262
}
3363

34-
const go404WithHashAndQuery = () => {
35-
router.push('/404.html#404?notFound=true');
64+
const go404WithHashAndQuery = (event) => {
65+
if (event.currentTarget.parentElement.id === 'full') {
66+
router.push('/404.html#404?notFound=true');
67+
} else {
68+
router.push('/404#404?notFound=true');
69+
}
3670
}
3771
</script>

e2e/tests/router/navigate-by-link.spec.ts

+92-1
Original file line numberDiff line numberDiff line change
@@ -81,10 +81,101 @@ test.describe('html links', () => {
8181
})
8282
})
8383

84+
test.describe('html clean links', () => {
85+
test('should navigate to home correctly', async ({ page }) => {
86+
await page.locator('#html-clean-links + p > a').nth(0).click()
87+
await expect(page).toHaveURL(BASE)
88+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
89+
})
90+
91+
test('should navigate to 404 page correctly', async ({ page }) => {
92+
await page.locator('#html-clean-links + p> a').nth(1).click()
93+
await expect(page).toHaveURL(`${BASE}404.html`)
94+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
95+
})
96+
97+
test('should preserve query', async ({ page }) => {
98+
await page.locator('#html-clean-links + p > a').nth(2).click()
99+
await expect(page).toHaveURL(`${BASE}?home=true`)
100+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
101+
})
102+
103+
test('should preserve query and hash', async ({ page }) => {
104+
await page.locator('#html-clean-links + p > a').nth(3).click()
105+
await expect(page).toHaveURL(`${BASE}?home=true#home`)
106+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
107+
})
108+
109+
test('should preserve hash', async ({ page }) => {
110+
await page.locator('#html-clean-links + p > a').nth(4).click()
111+
await expect(page).toHaveURL(`${BASE}404.html#404`)
112+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
113+
})
114+
115+
test('should preserve hash and query', async ({ page }) => {
116+
await page.locator('#html-clean-links + p > a').nth(5).click()
117+
await expect(page).toHaveURL(`${BASE}404.html#404?notFound=true`)
118+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
119+
})
120+
})
121+
122+
test.describe('markdown clean links', () => {
123+
test('should navigate to home correctly', async ({ page }) => {
124+
await page.locator('#markdown-clean-links + ul > li > a').nth(0).click()
125+
await expect(page).toHaveURL(BASE)
126+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
127+
})
128+
129+
test('should navigate to 404 page correctly', async ({ page }) => {
130+
await page
131+
.locator('#markdown-clean-links + blockquote + ul > li > a')
132+
.nth(1)
133+
.click()
134+
await expect(page).toHaveURL(`${BASE}404.html`)
135+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
136+
})
137+
138+
test('should preserve query', async ({ page }) => {
139+
await page
140+
.locator('#markdown-clean-links + blockquote + ul > li > a')
141+
.nth(2)
142+
.click()
143+
await expect(page).toHaveURL(`${BASE}?home=true`)
144+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
145+
})
146+
147+
test('should preserve query and hash', async ({ page }) => {
148+
await page
149+
.locator('#markdown-clean-links + blockquote + ul > li > a')
150+
.nth(3)
151+
.click()
152+
await expect(page).toHaveURL(`${BASE}?home=true#home`)
153+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
154+
})
155+
156+
test('should preserve hash', async ({ page }) => {
157+
await page
158+
.locator('#markdown-clean-links + blockquote + ul > li > a')
159+
.nth(4)
160+
.click()
161+
await expect(page).toHaveURL(`${BASE}404.html#404`)
162+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
163+
})
164+
165+
test('should preserve hash and query', async ({ page }) => {
166+
await page
167+
.locator('#markdown-clean-links + blockquote + ul > li > a')
168+
.nth(5)
169+
.click()
170+
await expect(page).toHaveURL(`${BASE}404.html#404?notFound=true`)
171+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
172+
})
173+
})
174+
84175
test.describe('markdown links with html paths', () => {
85176
test('should navigate to home correctly', async ({ page }) => {
86177
const locator = page
87-
.locator('#markdown-links-with-html-paths + ul > li > a')
178+
.locator('#markdown-links-with-html-paths + blockquote + ul > li > a')
88179
.nth(0)
89180
if (BASE === '/') {
90181
await locator.click()

e2e/tests/router/navigate-by-router.spec.ts

+72-24
Original file line numberDiff line numberDiff line change
@@ -5,38 +5,86 @@ test.beforeEach(async ({ page }) => {
55
await page.goto('router/navigate-by-router.html')
66
})
77

8-
test('should navigate to home correctly', async ({ page }) => {
9-
await page.locator('#home').click()
10-
await expect(page).toHaveURL(BASE)
11-
await expect(page.locator('#home-h2')).toHaveText('Home H2')
8+
test.describe('should navigate to home correctly', () => {
9+
test('full', async ({ page }) => {
10+
await page.locator('#full .home').click()
11+
await expect(page).toHaveURL(BASE)
12+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
13+
})
14+
15+
test('clean', async ({ page }) => {
16+
await page.locator('#clean .home').click()
17+
await expect(page).toHaveURL(BASE)
18+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
19+
})
1220
})
1321

14-
test('should navigate to 404 page correctly', async ({ page }) => {
15-
await page.locator('#not-found').click()
16-
await expect(page).toHaveURL(`${BASE}404.html`)
17-
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
22+
test.describe('should navigate to 404 page correctly', () => {
23+
test('full', async ({ page }) => {
24+
await page.locator('#full .not-found').click()
25+
await expect(page).toHaveURL(`${BASE}404.html`)
26+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
27+
})
28+
29+
test('clean', async ({ page }) => {
30+
await page.locator('#clean .not-found').click()
31+
await expect(page).toHaveURL(`${BASE}404.html`)
32+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
33+
})
1834
})
1935

20-
test('should preserve query', async ({ page }) => {
21-
await page.locator('#home-with-query').click()
22-
await expect(page).toHaveURL(`${BASE}?home=true`)
23-
await expect(page.locator('#home-h2')).toHaveText('Home H2')
36+
test.describe('should preserve query', () => {
37+
test('full', async ({ page }) => {
38+
await page.locator('#full .home-with-query').click()
39+
await expect(page).toHaveURL(`${BASE}?home=true`)
40+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
41+
})
42+
43+
test('clean', async ({ page }) => {
44+
await page.locator('#clean .home-with-query').click()
45+
await expect(page).toHaveURL(`${BASE}?home=true`)
46+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
47+
})
2448
})
2549

26-
test('should preserve query and hash', async ({ page }) => {
27-
await page.locator('#home-with-query-and-hash').click()
28-
await expect(page).toHaveURL(`${BASE}?home=true#home`)
29-
await expect(page.locator('#home-h2')).toHaveText('Home H2')
50+
test.describe('should preserve query and hash', () => {
51+
test('full', async ({ page }) => {
52+
await page.locator('#full .home-with-query-and-hash').click()
53+
await expect(page).toHaveURL(`${BASE}?home=true#home`)
54+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
55+
})
56+
57+
test('clean', async ({ page }) => {
58+
await page.locator('#clean .home-with-query-and-hash').click()
59+
await expect(page).toHaveURL(`${BASE}?home=true#home`)
60+
await expect(page.locator('#home-h2')).toHaveText('Home H2')
61+
})
3062
})
3163

32-
test('should preserve hash', async ({ page }) => {
33-
await page.locator('#not-found-with-hash').click()
34-
await expect(page).toHaveURL(`${BASE}404.html#404`)
35-
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
64+
test.describe('should preserve hash', () => {
65+
test('full', async ({ page }) => {
66+
await page.locator('#full .not-found-with-hash').click()
67+
await expect(page).toHaveURL(`${BASE}404.html#404`)
68+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
69+
})
70+
71+
test('clean', async ({ page }) => {
72+
await page.locator('#clean .not-found-with-hash').click()
73+
await expect(page).toHaveURL(`${BASE}404.html#404`)
74+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
75+
})
3676
})
3777

38-
test('should preserve hash and query', async ({ page }) => {
39-
await page.locator('#not-found-with-hash-and-query').click()
40-
await expect(page).toHaveURL(`${BASE}404.html#404?notFound=true`)
41-
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
78+
test.describe('should preserve hash and query', () => {
79+
test('full', async ({ page }) => {
80+
await page.locator('#full .not-found-with-hash-and-query').click()
81+
await expect(page).toHaveURL(`${BASE}404.html#404?notFound=true`)
82+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
83+
})
84+
85+
test('clean', async ({ page }) => {
86+
await page.locator('#clean .not-found-with-hash-and-query').click()
87+
await expect(page).toHaveURL(`${BASE}404.html#404?notFound=true`)
88+
await expect(page.locator('#notfound-h2')).toHaveText('NotFound H2')
89+
})
4290
})

packages/bundler-vite/src/plugins/vuepressConfigPlugin.ts

+1
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ const resolveDefine = async ({
6565
const define: UserConfig['define'] = {
6666
__VUEPRESS_VERSION__: JSON.stringify(app.version),
6767
__VUEPRESS_BASE__: JSON.stringify(app.options.base),
68+
__VUEPRESS_CLEAN_URL__: JSON.stringify(app.options.route.cleanUrl),
6869
__VUEPRESS_DEV__: JSON.stringify(!isBuild),
6970
__VUEPRESS_SSR__: JSON.stringify(isServer),
7071
// @see http://link.vuejs.org/feature-flags

packages/bundler-webpack/src/config/handlePluginDefine.ts

+1
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ export const handlePluginDefine = async ({
2121
{
2222
__VUEPRESS_VERSION__: JSON.stringify(app.version),
2323
__VUEPRESS_BASE__: JSON.stringify(app.options.base),
24+
__VUEPRESS_CLEAN_URL__: JSON.stringify(app.options.route.cleanUrl),
2425
__VUEPRESS_DEV__: JSON.stringify(!isBuild),
2526
__VUEPRESS_SSR__: JSON.stringify(isServer),
2627
// @see http://link.vuejs.org/feature-flags

packages/cli/src/commands/dev/watchPageFiles.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export const watchPageFiles = (app: App): FSWatcher[] => {
4343
})
4444

4545
// watch page files
46-
const pagesWatcher = chokidar.watch(app.options.pagePatterns, {
46+
const pagesWatcher = chokidar.watch(app.options.route.pagePatterns, {
4747
cwd: app.dir.source(),
4848
ignoreInitial: true,
4949
})

packages/client/src/router/index.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@ export { useRoute, useRouter } from 'vue-router'
33

44
export * from './resolveRoute.js'
55
export * from './resolveRouteFullPath.js'
6-
export * from './resolveRoutePath.js'
6+
export * from './resolveRouteCleanPath.js'

0 commit comments

Comments
 (0)