问题描述
我正在测试一个组件中是否存在3个子组件。测试通过,但显示此警告:
(node:52604) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'getters' of undefined
(node:52604) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block,or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection,use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 2)
(node:52604) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future,promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
这是测试的代码:
const localVue = createLocalVue();
localVue.use(TPlugin(url)); //EDIT: ADD PLUGIN
localVue.use(Vuex);
it('WIP Fixing. Check the 3 Sub-Components of Chatwindow',() => {
const onClose = jest.fn();
const onMinimize = jest.fn();
const store = new Vuex.Store({
state: {
title: "My Web Chat",titleIconUrl: "",visibility: "minimized",showCloseButton: false
},getters: {
title: (state) => state.title,lastName: (state) => state.lastName,state: (state) => state.visibility
}
})
const wrapper = shallowMount(Chatwindow,{
propsData: {
onClose,onMinimize
},store,localVue
})
expect(wrapper.findComponent(Header).exists()).toBe(true)
expect(wrapper.findComponent(MessageList).exists()).toBe(true)
expect(wrapper.findComponent(UserInput).exists()).toBe(true)
});
我在Vuex上安装组件的方式肯定有一些错误吗?
更新,这是我的index.js的摘录:
export const store = new Vuex.Store({
state: {
title: "My funky title",url: DEFAULT_URL,//more variables....
},mutations: {
title(state,newTitle) {
state.title = newTitle
},url(state,newUrl) {
state.url = newUrl
},visibility(state,visibility) {
state.visibility = visibility
},//more variables...
}
getters: {
title: state => state.title,url: state => state.url,visibility: visibility => state.visibility,//more variables.....
state: state => {
return { 'visibility': state.visibility }
},}
})
window['TWChat'] = {
initialize(element,twcProps) {
Vue.prototype.$store = store;
if (twcProps.title) {
store.commit('title',twcProps.title);
}
///more similar if/commit blocks...
// check required properties
if (!store.getters.url) {
// Todo: thow error if url is missing?
return
}
Vue.use(TPlugin(store.getters.title));
Vue.prototype.$extensionMethods = functionMap;
//TChat is the parent of Chatwindow,the componentent of the Test
above.
new Vue({
render: (h) => h(TChat,{ props: { } }),}).$mount(element);
}
}
index.ejs代码:
<div id="t-chat"></div>
<script src="t-chat.js"></script> -->
<script>
window.onload = function () {
var element = document.getElementById('t-chat');
const someProps = {
'url': '<%= process.env.ENDPOINT_URL %>','title':'<%= process.env.HEADER_TITLE %>'
}
window.TChat.initialize(element,someProps);
}
</script>
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)