@CrastiC
Frontend разработчик

Как правильно настроить автотестирование в проекте с множеством юзов и сложным стором?

Добрый день. Имеется проект на Vue 3, сборщик vite, vuex управляет состоянием. Стоит задача запустить на проекте автотесты с помощью vitest.
Столкнулся со следеющей проблемой:

При попытке тестирования небольшого компонента, но тянущего данные из стора с помощью юзов, получаю необходимость бесконечного мокинга данных из юзов и самого стора, т.к. два юза в компоненте тянут за собой другие юзы, которые тянут другие и т.д.

import { describe, it, expect, vi } from 'vitest';
import { shallowMount, mount, config, createLocalVue  } from '@vue/test-utils';
import Vuex from 'vuex'
import VersionList from '../Header/VersionList.vue';
import useScript from "../../use/data/script.js"
import useWorkSpace from "../../use/workSpace/index.js"
import { useI18n } from "vue-i18n";
import data from "../../store/data";
import app from "../../store/app";


Как мокать отдельные данные в юзах я разобрался, но вот когда в юзах идет обращение в стор возникают проблемы.

Я попробовал прокинуть стор так:
const localVue = createLocalVue()
localVue.use(Vuex)

const mockStore = new Vuex.Store({
    modules: {
        app,
        data
    },   
})
 const options = {
            mockStore,
            localVue
        }

const wrapper = shallowMount(VersionList, options);


В модулях app и data еще модули, внутри некоторых из них еще модули.

но получаю ошибку
TypeError: Cannot read properties of undefined (reading 'getters')
 ❯ node_modules/vuex/dist/vuex.esm-bundler.js:859:19
    857|     if (!rawModule[key]) { return }
    858| 
    859|     var assertOptions = assertTypes[key];
       |                   ^
    860| 
    861|     forEachValue(rawModule[key], function (value, type) {
 ❯ assertRawModule node_modules/vuex/dist/vuex.esm-bundler.js:858:28
 ❯ ModuleCollection.register node_modules/vuex/dist/vuex.esm-bundler.js:759:5
 ❯ node_modules/vuex/dist/vuex.esm-bundler.js:773:16
 ❯ node_modules/vuex/dist/vuex.esm-bundler.js:73:52
 ❯ forEachValue node_modules/vuex/dist/vuex.esm-bundler.js:73:20
 ❯ ModuleCollection.register node_modules/vuex/dist/vuex.esm-bundler.js:772:5
 ❯ new ModuleCollection node_modules/vuex/dist/vuex.esm-bundler.js:733:8


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

Что я делаю не так, и как делать правильно. Как избавиться от ошибки с геттерами, если конкретного места и файла, где была получена эта ошибка нет?
  • Вопрос задан
  • 279 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
22 нояб. 2024, в 08:04
1 руб./за проект
22 нояб. 2024, в 06:06
1500 руб./в час
22 нояб. 2024, в 06:04
1 руб./за проект