Javascript 如何测试react native in jest的操作表?
我正在使用中的Javascript 如何测试react native in jest的操作表?,javascript,react-native,jestjs,enzyme,uiactionsheet,Javascript,React Native,Jestjs,Enzyme,Uiactionsheet,我正在使用中的ActionSheetProvider用于我的react原生项目 这是我在代码中使用它的方式: import { connectActionSheet } from '@expo/react-native-action-sheet'; export default @connectActionSheet class MyComponent extends React.Component { ... <MyCustomIcon onPress={() => this
ActionSheetProvider
用于我的react原生项目
这是我在代码中使用它的方式:
import { connectActionSheet } from '@expo/react-native-action-sheet';
export default
@connectActionSheet
class MyComponent extends React.Component {
...
<MyCustomIcon onPress={() => this.showMenu(item)}/>
...
showMenu = targetItem => {
this.props.showActionSheetWithOptions(
{
options: ['cancel','rename','hide','delete'],
cancelButtonIndex: 0,
destructiveButtonIndex: 3,
},
index => {
if (index === 3) { //delete item }
}
}
);
};
从'@expo/react native action sheet'导入{connectActionSheet};
导出默认值
@连接操作表
类MyComponent扩展了React.Component{
...
this.showMenu(项目)}/>
...
showMenu=targetItem=>{
此.props.showActionSheetWithOptions(
{
选项:[“取消”、“重命名”、“隐藏”、“删除”],
取消按钮索引:0,
破坏按钮索引:3,
},
索引=>{
如果(索引==3){//删除项}
}
}
);
};
这是我到目前为止所做的,但我不知道如何在测试中触发index==3:
const showActionSheetWithOptions = jest.fn();
const renderComponent = overrides => {
props = {
showActionSheetWithOptions,
...overrides,
};
return shallow(<MyComponent.wrappedComponent {...props} />);
};
it('should check if delete option is selected', () => {
const wrapper = renderComponent();
const instance = wrapper.instance();
const myIcon = wrapper.find({ testID: 'my-icon' });
const spyShowMenu = jest.spyOn(instance, 'showMenu');
myIcon.props.onPress();
expect(spyShowMenu).toHaveBeenCalled(); // this test passes
// Now that the action sheet has been displayed, how to select delete option?
});
});
const show actionsheetwithoptions=jest.fn();
const renderComponent=覆盖=>{
道具={
显示带有选项的操作表,
…凌驾于,
};
返回浅();
};
它('应检查是否选择了删除选项',()=>{
const wrapper=renderComponent();
const instance=wrapper.instance();
const myIcon=wrapper.find({testID:'my icon'});
const spyShowMenu=jest.spyOn(实例'showMenu');
myIcon.props.onPress();
expect(spyShowMenu).tohaveBeenCall();//此测试通过
//现在已显示操作表,如何选择“删除”选项?
});
});