From: Eduardo San Martin Morote Date: Mon, 4 Jan 2021 12:06:47 +0000 (+0100) Subject: fix(hash): allow base tag different from base parameter X-Git-Tag: v4.0.3~9 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=85b1bff96fbb6e21cd556b688f6085b6fbfe993f;p=thirdparty%2Fvuejs%2Frouter.git fix(hash): allow base tag different from base parameter Fix #685 --- diff --git a/__tests__/history/html5.spec.ts b/__tests__/history/html5.spec.ts index c92ce0d6..7df3b381 100644 --- a/__tests__/history/html5.spec.ts +++ b/__tests__/history/html5.spec.ts @@ -95,7 +95,7 @@ describe('History HTMl5', () => { it('calls push with hash part of the url with a base', () => { dom.reconfigure({ url: 'file:///usr/etc/index.html' }) - let history = createWebHistory('/usr/etc/index.html#/') + let history = createWebHistory('#') let spy = jest.spyOn(window.history, 'pushState') history.push('/foo') expect(spy).toHaveBeenCalledWith( diff --git a/docs/api/index.md b/docs/api/index.md index bd00d1cd..ebab310f 100644 --- a/docs/api/index.md +++ b/docs/api/index.md @@ -227,10 +227,9 @@ export declare function createWebHashHistory(base?: string): RouterHistory ### Parameters -| Parameter | Type | Description | -| --------- | -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -| base | `string` | optional base to provide. Defaults to `location.pathname` or `/` if at root. If there is a `` tag in the `head`, its value will be ignored in favor of this parameter **but note it affects all the history.pushState() calls**, meaning that if you use a `` tag, its `href` value **has to match this parameter** (ignoring anything after the | -| `#`) | +| Parameter | Type | Description | +| --------- | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| base | `string` | optional base to provide. Defaults to `location.pathname + location.search`. If there is a `` tag in the `head`, its value will be ignored in favor of this parameter **but note it affects all the history.pushState() calls**, meaning that if you use a `` tag, its `href` value **has to match this parameter** (ignoring anything after the `#`) | ### Examples diff --git a/e2e/hash/index.ts b/e2e/hash/index.ts index ebf448c0..bc154a87 100644 --- a/e2e/hash/index.ts +++ b/e2e/hash/index.ts @@ -20,7 +20,7 @@ const Unicode: RouteComponent = { const router = createRouter({ // keep a trailing slash in this specific case because we are using a hash // history - history: createWebHashHistory('/' + __dirname + '/#/'), + history: createWebHashHistory(), routes: [ { path: '/', component: Home }, { path: '/redirect', name: 'redirect', redirect: '/foo' }, diff --git a/e2e/specs/hash.js b/e2e/specs/hash.js index 33b38f6c..4b82b684 100644 --- a/e2e/specs/hash.js +++ b/e2e/specs/hash.js @@ -62,6 +62,7 @@ module.exports = { .execute(function () { window.history.replaceState(history.state, '', '/hash/#/foo') }) + .assert.urlEquals(baseURL + '/foo') .click('li:nth-child(3) a') .assert.urlEquals(baseURL + '/bar') .back() diff --git a/src/history/hash.ts b/src/history/hash.ts index 9768b077..6e4f5046 100644 --- a/src/history/hash.ts +++ b/src/history/hash.ts @@ -6,8 +6,8 @@ import { warn } from '../warning' * Creates a hash history. Useful for web applications with no host (e.g. * `file://`) or when configuring a server to handle any URL is not possible. * - * @param base - optional base to provide. Defaults to `location.pathname` or - * `/` if at root. If there is a `` tag in the `head`, its value will be + * @param base - optional base to provide. Defaults to `location.pathname + + * location.search` If there is a `` tag in the `head`, its value will be * ignored in favor of this parameter **but note it affects all the * history.pushState() calls**, meaning that if you use a `` tag, it's * `href` value **has to match this parameter** (ignoring anything after the @@ -32,7 +32,7 @@ export function createWebHashHistory(base?: string): RouterHistory { // Make sure this implementation is fine in terms of encoding, specially for IE11 // for `file://`, directly use the pathname and ignore the base // location.pathname contains an initial `/` even at the root: `https://example.com` - base = location.host ? base || location.pathname : '' + base = location.host ? base || location.pathname + location.search : '' // allow the user to provide a `#` in the middle: `/base/#/app` if (base.indexOf('#') < 0) base += '#' diff --git a/src/history/html5.ts b/src/history/html5.ts index 0f91b8da..c17dc08b 100644 --- a/src/history/html5.ts +++ b/src/history/html5.ts @@ -202,11 +202,21 @@ function useHistoryStateNavigation(base: string) { state: StateEntry, replace: boolean ): void { - // when the base has a `#`, only use that for the URL + /** + * if a base tag is provided and we are on a normal domain, we have to + * respect the provided `base` attribute because pushState() will use it and + * potentially erase anything before the `#` like at + * https://github.com/vuejs/vue-router-next/issues/685 where a base of + * `/folder/#` but a base of `/` would erase the `/folder/` section. If + * there is no host, the `` tag makes no sense and if there isn't a + * base tag we can just use everything after the `#`. + */ const hashIndex = base.indexOf('#') const url = hashIndex > -1 - ? base.slice(hashIndex) + to + ? (location.host && document.querySelector('base') + ? base + : base.slice(hashIndex)) + to : createBaseLocation() + base + to try { // BROWSER QUIRK