Reactjs 仅当条件为真时才显示按钮的测试

我有一个渲染功能，如下所示：

private render(): JSX.Element {
  return ( 
    <div>
      {this.props.x && this.state.y &&
        <DefaultButton onClick = { this.onDeleteButtonClick } >
          Delete
        </DefaultButton>
      }
    </div>
  );
}

只有当这两个条件

this.ispage enabled

和&

this.issubmiter

为真时，才显示

submitpFormContainer

---

我如何为相同的问题编写测试？请让我知道。谢谢

我假设您一般都知道如何编写测试。这里棘手的部分是编写易于测试的类。在第一种情况下，它可能很简单：

it('shows DefaultButton', () => {
    const shallowRenderer = new ShallowRenderer();
    shallowRenderer.render(<Component
        x={true}
    />);
    const result = shallowRenderer.getRenderOutput();
    expect(result).toMatchSnapshot();
});

it（'显示默认按钮'，（）=>{
const shallewrender=新的shallewrender（）；
shallewrender.render（）；
const result=shallwrender.getRenderOutput（）；
expect（result）.toMatchSnapshot（）；
});

创建两个测试，一次通过

x=true

，另一次通过

x=false

，因此您可以测试这两种情况。您只需以某种方式将

y

-状态设置为true

在你的第二个例子中，标题容器看起来更复杂。如何修改

isPageEnabled

和

isSubmitter

的值？如果无法从外部进行测试，则无法正确测试。如果可能，使用道具

it('shows DefaultButton', () => {
    const shallowRenderer = new ShallowRenderer();
    shallowRenderer.render(<Component
        x={true}
    />);
    const result = shallowRenderer.getRenderOutput();
    expect(result).toMatchSnapshot();
});