useControllableState.test.tsx

it('should work in controlled mode', () => {
   class ControlledUsage extends React.Component<{}, { counter: number, open: boolean }> {
      constructor(props) {
        super(props);
        this.toggle = this.toggle.bind(this);
      }

      state = {
        counter: 0,
        open: true,
      };

      toggle(value: boolean) {
        if (this.state.counter < 2) {
          this.setState(state => ({
            open: !state.open,
            counter: state.counter + 1,
          }));
        }
      }

      render(): React.ReactNode {
        return <Zippy header={'header'}
                      open={this.state.open} onToggle={this.toggle}/>;
      }
    }

    const { clickHeader, isOpen } = mountUsage(<ControlledUsage/>);
    expect(isOpen()).toEqual(true);
    clickHeader();
    expect(isOpen()).toEqual(false);
    clickHeader();
    expect(isOpen()).toEqual(true);
    clickHeader();
    expect(isOpen()).toEqual(true);
  });