Всім привіт, хто знає як тестувати роутер в компоненті ?

Ось мої тести, хочу зробити router.push і щоб відрендерився мій компонент wrapper але не виходить
import { createLocalVue, mount } from '@vue/test-utils';
import VueRouter from 'vue-router';

import { prevRoute } from './router';
import Post from './Post.vue';

const localeVue = createLocalVue();
localeVue.use(VueRouter);

const routes = [
{
path: '/',
component: {
template: 'Welcome to the default route',
},
},
];

const router = new VueRouter({
mode: 'abstract',
routes,
});

describe('prevRoute', () => {
it('Shoud set prevRoute value to data before route enter', async () => {
const wrapper = mount({
template: 'My component',
mixin: [prevRoute],
},
{
localeVue,
router,
});
});
});

Ну так код самого теста покажите, гед и как вы пытаетесь пуш сделать

ось це обновлено, import { createLocalVue, mount } from '@vue/test-utils'; import VueRouter from 'vue-router'; import { prevRoute } from './router'; const localeVue = createLocalVue(); localeVue.use(VueRouter); const Post = { template: 'Post', mixins: [prevRoute], }; const routes = [ { path: '/', component: { template: 'Welcome to the default route', }, }, { path: '/post', component: Post, }, ]; const router = new VueRouter({ mode: 'abstract', routes, }); router.push('/post'); describe('prevRoute', () => { it('Shoud set prevRoute value to data before route enter', async () => { const wrapper = mount(Post, { localeVue, router, }); }); }); і тут я не розумію чи потрібно ще якись темплейт де буде <router-view> чи щось інше щоб відрендерити мою компоненту

Ну а откуда роутер поймет что рендерить и куда. Нужно где-то роутер вьб

я не до кінця розумію як це зробити

Создать компонент в котором есть router-view. Этот компонент и рендерить

а якщо зробити так то по ідеї має відрендеритися дефолтна компонента App ? const App = { template: '<div><router-view /></div>', }; const routes = [ { path: '/', component: App, },

ось останні оновлення і все працює import { createLocalVue, mount } from '@vue/test-utils'; import VueRouter from 'vue-router'; import { prevRoute } from './router'; const localeVue = createLocalVue(); localeVue.use(VueRouter); const App = { template: '<div><router-view /></div>', }; const Post = { template: '<div>Post</div>', mixins: [prevRoute], }; const routes = [ { path: '/', component: App, }, { path: '/post', component: Post, }, ]; const router = new VueRouter({ mode: 'abstract', routes, }); router.push('/post'); describe('prevRoute', () => { it('Shoud set prevRoute value to data before route enter', async () => { mount(Post, { localeVue, router, }); }); }); тільки не розмію чому в моєму міксині не викликається next() export const prevRoute = { data() { return { prevRoute: null, }; }, beforeRouteEnter(to, from, next) { console.log('prevRoute -> beforeRouteEnter', to, from); // перший консоль лог відпрацьовує next((vm) => { console.log('vm', vm); // ось цей ні vm.prevRoute = from; }); }, };

Все ж така конструкція не працює або не вірно зрозумів і використовую ? const localeVue = createLocalVue(); localeVue.use(VueRouter); const App = { name: 'App', template: '<div><router-view /></div>', };