【问题标题】：How come this test fails?这个测试怎么会失败？
【发布时间】：2017-06-26 15:37:13
【问题描述】：

我是使用 jest 和酶进行单元测试的新手。

我想测试组件是否有一个类名'comment-box'。

在我进行单元测试的组件中，我确实有一个类名为“comment-box”的 div。

但是，当我运行测试时，它失败了。

我可能会犯一个简单的错误，因为我是 jest 和酵素的新手。

谁能帮我找出问题所在？谢谢！

登录我的测试运行器。

 FAIL  src/__tests__/components/CommentBox.test.js
  ● CommentBox › has the right class

    expect(received).toBe(expected)

    Expected value to be (using ===):
      true
    Received:
      false

评论框.js

import React, { Component } from 'react';

class CommentBox extends Component {

    constructor(props) {
        super(props);
    }

    render() {
        return (
            <div class="comment-box">
                <textarea></textarea>
                <button>Submit</button>
            </div>
        )
    }
}

export default CommentBox;

评论框.test.js

import React, { Component } from 'react';
import { shallow, mount, render } from 'enzyme';

import CommentBox from '../../components/CommentBox';
jest.unmock('../../components/CommentBox');


describe('CommentBox', () => {

    it('has the correct class', () => {

        const component = shallow(<CommentBox />);

        expect(component.find('div').hasClass('comment-box')).toBe(true);

        // I tried this one as well.
        // expect(component.find('div').first().hasClass('comment-box')).toBe(true);


    });

});

【问题讨论】：

标签： unit-testing reactjs enzyme jestjs

【解决方案1】：

应该是

<div className="comment-box">

【讨论】：

没问题。 class 和 for 是常见的 jsx 陷阱。