Merge branch 'anchann-scope-variable-references' into gh-pages

.gitignore

@@ -22,3 +22,4 @@ npm-debug.log
 
 ### Test Output ###
 test/data/*.rt.actual.js
+test/data/*.code.js

src/reactTemplates.js

@@ -297,11 +297,17 @@ function convertHtmlToReact(node, context) {
 
         var data = {name: convertTagNameToConstructor(node.name, context)};
         if (node.attribs[scopeAttr]) {
-            data.scopeMapping = {};
+            //data.scopeMapping = {};
             data.scopeName = '';
+
+            // these are variables that were already in scope, unrelated to the ones declared in rt-scope
+            data.outerScopeMapping = {};
             _.each(context.boundParams, function (boundParam) {
-                data.scopeMapping[boundParam] = boundParam;
+                data.outerScopeMapping[boundParam] = boundParam;
             });
+            
+            // these are variables declared in the rt-scope attribute
+            data.innerScopeMapping = {};
             _.each(node.attribs[scopeAttr].split(';'), function (scopePart) {
                 if (scopePart.trim().length === 0) {
                     return;
@@ -313,10 +319,15 @@ function convertHtmlToReact(node, context) {
                 }
                 var scopeName = scopeSubParts[1].trim();
                 validateJS(scopeName, node, context);
+
+                // this adds both parameters to the list of parameters passed further down
+                // the scope chain, as well as variables that are locally bound before any
+                // function call, as with the ones we generate for rt-scope.
                 stringUtils.addIfMissing(context.boundParams, scopeName);
+
                 data.scopeName += stringUtils.capitalize(scopeName);
-                data.scopeMapping[scopeName] = scopeSubParts[0].trim();
+                data.innerScopeMapping[scopeName] = scopeSubParts[0].trim();
-                validateJS(data.scopeMapping[scopeName], node, context);
+                validateJS(data.innerScopeMapping[scopeName], node, context);
             });
         }
 
@@ -372,8 +383,13 @@ function convertHtmlToReact(node, context) {
             data.body = ifTemplate(data);
         }
         if (node.attribs[scopeAttr]) {
-            var generatedFuncName = generateInjectedFunc(context, 'scope' + data.scopeName, 'return ' + data.body, _.keys(data.scopeMapping));
+            var scopeVarDeclarations = _.reduce(data.innerScopeMapping, function (acc, rightHandSide, leftHandSide) {
-            data.body = generatedFuncName + '.apply(this, [' + _.values(data.scopeMapping).join(',') + '])';
+                var declaration = 'var ' + leftHandSide + ' = ' + rightHandSide + ';';
+                return acc + declaration;
+            }, '');
+            var functionBody = scopeVarDeclarations + 'return ' + data.body;
+            var generatedFuncName = generateInjectedFunc(context, 'scope' + data.scopeName, functionBody, _.keys(data.outerScopeMapping));
+            data.body = generatedFuncName + '.apply(this, [' + _.values(data.outerScopeMapping).join(',') + '])';
         }
         return data.body;
     } else if (node.type === 'comment') {

test/data/scope-variable-references.rt

@@ -0,0 +1,11 @@
+<div>
+	<div rt-repeat="foo in [1]">
+		<!-- can't seem to have an object literal here; will deal with this separately -->
+		<div rt-scope="[{first: 'Jack', last: 'Sparrow', skills: ['talking', 'fighting', 'commandeering']}][0] as pirate; pirate.first as first">
+			<h1>{first} {pirate.last}</h1>
+			<div rt-scope="pirate.skills as skills">
+				<span rt-repeat="skill in skills">{skill}</span>
+			</div>
+		</div>
+	</div>
+</div>

test/data/scope-variable-references.rt.html

@@ -0,0 +1 @@
+<div><div><div><h1>Jack Sparrow</h1><div><span>talking</span><span>fighting</span><span>commandeering</span></div></div></div></div>

test/src/test.js

@@ -119,12 +119,15 @@ test('conversion test', function (t) {
  * @param {string} actual
  * @param {string} expected
  * @param {string} filename
+ * @return {boolean} whether actual is equal to expected
  */
 function compareAndWrite(t, actual, expected, filename) {
     t.equal(actual, expected);
     if (actual !== expected) {
         fs.writeFileSync(filename + '.actual.js', actual);
+        return false;
     }
+    return true;
 }
 
 test('convert div with all module types', function (t) {
@@ -175,18 +178,19 @@ function normalizeHtml(html) {
 }
 
 test('html tests', function (t) {
-    var files = ['scope.rt', 'scope-trailing-semicolon.rt', 'lambda.rt', 'eval.rt', 'props.rt', 'custom-element.rt', 'style.rt', 'concat.rt', 'js-in-attr.rt', 'props-class.rt', 'rt-class.rt'];
+    var files = ['scope.rt', 'scope-trailing-semicolon.rt', 'scope-variable-references.rt', 'lambda.rt', 'eval.rt', 'props.rt', 'custom-element.rt', 'style.rt', 'concat.rt', 'js-in-attr.rt', 'props-class.rt', 'rt-class.rt'];
     t.plan(files.length);
 
     files.forEach(check);
 
     function check(testFile) {
+        var filename = path.join(dataPath, testFile);
+        var code = '';
         try {
-            var filename = path.join(dataPath, testFile);
             var html = fs.readFileSync(filename).toString();
             var expected = readFileNormalized(filename + '.html');
 //        var expected = fs.readFileSync(filename.replace(".html", ".js")).toString();
-            var code = reactTemplates.convertTemplateToReact(html).replace(/\r/g, '');
+            code = reactTemplates.convertTemplateToReact(html).replace(/\r/g, '');
             var defineMap = {'react/addons': React, lodash: _};
             //noinspection JSUnusedLocalSymbols
             var define = function (requirementsNames, content) { //eslint-disable-line no-unused-vars,func-style
@@ -202,9 +206,13 @@ test('html tests', function (t) {
             var actual = React.renderToStaticMarkup(comp());
             actual = normalizeHtml(actual);
             expected = normalizeHtml(expected);
-            compareAndWrite(t, actual, expected, filename);
+            var equal = compareAndWrite(t, actual, expected, filename);
+            if (!equal) {
+                fs.writeFileSync(filename + '.code.js', code);
+            }
         } catch (e) {
             console.log(testFile, e);
+            fs.writeFileSync(filename + '.code.js', code);
         }
     }
 });