javascript - jest.fn() 被多次调用

标签 javascript unit-testing react-native jestjs enzyme

我正在用 Jest 和 enzyme 测试我的 react native 应用程序组件。为了监视作为 props 传递的函数,我使用 jest.fn() 。当我运行测试时,我收到错误消息 Expected mock function to have been called one time, but it was called two times 。测试时出现此错误onPress方法。

我尝试删除在我的组件中调用 prop 方法的匿名函数;直接引用onPress方法<TouchableOpacity/>在组件内部,而不从组件的 prop 中调用它;在测试用例之前重新渲染测试组件。但没有成功。

/*BackButton.js*/

import React from 'react';
import { TouchableOpacity } from 'react-native';
import { Icon } from 'expo';
import { iconStyle, Colors } from '../constants';

const styles = {
    icon: {
        marginLeft: 5,
        color: Colors.white,
        fontSize: 40
    }
};

function BackButton(props) {
    return (
        <TouchableOpacity
         onPress={()=>props.navigate()}
         style={{width: 50}}
        >
            <Icon.Ionicons
             name={`${iconStyle}-refresh`}
             style={styles.icon}
            />
        </TouchableOpacity>
    );
 }

 export default BackButton;

=======================================
/*BackButton-test.js*/

import 'react-native';
import React from 'react';
import {mount} from 'enzyme';
import BackButton from '../BackButton';

describe('navigate action', () => {
    const spy = jest.fn();
    const wrapper = mount(<BackButton navigate={spy}/>);

    it('renders correctly', () => {
        expect(wrapper).toMatchSnapshot();
    });

    beforeEach(() => {
       wrapper.prop('navigate')();
    });

    it('calls once', () => {
       expect(spy).toHaveBeenCalledTimes(1);
    });
 });

而且,当我直接调用spy()时里面beforeEach ,它也被调用了 2 次。

最佳答案

beforeEach()函数中取出wrapper.prop('navigate')

您的 beforeEach() 正在运行 it() 的次数

关于javascript - jest.fn() 被多次调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54401958/

相关文章:

javascript - 如何模拟第三方 React Native NativeModules?

firebase - 我可以使用 firebase 和 react-native 验证电话号码吗?

javascript - 使用 foreach 内部的键值对进行 knockout 绑定(bind)

javascript - 单元测试,如何检查 $uibModal 的模板是否存在

angular - 如何在单元测试中将事件对象传递给triggerEventHandler?

react-native - 如何使用 React-Native 和 i18n-js 获取当前语言环境?

react-native - 将替代调色板设置为 native 库中的默认主题

javascript - jQuery游戏-让直升机飞行更流畅

javascript - 如何在 JavaScript 中编写一个表达式来调用数组中的函数?

javascript - jquery 在 <div> 中选择多个 <p>