我是Jest + Enzyme的新手,我一直在我的应用程序中做一些测试,一切都很好,直到我尝试在我的一个组件中测试onPress事件,该组件呈现了一个内部具有ListItem的ScrollView。错误是:Cannot read property 'items' of undefined
下面是我的代码:
列表.js
import React from 'react';
import { Text, StyleSheet, Image, View, ScrollView, Alert} from 'react-native';
import { ListItem, Button, Card } from 'react-native-elements'
import {observer, inject} from 'mobx-react';
import {StackNavigator} from 'react-navigation';
@inject('ItemStore')
@observer
export default class List extends React.Component{
constructor(props){
super(props);
this.state = {
itemsSelected: [],
}
}
displayItem(item, index){
const {navigate} = this.props.navigation;
this.props.ItemStore.ItemStore.itemSelected(item);
navigate("OtherComp", {'index': index});
}
render(){
return(
<ScrollView>
{
this.props.ItemStore.items.length ?
this.props.ItemStore.items.map((item, i) => (
<ListItem roundAvatar avatar = {{uri: item.photo_uri}}
title = {item.name}
key = {i}
onPress = {this.displayItem.bind(this, item, i)}
onLongPress = {this.setitem.bind(this, i)}
containerStyle = {{ backgroundColor: this.state.itemsSelected.indexOf(i) >= 0 ? "#f1f1f1" : "#ffffff"}}
/>
)) : undefined
}
</ScrollView>
);
}
}
List.test.js
import 'react-native';
import React from 'react';
import Enzyme from 'enzyme';
import MyList from '../../components/list/List';
import {shallow} from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import sinon from 'sinon';
import { ListItem } from 'react-native-elements'
const ItemStore = require('../../stores/ItemStore').default;
Enzyme.configure({adapter: new Adapter()});
describe('ItemList', () => {
it('click list item', () => {
const wrapper = shallow(<MyList ItemStore={ItemStore.ItemStore} />)
const render = wrapper.dive();
const displayItem = sinon.spy(MyList, "displayItem");
render.find(ListItem).forEach(child => {
child.simulate('onPress');
});
expect(displayItem.calledOnce).toBe(true);
});
});
我正在使用多个商店,这就是为什么调用它store.store
不应该这样:
this.props.ItemStore.items.length
是。。
this.props.ItemStore.ItemStore.items.length ?