Как исправить ошибки TypeError и getActivePinia() при тестировании в vitest?

Question

[Esm322]

Подскажите, пожалуйста, при написании любого теста возникают ошибки. Первая TypeError, указывает на то условие при котором открывается модальное окно "activeClientChange.client !== null", что undefined(.client):

// MainView
 <ModalWindowChanges v-if="activeClientChange.client !== null" :clients="useClients"
          :active-client-change="activeClientChange" />

const activeClientChange = reactive<{ client: null | INewClient }>({
  client: null
});

И на Pinia: "getActivePinia()" was called but there was no active Pinia. Are you trying to use a store before calling "app.use(pinia)"?

Почитал документацию по ссылке, на которую ссылается ошибка. Сделал как там и написано, но всё равно возникает эта ошибка. Также установил плагин pinia/testing, из блока тестирование
Как это можно исправить?

Answer 1

[Esm322]

Если кому-то понадобится. Для того, чтобы избавиться от ошибки Pinia, я добавил createSpy: vi.fn. А для ошибки TypeError, я указал начальное состояние с точной структурой объекта, который используется в composables для рендера:

import { describe, it, expect, beforeEach, vi } from 'vitest'

import { shallowMount } from '@vue/test-utils'

import { createTestingPinia } from '@pinia/testing'

import MainView from '@/views/MainView.vue'

describe('MainView.vue', () => {
  let wrapper: any

  const client = {
    id: 1,
    firstName: 'test',
    secondName: 'testov',
    thirdName: 'testovich',
    fullName: 'testov test testovich',
    date: {
      newDate: new Date(),
      nowDate: Date.now()
    },
    edit: {
      newEdit: new Date(),
      nowEdit: Date.now()
    },
    contacts: [
      {
        block: {
          name: 'component'
        },
        selectValue: '',
        inputValue: ''
      }
    ],
    newdCreateDate: 'today',
    newEditDate: 'today'
  }

  beforeEach(() => {
    wrapper = shallowMount(MainView, {
      global: {
        plugins: [
          createTestingPinia({
            createSpy: vi.fn,
            initialState: {
              client: {
                clientsData: [client]
              }
            }
          })
        ]
      }
    })
  })

  it('renders properly', () => {
    expect(wrapper.find('.modal').exists()).toBe(false)
  })
})