jotto/react-15-and-no-script.html

## react-15-and-no-script.html
<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>ReactJS 15.5.0 working example for noscript tags and SSR: 2017-06-28</title>
  </head>
  <body>

    <div id='root'></div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.5.0/react-with-addons.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.5.0/react-dom.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.5.0/react-dom-server.js"></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js'></script>


    <script type='text/babel'>
      // react can't do noscript children with content see the following:
      //   - https://github.com/facebook/react/issues/7607
      //   - https://github.com/facebook/react/issues/1252
      // also, somewhat unrelated but affects this snippet:
      //   - 15.4.{1,2} will throw an "Invariant Violation" WARNING (won't cause problems)
      //     when using ReactDOM and ReactDOMServer
      //     see: https://github.com/facebook/react/issues/8487 (hence using 15.5.0)
      const Noscript = props => {
        const staticMarkup = ReactDOMServer.renderToStaticMarkup(props.children);
        return <noscript dangerouslySetInnerHTML={{ __html: staticMarkup }} />;
      };

      const App = () => {
        return (
          <div>
            <Noscript>
              <iframe
                src="http://example.com"
                height="0"
                width="0"
                style={{ display: "none", visibility: "hidden" }}
              />
            </Noscript>
          </div>
        );
      };

      window.el = <App />;

      window.rendered = ReactDOM.render(window.el, document.getElementById("root"));
    </script>
  </body>
</html>
	<!DOCTYPE HTML>
	<html>
	<head>
	<meta charset="utf-8">
	<title>ReactJS 15.5.0 working example for noscript tags and SSR: 2017-06-28</title>
	</head>
	<body>

	<div id='root'></div>

	<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.5.0/react-with-addons.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.5.0/react-dom.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.5.0/react-dom-server.js"></script>
	<script src='https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js'></script>


	<script type='text/babel'>
	// react can't do noscript children with content see the following:
	// - https://github.com/facebook/react/issues/7607
	// - https://github.com/facebook/react/issues/1252
	// also, somewhat unrelated but affects this snippet:
	// - 15.4.{1,2} will throw an "Invariant Violation" WARNING (won't cause problems)
	// when using ReactDOM and ReactDOMServer
	// see: https://github.com/facebook/react/issues/8487 (hence using 15.5.0)
	const Noscript = props => {
	const staticMarkup = ReactDOMServer.renderToStaticMarkup(props.children);
	return <noscript dangerouslySetInnerHTML={{ __html: staticMarkup }} />;
	};

	const App = () => {
	return (
	<div>
	<Noscript>
	<iframe
	src="http://example.com"
	height="0"
	width="0"
	style={{ display: "none", visibility: "hidden" }}
	/>
	</Noscript>
	</div>
	);
	};

	window.el = <App />;

	window.rendered = ReactDOM.render(window.el, document.getElementById("root"));
	</script>
	</body>
	</html>