我刚刚开始使用Vuejs,我遇到了一个真正的问题,试图进行一些测试。以下是我的代码的外观:
//myapp.specs.ts
import Vue from "vue";
import { mount } from 'avoriaz';
import Component from "./component.vue"
describe("My App", () => {
it("works", () => {
const wrapper = mount(Component);
expect(wrapper.html()).toContain("Hello, World");
});
});
//myapp.vue
<script lang="ts" src="./component.ts"></script>
<template src="./template.html"></template>
<style src="./styles/styles.css"></style>
//component.ts
import { Foo } from "./foo"
export default {
data() {
return {
isLoading: true,
data: new Foo()
}
},
created() {
this.populate();
},
methods: {
populate() {
new FooRepository().get().then((fooData: Foo) => {
this.isLoading = false;
this.data = fooData;
});
}
}
}
//template.html
<div v-if="!isLoading" >
<h2>Heading</h2>
<textarea name="myText" v-model="data.Text"></textarea>
</div>
我得到的错误是:TypeError: Cannot convert undefined or null to object
我认为mount
正在发生这种情况。我以前在没有avoriaz
的情况下尝试了这个并记录了导入的Component
,这似乎是未定义的。所以我认为问题可能在import Component from "./component.vue"
没有按预期工作。
这是我的Karma.conf.js:
module.exports = function(config) {
config.set({
basePath: './',
frameworks: ['jasmine', "karma-typescript"],
files: [
{ pattern: './**/*.ts' },
{ pattern: './**/*.js' }
],
exclude: [
'./**/*component.ts',
'./**/*build.js', //component files server as an entry point only.
'./**/*config.js'
],
preprocessors: {
'./**/*.ts': ['karma-typescript']
},
karmaTypescriptConfig: {
tsconfig: './tsconfig.json'
},
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
concurrency: Infinity
});
};