如何在组件中测试React模板块

时间:2016-12-15 14:57:47

标签: reactjs karma-runner karma-jasmine

我正在尝试测试一个小的React组件 - 模板块语句。 但我能做到吗?因为我甚至无法从 renderResult()方法记录该块语句。

有可能吗?只有我看到的一种方式。它只是通过Enzume Shallow测试最终结果。但我只是想知道 - 这可能吗?

感谢您的任何信息。

import React, { PropTypes } from "react";

export function zeta() {
    return "zeta";
}

export default class AppComponent extends React.Component {

    some() {
        return "some";
    }

    renderResult() {
        let res;

        if (process.env.NODE_ENV === "production") {
            res =  ( <main><h1>App Component PROD</h1>{ this.props.children }</main> );
        } else {
            res = ( <main><h1>App Component DEV 11</h1>{ this.props.children }</main> );
        }

        return res;
    }

    render() {
        return this.renderResult();
    }

}

AppComponent.propTypes = {
    children : PropTypes.object
};

我的测试

import jasmineEnzyme from "jasmine-enzyme";

import React from "react";
import {mount} from "enzyme";

import AppComponent, {zeta} from "../App.component";

describe("<AppComponent /> test", () => {
    let wrapper;

    beforeEach(() => {
        jasmineEnzyme();

        wrapper = mount(<AppComponent />);
    });

    it("App Component should contain h1", () => {
        expect(wrapper.find("h1")).toBePresent();
    });

    it("h1 Should contain a dev text in case of dev mode", () => {
        const compInst = wrapper.instance();
        const res = compInst.some();

        console.log(compInst.renderResult());

        console.log(res);
        expect(res).toMatch("some");
    });
});


});

0 个答案:

没有答案