尝试测试使用来自vuex的mapState的vue组件

Question

当前尝试测试使用vuex ... mapState方法的vue组件，但是仅通过将其引入组件无法通过我的测试。

这是我当前遇到的错误：

({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import _Object$defineProperty from "../../core-js/object/define-property";

这是我要测试的组件。

SimpleComponent.vue


<template>
  <h1> Hello!!!</h1>
</template>

<script>
import mapState from 'vuex';
export default {
    computed: {
        ...mapState(["users"])
    }
}
</script>

<style>

</style>

这是我的商店，但出于测试目的而简化。

store.js


import Vue from "vue";
import Vuex from "vuex";
const fb = require("./firebaseConfig.js");

Vue.use(Vuex);

fb.auth.onAuthStateChanged(user => {
  if (user) {
      store.commit('setCurrentUser', user)

      // realtime updates from our posts collection
      fb.usersCollection.onSnapshot(querySnapshot => {
          let userArray = []

          querySnapshot.forEach(doc => {
              let user = doc.data()
              user.id = doc.id
              userArray.push(user)
          })

          store.commit('setUsers', userArray)
      })
  }
})

export const store = new Vuex.Store({
  state: {
    users:[], 
  },
  actions: {
    clearData({ commit }) {
      commit('setUsers', null);
    },
  },
  mutations: {
    setUsers(state, val){
      state.users = val
    }, 
  },
});

这是我的测试

SimpleComponentTest.spec.js

import { shallowMount, createLocalVue } from '@vue/test-utils';
import SimpleStore from '../../src/components/SimpleComponent.vue';
import Vuex from 'vuex';

const sinon = require('sinon');
const localVue = createLocalVue();
localVue.use(Vuex);

describe('SimpleComponent.vue', () => {
    it('Is Vue Instance', () => {
        const wp = shallowMount(SimpleComponent, { computed: { users: () => 'someValue' }, localVue });
        expect(wp.isVueInstance()).toBe(true);
    });
});

我将Jest与Sinon一起使用进行测试。我对在测试中设置商店的正确方法有些困惑，但这是我在网上查找时发现的一种方法。

代码库比我向您展示的要大一些，但这是因为在经历数小时的错误之后，我认为我需要最简单的代码来测试使用... mapState方法并将其构建起来从那里。

任何帮助将不胜感激：）

目标：通过一个简单的测试来测试使用vuex中... mapState（[]）的组件