Javascript 用酶测试一种合成成分

我遵循React文档的建议，通过组合创建了一个专门的组件：

export default class AlertPanel extends React.Component {

    constructor(props) {
        super(props);
    }

    render() {
                textRows = <div>{this.props.text}</div>;
            }

            return (
               <Alert bsStyle={this.props.style} onDismiss={this.props.onDismiss}>
                    {textRows} 
               </Alert>
            );
    }

我认为一个等价的测试将适用于

SpecialAlertPanel

：

it( 'should render SpecialAlertPanel to a div', function() {
    const wrapper = shallow( <SpecialAlertPanel /> );
    expect( wrapper.type() ).to.eql( 'div' );
});

我的测试或代码有故障吗？

来自：

如果它是一个复合组件，这将是组件构造函数

因此，

SpecialAlertPanel

的包装类型是

AlertPanel

如果您希望测试通过，请将

AlertPanel

包装在

div

中：

如果它是一个复合组件，这将是组件构造函数

因此，

SpecialAlertPanel

的包装类型是

AlertPanel

---

如果您希望测试通过，请将

AlertPanel

包装在

div

中，因为您执行浅层渲染，所以SpecialAlertPanel会向下渲染到AlertPanel，但不会“更深”（）

很可能你需要像这样的东西

it( 'should render SpecialAlertPanel to a div', function() {
  const wrapper = shallow( <SpecialAlertPanel /> );
  expect(wrapper.find(AlertPanel).shallow().type()).to.eql('div');
});

it（'should render SpecialAlertPanel to a div'，function（）{
const wrapper=shallow（）；
expect（wrapper.find（AlertPanel.shallow（）.type（））.to.eql（'div'）；
});

由于您执行浅层渲染，因此SpecialAlertPanel会向下渲染到AlertPanel，但不会“更深”（）

很可能你需要像这样的东西

it( 'should render SpecialAlertPanel to a div', function() {
  const wrapper = shallow( <SpecialAlertPanel /> );
  expect(wrapper.find(AlertPanel).shallow().type()).to.eql('div');
});

it（'should render SpecialAlertPanel to a div'，function（）{
const wrapper=shallow（）；
expect（wrapper.find（AlertPanel.shallow（）.type（））.to.eql（'div'）；
});

与@Igor和@RemLampa的正确答案略有不同。关于它的另一个观点是-你应该测试什么

SpecialAlertPanel

根据您所展示的示例，您有一个

AlertPanel

组件，并对其进行了测试

SpecialAlertPanel

的唯一功能是呈现

AlertPanel

为

测试

SpecialAlertPanel

与

AlertPanel

的测试重复

实际上，您需要测试的只是

SpecialAlertPanel

是否正在呈现

AlertPanel

。如果

AlertPanel

通过了测试，并且

SpecialAlertPanel

通过了检查

AlertPanel

的测试，则您已经知道它正在呈现

，而无需显式测试

---

（当然，如果将来添加额外的功能，您需要将测试添加到

SpecialAlertPanel

）

与@Igor和@RemLampa的正确答案略有不同。关于它的另一个观点是-你应该测试什么

SpecialAlertPanel

根据您所展示的示例，您有一个

AlertPanel

组件，并对其进行了测试

SpecialAlertPanel

的唯一功能是呈现

AlertPanel

为

测试

SpecialAlertPanel

与

AlertPanel

的测试重复

实际上，您需要测试的只是

SpecialAlertPanel

是否正在呈现

AlertPanel

。如果

AlertPanel

通过了测试，并且

SpecialAlertPanel

通过了检查

AlertPanel

的测试，则您已经知道它正在呈现

，而无需显式测试

---

（当然，如果将来添加额外的功能，您需要向

SpecialAlertPanel

添加测试）

是的，这是一个简单的示例，我想在向

SpecialAlertPanel

添加功能时在其上构建额外测试。是的，这是一个简单的例子，我想在添加功能时在

SpecialAlertPanel

上构建额外的测试。

expected [Function: AlertPanel] to deeply equal 'div'

it( 'should render SpecialAlertPanel to a div', function() {
  const wrapper = shallow( <SpecialAlertPanel /> );
  expect(wrapper.find(AlertPanel).shallow().type()).to.eql('div');
});