From: Eduardo San Martin Morote Date: Thu, 7 May 2020 09:31:18 +0000 (+0200) Subject: test(e2e): add multi app X-Git-Tag: v4.0.0-alpha.11~26 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=b1c679eb2dae6264f190d7da0eb115184bf353e5;p=thirdparty%2Fvuejs%2Frouter.git test(e2e): add multi app --- diff --git a/e2e/multi-app/index.html b/e2e/multi-app/index.html new file mode 100644 index 00000000..4bbdf5d4 --- /dev/null +++ b/e2e/multi-app/index.html @@ -0,0 +1,33 @@ + + + + + + + Vue Router e2e tests - Multi app + + + + + << Back to Homepage +
+ + + + + +
+ + + + + +
+ + popstate count: + +
+
+
+ + diff --git a/e2e/multi-app/index.ts b/e2e/multi-app/index.ts new file mode 100644 index 00000000..a14926c8 --- /dev/null +++ b/e2e/multi-app/index.ts @@ -0,0 +1,76 @@ +import { createRouter, createWebHistory } from '../../src' +import { RouteComponent } from '../../src/types' +import { createApp, ref, watchEffect } from 'vue' + +const Home: RouteComponent = { + template: `
Home
`, +} + +const User: RouteComponent = { + template: `
User: {{ $route.params.id }}
`, +} + +// path popstate listeners to track the call count +let activePopStateListeners = ref(0) +const countDiv = document.getElementById('count')! + +watchEffect(() => { + countDiv.innerHTML = '' + activePopStateListeners.value +}) + +const originalAddEventListener = window.addEventListener +const originalRemoveEventListener = window.removeEventListener +window.addEventListener = function (name: string, handler: any) { + if (name === 'popstate') { + activePopStateListeners.value++ + } + return originalAddEventListener.call(this, name, handler) +} +window.removeEventListener = function (name: string, handler: any) { + if (name === 'popstate') { + activePopStateListeners.value-- + } + return originalRemoveEventListener.call(this, name, handler) +} +const router = createRouter({ + history: createWebHistory('/' + __dirname), + routes: [ + { path: '/', component: Home }, + { path: '/users/:id', component: User }, + ], +}) + +let looper = [1, 2, 3] + +let apps = looper.map(i => + createApp({ + template: ` +
+ + + +
+ `, + }) +) + +looper.forEach((n, i) => { + let mountBtn = document.getElementById('mount' + n)! + let unmountBtn = document.getElementById('unmount' + n)! + + let app = apps[i] + + app.use(router) + + mountBtn.addEventListener('click', () => { + app.mount('#app-' + n) + }) + + unmountBtn.addEventListener('click', () => { + app.unmount('#app-' + n) + }) +})