Storybook: OM ReactDOM.createPortal पद्धति का उपयोग करते समय लक्ष्य कंटेनर एक DOM तत्व नहीं है

बग का वर्णन करें
मैं अपने मॉडल घटक की एक कहानी जोड़ना चाहूंगा जो कि ReactDOM.createPortal द्वारा बनाई गई है।
modal container मेरे द्वारा index.html में <div id="modal-root"></div> जोड़ा गया है।
लेकिन जब मैं इस तरह कहानी लिखता हूं:

storiesOf('atoms/modal', module)
  .addDecorator(withKnobs)
  .add('Modal', () => (
    <Modal
      isOpen={true}
      onRequestClose={action('onRequestClose')}
    >
      <div>modal</div>
    </Modal>
  ))

Happened लक्ष्य कंटेनर एक DOM तत्व नहीं है 「त्रुटि हुई।

मुझे लगता है कि यह इसलिए है क्योंकि स्टोरीबुक यूआई में कोई मोडल-रूट डिव नहीं है?
मेरे द्वारा यह कैसे किया जा सकता है?

प्रजनन करना
ऊपर देखो

स्क्रीनशॉट

कोड के टुकड़े
यह संक्षिप्त के लिए मेरा मोडल कोड है:

const modalRoot = document.getElementById('modal-root')

class Modal extends React.Component {
  constructor(props) {
    super(props)
    this.el = document.createElement('div')
  }

  componentDidMount() {
    modalRoot.appendChild(this.el)
  }

  componentWillUnmount() {
    modalRoot.removeChild(this.el)
  }

  handleClickBackDrop = event => {
   this.props.onRequestClose(event)
  }

  render() {
    const { isOpen, children } = this.props

    if (!isOpen) {
      return null
    }

    const modalUI = (
      <BackDropWrapper
        onClick={this.handleClickBackDrop}
      >
        <ModalWrapper>
          {children}
        </ModalWrapper>
      </BackDropWrapper>
    )

    return ReactDOM.createPortal(modalUI, modalRoot)
  }
}

सिस्टम:

• फ्रेमवर्क: प्रतिक्रिया
• Addons: addon-knobs
• संस्करण: 4.0.0-अल्फा.3