Laravel VueJS 测试 TypeError: _vm._ssrEscape 不是函数答案

【问题标题】：Laravel VueJS testing TypeError: _vm._ssrEscape is not a functionLaravel VueJS 测试 TypeError: _vm._ssrEscape 不是函数
【发布时间】：2020-10-24 04:00:35
【问题描述】：

我一直在拼凑一些不同的教程，试图让 Mocha 测试适用于 Laravel 7 Vue 组件。

我可以成功运行基本测试

expect(0).toBe(0);

但当我尝试安装组件时，我会收到以下错误

TypeError: _vm._ssrEscape is not a function
      at Proxy.render (public/main.js:154:13)
      at VueComponent.Vue._render (node_modules/vue/dist/vue.runtime.common.dev.js:3538:22)
      at VueComponent.updateComponent (node_modules/vue/dist/vue.runtime.common.dev.js:4054:21)
      at Watcher.get (node_modules/vue/dist/vue.runtime.common.dev.js:4465:25)
      at new Watcher (node_modules/vue/dist/vue.runtime.common.dev.js:4454:12)
      at mountComponent (node_modules/vue/dist/vue.runtime.common.dev.js:4061:3)
      at VueComponent.Vue.$mount (node_modules/vue/dist/vue.runtime.common.dev.js:8392:10)
      at init (node_modules/vue/dist/vue.runtime.common.dev.js:3112:13)
      at createComponent (node_modules/vue/dist/vue.runtime.common.dev.js:5958:9)
      at createElm (node_modules/vue/dist/vue.runtime.common.dev.js:5905:9)
      at VueComponent.patch [as __patch__] (node_modules/vue/dist/vue.runtime.common.dev.js:6455:7)
      at VueComponent.Vue._update (node_modules/vue/dist/vue.runtime.common.dev.js:3933:19)
      at VueComponent.updateComponent (node_modules/vue/dist/vue.runtime.common.dev.js:4054:10)
      at Watcher.get (node_modules/vue/dist/vue.runtime.common.dev.js:4465:25)
      at new Watcher (node_modules/vue/dist/vue.runtime.common.dev.js:4454:12)
      at mountComponent (node_modules/vue/dist/vue.runtime.common.dev.js:4061:3)

我正在运行节点 12.18.2。

我的测试文件包含

import { mount } from '@vue/test-utils';
import Counter from '../../resources/js/components/Counter';

describe ('Counter', () => {

    it ('defaults to a count of 0', () => {
        const wrapper = mount(Counter);
    });

});

我的组件包含

<template>
    <div>
        <span class="count" v-text="count"></span>
        <button @click="count++"></button>
    </div>
</template>

<script>
    export default {
        name: "Counter",
        data () {
            return {
                count: 0
            };
        }
    }
</script>

测试命令是

mochapack --webpack-config node_modules/laravel-mix/setup/webpack.config.js --require tests/Vue/setup.js tests/Vue/**/*.spec.js

并且 setup.js 文件包含

require('jsdom-global')()
global.expect = require('expect');

感谢您的帮助

【问题讨论】：

标签： node.js laravel vue.js mocha.js

【解决方案1】：

我现在已经搞定了。

使用https://dev.to/tuandm/how-to-test-vue-components-with-laravel-mix-and-mocha-3kgc/的部分内容

我没有安装 mcocha-webpack 然后卸载，而是直接安装 mochapack

npm install --save-dev webpack vue-template-compiler @vue/test-utils mocha mochapack jsdom jsdom-global expect

【讨论】：