diff --git a/examples/basic-jsx-harmony/index.html b/examples/basic-jsx-harmony/index.html new file mode 100644 index 000000000000..a9976430982a --- /dev/null +++ b/examples/basic-jsx-harmony/index.html @@ -0,0 +1,51 @@ + + + + + Basic Example with JSX with Harmony + + + +

Basic Example with JSX with Harmony

+
+

+ To install React, follow the instructions on + GitHub. +

+

+ If you can see this, React is not working right. + If you checked out the source from GitHub make sure to run grunt. +

+
+

Example Details

+

This is written with JSX with Harmony (ES6) syntax and transformed in the browser.

+

+ Learn more about React at + facebook.github.io/react. +

+ + + + + diff --git a/vendor/browser-transforms.js b/vendor/browser-transforms.js index 689666ac71d1..34b74e1e1a2a 100644 --- a/vendor/browser-transforms.js +++ b/vendor/browser-transforms.js @@ -89,12 +89,12 @@ var createSourceCodeErrorMessage = function(code, e) { return message; }; -var transformCode = function(code, source) { +var transformCode = function(code, source, options) { var jsx = docblock.parseAsObject(docblock.extract(code)).jsx; if (jsx) { try { - var transformed = transformReact(code); + var transformed = transformReact(code, options); } catch(e) { e.message += '\n at '; if (source) { @@ -137,13 +137,13 @@ var transformCode = function(code, source) { } }; -var run = exports.run = function(code, source) { +var run = exports.run = function(code, source, options) { var scriptEl = document.createElement('script'); - scriptEl.text = transformCode(code, source); + scriptEl.text = transformCode(code, source, options); headEl.appendChild(scriptEl); }; -var load = exports.load = function(url, callback) { +var load = exports.load = function(url, callback, options) { var xhr; xhr = window.ActiveXObject ? new window.ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest(); @@ -157,7 +157,7 @@ var load = exports.load = function(url, callback) { xhr.onreadystatechange = function() { if (xhr.readyState === 4) { if (xhr.status === 0 || xhr.status === 200) { - run(xhr.responseText, url); + run(xhr.responseText, url, options); } else { throw new Error("Could not load " + url); } @@ -175,7 +175,7 @@ runScripts = function() { // Array.prototype.slice cannot be used on NodeList on IE8 var jsxScripts = []; for (var i = 0; i < scripts.length; i++) { - if (scripts.item(i).type === 'text/jsx') { + if (scripts.item(i).type.indexOf('text/jsx') !== -1) { jsxScripts.push(scripts.item(i)); } } @@ -187,10 +187,17 @@ runScripts = function() { var script = jsxScripts.shift(); + var options; + if (script.type.indexOf('harmony=true') !== -1) { + options = { + harmony: true + }; + } + if (script.src) { - load(script.src, tick); + load(script.src, tick, options); } else { - run(script.innerHTML, null); + run(script.innerHTML, null, options); tick(); } }