Vue.js测试toBe()方法仅在预期的“字符串”等时返回对象

时间:2018-08-13 00:58:55

标签: testing vue.js

我正在学习测试Vue.js应用。我想测试我的根组件的数据。这是我的代码

从'@ vue / test-utils'导入{mount} 从“ ../../src/App”导入应用

describe('App', ()=>{
test('App is the component of Vue', ()=>{
    const wrapper = mount(App)
    expect(wrapper.isVueInstance()).toBeTruthy()
})

test("App's fetched data is an object",()=>{
    expect(typeof App.data().fetchedData).toBe('object')
})
test("App's weather city is a string",()=>{
    expect(typeof App.data().weatherData.city).toBe('string')
})

}) 

这是我的App.vue代码:

data() {
return {
  city: "New York",
  fetchedData: null,
  weatherData: {
    city: null,
    temperature: null,
    humidity: null,
    pressure: null,
    speed: null,
    weather: null,
    icon: null
  },
  forecastData: null
};   
 },
  methods:{
 setData() {
  this.weatherData.city = this.fetchedData.data.city.name;
  this.weatherData.temperature = this.fetchedData.data.list[0].temp.day;
  this.weatherData.humidity = this.fetchedData.data.list[0].humidity;
  this.weatherData.pressure = this.fetchedData.data.list[0].pressure;
  this.weatherData.speed = this.fetchedData.data.list[0].speed;
  this.weatherData.icon = this.fetchedData.data.list[0].weather[0].icon;
  this.weatherData.weather = this.fetchedData.data.list[0].weather[0].main;
  this.forecastData = this.fetchedData.data.list.slice(1, 5);
}
}

测试toBe()方法为每个元素返回对象

1 个答案:

答案 0 :(得分:0)

正确的方法是这样:

expect(typeof wrapper.vm.fetchedData).toBe('object')

您可以使用vm(ViewModel的缩写)来访问道具,数据或计算的道具。