Added support for index indentifiers

This is dependent on https://codereview.appspot.com/14743044 [email protected], arv BUG= Review URL: https://codereview.appspot.com/14756043
googlearchive · Oct 16, 2013 · b1fc58f · b1fc58f · gavindoughtie · Oct 17, 2013
1 parent 60c6262
commit b1fc58f
Show file tree

Hide file tree

Showing 3 changed files with 113 additions and 23 deletions.
diff --git a/src/polymer-expressions.js b/src/polymer-expressions.js
@@ -51,8 +51,11 @@
 
     return function(model, name, node) {
       var binding = expression.getBinding(model);
-      if (expression.scopeIdent && binding)
-        node.polymerExpressionScopeName_ = expression.scopeIdent;
+      if (expression.scopeIdent && binding) {
+        node.polymerExpressionScopeIdent_ = expression.scopeIdent;
+        if (expression.indexIdent)
+          node.polymerExpressionIndexIdent_ = expression.indexIdent;
+      }
 
       return binding
     }
@@ -193,8 +196,8 @@
     this.deps = {};
     this.depsList = [];
     this.currentPath = undefined;
-    this.ident = undefined;
-    this.indexName = undefined;
+    this.scopeIdent = undefined;
+    this.indexIdent = undefined;
   }
 
   ASTDelegate.prototype = {
@@ -310,15 +313,15 @@
       this.filters.push(new Filter(name, args));
     },
 
-    createAsExpression: function(expression, ident) {
+    createAsExpression: function(expression, scopeIdent) {
       this.expression = expression;
-      this.ident = ident;
+      this.scopeIdent = scopeIdent;
     },
 
-    createInExpression: function(ident, indexName, expression) {
+    createInExpression: function(scopeIdent, indexIdent, expression) {
       this.expression = expression;
-      this.ident = ident;
-      this.indexName = indexName;
+      this.scopeIdent = scopeIdent;
+      this.indexIdent = indexIdent;
     },
 
     createTopLevel: function(expression) {
@@ -329,7 +332,8 @@
   }
 
   function Expression(delegate) {
-    this.scopeIdent = delegate.ident;
+    this.scopeIdent = delegate.scopeIdent;
+    this.indexIdent = delegate.indexIdent;
 
     if (!delegate.expression && !delegate.labeledStatements.length)
       throw Error('No expression or labelled statements found.');
@@ -420,6 +424,16 @@
   };
 
   PolymerExpressions.prototype = {
+    prepareInstancePositionChanged: function(template) {
+      var indexIdent = template.polymerExpressionIndexIdent_;
+      if (!indexIdent)
+        return;
+
+      return function(templateInstance, index) {
+        templateInstance.model[indexIdent] = index;
+      };
+    },
+
     prepareBinding: function(pathString, name, node) {
       if (Path.get(pathString).valid)
         return; // bail out early if pathString is simple path.
@@ -428,7 +442,7 @@
     },
 
     prepareInstanceModel: function(template) {
-      var scopeName = template.polymerExpressionScopeName_;
+      var scopeName = template.polymerExpressionScopeIdent_;
       if (!scopeName)
         return;
 

diff --git a/tests/tests.js b/tests/tests.js
@@ -945,26 +945,101 @@ suite('PolymerExpressions', function() {
 
   test('in expression with index scope', function() {
     var div = createTestHtml(
-        '<template repeat="{{ user, index in array }}">' +
-            '{{ index }}. {{ user }}' +
+        '<template repeat="{{ value, i in array }}">' +
+          '{{ i }}. {{ value }}' +
         '</template>');
 
     var model = {
-      array: ['a', 'b']
+      array: ['a', 'b', 'c']
     };
 
     recursivelySetTemplateModel(div, model);
     Platform.performMicrotaskCheckpoint();
 
-    // TODO(arv): Enable the rest of this test when we have hooked up the
-    // binding for the index.
-    // assert.strictEqual('0. a', div.childNodes[1].textContent);
-    // assert.strictEqual('1. b', div.childNodes[2].textContent);
+    assert.strictEqual('0. a', div.childNodes[1].textContent);
+    assert.strictEqual('1. b', div.childNodes[2].textContent);
+    assert.strictEqual('2. c', div.childNodes[3].textContent);
 
-    // model.array.splice(1, 0, 'c');
-    // Platform.performMicrotaskCheckpoint();
-    // assert.strictEqual('0. a', div.childNodes[1].textContent);
-    // assert.strictEqual('1. c', div.childNodes[2].textContent);
-    // assert.strictEqual('2. b', div.childNodes[3].textContent);
+    model.array.splice(1, 1, 'd', 'e');
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0. a', div.childNodes[1].textContent);
+    assert.strictEqual('1. d', div.childNodes[2].textContent);
+    assert.strictEqual('2. e', div.childNodes[3].textContent);
+    assert.strictEqual('3. c', div.childNodes[4].textContent);
+
+    model.array.reverse();
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0. c', div.childNodes[1].textContent);
+    assert.strictEqual('1. e', div.childNodes[2].textContent);
+    assert.strictEqual('2. d', div.childNodes[3].textContent);
+    assert.strictEqual('3. a', div.childNodes[4].textContent);
+
+    model.array.sort();
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0. a', div.childNodes[1].textContent);
+    assert.strictEqual('1. c', div.childNodes[2].textContent);
+    assert.strictEqual('2. d', div.childNodes[3].textContent);
+    assert.strictEqual('3. e', div.childNodes[4].textContent);
+
+    model.array.shift();
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0. c', div.childNodes[1].textContent);
+    assert.strictEqual('1. d', div.childNodes[2].textContent);
+    assert.strictEqual('2. e', div.childNodes[3].textContent);
+
+    model.array.unshift('f');
+    model.array.push('g');
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0. f', div.childNodes[1].textContent);
+    assert.strictEqual('1. c', div.childNodes[2].textContent);
+    assert.strictEqual('2. d', div.childNodes[3].textContent);
+    assert.strictEqual('3. e', div.childNodes[4].textContent);
+    assert.strictEqual('4. g', div.childNodes[5].textContent);
+  });
+
+  test('in expression with nested index scopes', function() {
+    var div = createTestHtml(
+        '<template repeat="{{ foo, i in foos }}">' +
+          '<template repeat="{{ value, j in foo }}">' +
+            '{{ i }}:{{ j }}. {{ value }}' +
+          '</template>' +
+        '</template>');
+
+    var model = {
+      foos: [
+        [ 'a', 'b'],
+        [ 'c', 'd']
+      ]
+    };
+
+    recursivelySetTemplateModel(div, model);
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0:0. a', div.childNodes[2].textContent);
+    assert.strictEqual('0:1. b', div.childNodes[3].textContent);
+    assert.strictEqual('1:0. c', div.childNodes[5].textContent);
+    assert.strictEqual('1:1. d', div.childNodes[6].textContent);
+
+    model.foos.reverse();
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0:0. c', div.childNodes[2].textContent);
+    assert.strictEqual('0:1. d', div.childNodes[3].textContent);
+    assert.strictEqual('1:0. a', div.childNodes[5].textContent);
+    assert.strictEqual('1:1. b', div.childNodes[6].textContent);
+
+    model.foos[0].reverse();
+    model.foos[1].reverse();
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual('0:0. d', div.childNodes[2].textContent);
+    assert.strictEqual('0:1. c', div.childNodes[3].textContent);
+    assert.strictEqual('1:0. b', div.childNodes[5].textContent);
+    assert.strictEqual('1:1. a', div.childNodes[6].textContent);
   });
 });
diff --git a/tools b/tools