我有一个带有以下created
钩子的组件,我正在尝试为该组件编写一些测试
async created () {
this.result = await this.applyFilter({ keyword: this.keyword })
this.bids = this.result.Bids
this.count = this.result.Count
this.pages = this.result.Pages
console.log('Result: ', this.result)
},
这是测试:
import { createLocalVue, mount } from '@vue/test-utils'
import mutationobserver from 'mutationobserver-shim'
import flushPromises from 'flush-promises'
import Vuex from 'vuex'
import BootstrapVue from 'bootstrap-vue'
import Bids from '@/views/bids/Bids'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { library as faLibrary } from '@fortawesome/fontawesome-svg-core'
import { faSearch, faUndo, faRandom, faTrashAlt } from '@fortawesome/free-solid-svg-icons'
faLibrary.add(faSearch, faUndo, faRandom, faTrashAlt)
const localVue = createLocalVue()
localVue.use(Vuex)
localVue.use(BootstrapVue)
localVue.use(mutationobserver) // This is a necessary polyfill for Bootstrap-Vue
localVue.component('font-awesome-icon', FontAwesomeIcon)
describe('Bids component tests', () => {
let store
let modules
let wrapper
const $route = { path: '/bids' }
const bidsDashBoardData = {
'dxp_dashboardref': 4,
'dxp_position': 1,
'db_name': 'Bids',
'dxp_ref': 991,
'dxp_hidden': 0
}
const user = {
'psref': 30288,
'psname': 'asfsafsafsa',
'md_clock': 1318,
'md_picture': './images/400/IMG_5862',
'auids': 'asfsafsa',
'isAuthenticated': true,
'expires': '[native Date Mon Nov 25 2019 17:02:24 GMT+0000 (Greenwich Mean Time)]'
}
let bids = [
{ 'wf_ref': 584, 'ref': 6140, 'title': 'Bid No. 6140', 'value': 'Windermere Steamboat Museum #2', 'order': 1, 'status': 'Lost / Cancelled', 'type': 'bids', 'to': 'app.bids' },
{ 'wf_ref': 1942, 'ref': 7634, 'title': 'Bid No. 7634', 'value': 'The Dragon School Music Building', 'order': 2, 'status': 'Lost', 'type': 'bids', 'to': 'app.bids' },
{ 'wf_ref': 585, 'ref': 7635, 'title': 'Bid No. 7635', 'value': 'Lambeth Palace Library and Archive', 'order': 3, 'status': 'Won', 'type': 'bids', 'to': 'app.bids' }
]
beforeEach(() => {
modules = {
app: {
namespaced: true,
getters: {
getBidsDashBoardData: () => bidsDashBoardData,
getBids: () => bids
},
actions: {
loadAllFavourites: jest.fn()
}
},
auth: {
namespaced: true,
getters: {
getUser: () => user
}
},
bids: {
namespaced: true,
state: {
keyword: '',
page: 1
},
actions: {
applyFilter: jest.fn(),
updateBidsPage: jest.fn()
}
}
}
store = new Vuex.Store({
modules
})
wrapper = mount(Bids, {
localVue,
store,
mocks: {
$route
}
})
})
afterEach(() => {
wrapper.destroy()
})
it('is a Vue instance', async () => {
let result = {
'Count': 5852,
'Pages': 59,
'Page': 1,
'Bids': [
{ 'nj_ref': 5943, 'nj_numb': 9350, 'nj_name': 'Tustin Estate Old Kent Road', 'nj_date': '2019-10-10T23:00:00.000Z', 'btype': 'Masterplanning' },
{ 'nj_ref': 5942, 'nj_numb': 9349, 'nj_name': 'Beyond90-AIX', 'nj_date': '2019-09-26T23:00:00.000Z', 'btype': 'Other Projects' },
{ 'nj_ref': 5941, 'nj_numb': 9348, 'nj_name': 'BE Education', 'nj_date': '2019-09-19T23:00:00.000Z', 'btype': 'Secondary Schools' },
{ 'nj_ref': 5940, 'nj_numb': 9347, 'nj_name': 'Trinity College - Reduction in Fossil Fuel Peer Review', 'nj_date': '2019-09-19T23:00:00.000Z', 'btype': 'Universities' },
{ 'nj_ref': 5939, 'nj_numb': 9346, 'nj_name': 'Patchetts - Stroke Rehabilitation Centre', 'nj_date': '2019-09-19T23:00:00.000Z', 'btype': 'Health' }
]
}
let applyFilter = jest.fn()
wrapper.setMethods({ applyFilter: applyFilter })
wrapper.setData({ result: result })
expect(wrapper.isVueInstance).toBeTruthy()
})
it('should render Bids component when loaded', () => {
expect(wrapper.is(Bids)).toBe(true)
})
})
运行测试时,会引发以下错误
[Vue警告]:创建的挂钩中出现错误(承诺/异步):“ TypeError:无法读取未定义的属性“出价””
从本质上说,applyFilter
中的created
没有返回。我尝试同时提供模拟功能和/或模拟数据,但测试不断返回该错误。
任何想法为什么会这样?