alexlanz/about.test.js

## about.test.js
import Vue from 'vue/dist/vue.js';
import Router from 'vue-router'

import Layout from '../../../src/layout.vue';
import About from '../../../src/pages/general/about.vue';
import Legal from '../../../src/pages/general/legal.vue';

describe('about', () => {

    beforeEach(() => {
        window.location = '/about';

        document.body.innerHTML = `
            <div id="app"></div>
        `;
    });

    /**
     * Test
     */
    it('should render correct contents', async () => {
        Vue.use(Router);

        const router = new Router({
            mode: 'history',
            scrollBehavior: () => ({ y: 0 }),
            routes: [
                { path: '/about', component: About },
                { path: '/legal', component: Legal },

                { path: '*', redirect: '/legal' }
            ]
        });

        const vm = new Vue({
            el: '#app',
            router: router,
            ...Layout
        });

        await Vue.nextTick(() => {});

        console.log(document.body.innerHTML);
    });
});

## about.vue
<script>

</script>

<template>
    <div>
        <router-link to="/">Index</router-link>

        <p>About</p>
    </div>
</template>

## layout.vue
<script>

</script>

<template>
    <div>
        <transition name="router" mode="out-in">
            <router-view></router-view>
        </transition>
    </div>
</template>

## legal.vue
<script>

</script>

<template>
    <div>
        <router-link to="/">Index</router-link>

        <p>Legal</p>
    </div>
</template>
	import Vue from 'vue/dist/vue.js';
	import Router from 'vue-router'

	import Layout from '../../../src/layout.vue';
	import About from '../../../src/pages/general/about.vue';
	import Legal from '../../../src/pages/general/legal.vue';

	describe('about', () => {

	beforeEach(() => {
	window.location = '/about';

	document.body.innerHTML = `
	<div id="app"></div>
	`;
	});

	/**
	* Test
	*/
	it('should render correct contents', async () => {
	Vue.use(Router);

	const router = new Router({
	mode: 'history',
	scrollBehavior: () => ({ y: 0 }),
	routes: [
	{ path: '/about', component: About },
	{ path: '/legal', component: Legal },

	{ path: '*', redirect: '/legal' }
	]
	});

	const vm = new Vue({
	el: '#app',
	router: router,
	...Layout
	});

	await Vue.nextTick(() => {});

	console.log(document.body.innerHTML);
	});
	});
	<script>

	</script>

	<template>
	<div>
	<router-link to="/">Index</router-link>

	<p>About</p>
	</div>
	</template>