首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >vue-test-utils安装程序获取TypeError:无法在字符串上创建属性“_Ctor”

vue-test-utils安装程序获取TypeError:无法在字符串上创建属性“_Ctor”
EN

Stack Overflow用户
提问于 2018-03-20 16:58:15
回答 1查看 5.3K关注 0票数 5

我一直在跟踪本指南本指南,用vue-test-utils和vue 2在Rails 5.1上用webpacker安装jest测试。我能够在没有vue组件的情况下运行基本测试,但是尝试挂载vue组件会导致错误:

代码语言:javascript
复制
   TypeError: Cannot create property '_Ctor' on string 'PostAddress'

       7 |
       8 |   it('mounts', () => {
    >  9 |     let wrapper = shallow('PostAddress');
      10 |
      11 |     expect(1 + 1).toBe(2);
      12 |   });

      at Function.Vue.extend (node_modules/vue/dist/vue.runtime.common.js:4785:67)
      at createConstructor (node_modules/@vue/test-utils/dist/vue-test-utils.js:4562:25)
      at mount (node_modules/@vue/test-utils/dist/vue-test-utils.js:4654:12)
      at shallow (node_modules/@vue/test-utils/dist/vue-test-utils.js:4691:10)
      at Object.<anonymous> (spec/javascript/PostAddress.spec.js:9:19)

我的测试文件PostAddress.test.js看起来像:

代码语言:javascript
复制
import { mount } from '@vue/test-utils'  // mounts with children
import { shallow } from '@vue/test-utils' // mounts without children

import PostAddress from 'packs/components/PostAddress.vue';


describe('PostAddress', () => {
  it('mounts', () => {
    let wrapper = shallow('PostAddress');

    expect(1 + 1).toBe(2);
  });
});

package.json的相关部分

代码语言:javascript
复制
  "devDependencies": {
    "@vue/test-utils": "^1.0.0-beta.12",
    "babel-jest": "^23.0.0-alpha.0",
    "babel-preset-es2015": "^6.24.1",
    "jest": "^22.4.2",
    "vue-jest": "^2.2.1",
    "webpack-dev-server": "2.11.2"
  },
  "jest": {
    "roots": [
      "spec/javascript"
    ],
    "moduleDirectories": [
      "node_modules",
      "app/javascript"
    ],
    "transform": {
      "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
      ".*\\.(vue)$": "<rootDir>/node_modules/vue-jest"
    },
  }

该组件本身在浏览器中工作得很好(而且非常简单)。Jest在添加expect(1 + 1).toBe(2);语句并试图挂载/淡化组件之前,正在处理一个简单的let断言。

还有什么我需要的吗?第一次使用很多这些工具,所以谢谢你的指点!

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-03-20 17:00:09

浅层使用组件对象作为第一个参数,而不是字符串名称。

因此,改变:

代码语言:javascript
复制
let wrapper = shallow('PostAddress');

转入:

代码语言:javascript
复制
let wrapper = shallow(PostAddress);

来自官方文档的参考:https://vue-test-utils.vuejs.org/en/api/shallow.html

shallow(component {, options}]) 参数:

  • {Component}组件
  • {Object}选项
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/49390076

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档