Версии

Тестовые утилиты

1.0.3

Vue

2.6.11

Маршрутизатор Vue

3.20

Vue compsotion API

1.0.0-бета.8

У меня возникли некоторые трудности с разработкой компонентного теста из-за root.$route .

В компоненте у меня есть часы, которые будут знать, когда маршрут изменится, чтобы изменить некоторые переменные компонента.

Мой компонент

 <script>
export default {
    setup ( _, { root }) {
       // behavior
       ...
        watch( () => root.$route,
            ({ query, meta }) => {
               foo = 'bar';
            }, {
                immediate: true
            });
    }
};
</script>
 

Мой тест

 import { shallowMount, createLocalVue } from '@vue/test-utils';
import VueCompositionAPI from '@vue/composition-api';
import Component from '@/components/bundles/layout/Component';
import router from '@/router/';

const localVue = createLocalVue();
localVue.use( VueCompositionAPI );
localVue.use( router );

describe( 'Component', () => {
    it( 'Insert', () => {
        const wrapper = shallowMount( Component, {
            mocks: {
                $t: () => ({})
            },
            localVue,
            router
        });

        console.log( wrapper.html() );
    });
});
 

Ошибка

Ошибка типа: невозможно уничтожить свойство ‘query’ ‘undefined’, поскольку оно не определено.

Я пытался издеваться над маршрутизатором, но безрезультатно.

Я пробовал следующими способами:

1:

 ...

describe( 'Component', () => {
    it( 'Insert', () => {
        const wrapper = shallowMount( Component, {
            mocks: {
                $t: () => ({}),
                $route: { query: '', meta: '' }
            },
            localVue,
            router
        });

        console.log( wrapper.html() );
    });
});

 

2:

 import router from '@/router/';

jest.mock( '@/router/', () => ({
    currentRoute: {
        meta: {},
        query: {}
    },
    push: jest.fn( () => Promise.resolve() )
}) );
 

Какая-нибудь помощь?