Search code examples
reactjsjsfiddle

What is the purpose of jsfiddle-integration-babel.js?

What is the purpose of

<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js">
</script>

in the fiddle found on Facebook's React tutorial?

The content of jsfiddle-integration-babel.js is

(function() {
  var tag = document.querySelector(
    'script[type="application/javascript;version=1.7"]'
  );
  if (!tag || tag.textContent.indexOf('window.onload=function(){') !== -1) {
    alert('Bad JSFiddle configuration, please fork the original React JSFiddle');
  }
  tag.setAttribute('type', 'text/babel');
  tag.textContent = tag.textContent.replace(/^\/\/<!\[CDATA\[/, '');
})();

Looks like tag tracks a script and removes certain comments from it. But why?

Solution

  • Quoting azium from the comments

    Presumably this is to make the jsfiddle environment babel friendly, which may imply overriding existing jsfiddle code