在 React 中用 Jest 测试函数的返回值答案

【问题标题】：Test return value of function with Jest in React在 React 中用 Jest 测试函数的返回值
【发布时间】：2018-03-24 12:19:31
【问题描述】：

如何在这个 React 代码中测试“doSomethingFancy”函数的返回值？我试图找到一个超级简单的例子，但找不到任何东西。所以我想写一个测试来检查数字 2 是否返回。我知道它并没有真正返回任何东西，因为我将其作为示例编写，因此我可以学习如何为我的 React 应用程序编写测试。

import React from 'react';

class FancyStuff extends React.Component {
    render() {
        return <div>
            <h1>
                Hello, {this.props.name}
            </h1>

            <button onClick={this.doSomethingFancy}>
                Add 1 + 1!
            </button>
        </div>;
    }

    doSomethingFancy(e) {
        e.preventDefault();
        let value = 1 + 1;
        return value;
    }
};

export default FancyStuff;

【问题讨论】：

标签： javascript reactjs testing jestjs

【解决方案1】：

如果您需要在测试中访问一个类方法，它将在您的包装器的实例方法返回时作为属性提供。

const wrapper = shallow(<MyComponent />);
expect(wrapper.instance().doSomethingFancy()).toEqual(true);

【讨论】：