Error TS2615 when accessing store.original in a unit test

[a-kriya]

I'll share my header.spec.ts file that tries to mock a getter and encounters ts(2615) on store.original:

import {createLocalVue, mount} from '@vue/test-utils'
import Vuex from 'vuex'
import {createDirectStore} from 'direct-vuex'
import Header from '@/components/Header.vue'

const localVue = createLocalVue()
localVue.use(Vuex)

const {store} = createDirectStore({
  getters: {
    isAuthenticated: () => true,
  },
})

describe('Header.vue', () => {
  it('renders logo', () => {
    const wrapper = mount(Header, {store: store.original, localVue})
  })
})

 FAIL  tests/unit/header.spec.ts
  ● Test suite failed to run

    TypeScript diagnostics (customize using `[jest-config].globals.ts-jest.diagnostics` option):
    tests/unit/header.spec.ts:17:43 - error TS2615: Type of property 'original' circularly references itself in mapped type '{ [K in keyof { readonly state: {}; getters: { readonly isAuthenticated: boolean; }; commit: {}; dispatch: {}; original: VuexStore<{ getters: { isAuthenticated: () => boolean; }; }>; }]: ShowContentDepth1<{ readonly state: {}; getters: { ...; }; commit: {}; dispatch: {}; original: VuexStore<...>; }[K]>; }'.

    17     const wrapper = mount(Header, {store: store.original, localVue})
                                                 ~~~~~~~~~~~~~~

The Header component itself is fairly straightforward: main store is imported and an isAuthenticated computed property is defined that returns the value from the imported store.

Is the above issue related to this package, or caused due to other packages/configuration in my project? Any help is appreciated.

[a-kriya]

Related: https://github.com/microsoft/TypeScript/issues/38279#issuecomment-631328971

[viT-1]

I have same error. "direct-vuex": "0.10.4"

[a-kriya]

@viT-1 I had to downgrade to TS 3.8.3. Upgrading to Vue3 may also solve the issue.

@paleo Unlikely that the issue can be resolved in this package, but I thought filing this ticket may help others.

[paleo]

Hi. I suggest you edit node_modules/direct-vuex/types/direct-types.d.ts. Line 24, change the type of original to any. If it works, I can consider to publish the package with this workaround. I think the type of original is not really important in our case.

export type ToDirectStore<O extends StoreOptions> = ShowContent<{
  readonly state: ShowContent<DirectState<O>>
  getters: ShowContent<DirectGetters<O>>
  commit: ShowContent<DirectMutations<O>>
  dispatch: ShowContent<DirectActions<O>>
  original: any // <-- here, replace 'VuexStore<O>' by 'any'
}>

[a-kriya]

@paleo Thanks for the suggestion. That fixes the error.

[a-kriya]

@paleo Do you think it's something you'll want to include and publish?