Iframe set height to content

by JakobJingleheimer

HTML

<iframe id="shiny-place" src="http://dev-www.bejeweled.com/yourshinyplace" />

<iframe name="foo" />

CSS

iframe {
  width: 100%;
}

Babel + JSX

function setIframeHeight(event) {
  if (
    event.origin === 'http://yourshinyplace-dev.us-west-2.elasticbeanstalk.com/'
    && event.data.height
  ) {
    event.source.frameElement.height = event.data.height;
  }
}

document.getElementById('shiny-place')
  .contentWindow
  .addEventListener('message', setIframeHeight);