Make index a row details template instance property

vaadin · Mar 31, 2017 · 3b408c9 · 3b408c9
1 parent dba3e0b
commit 3b408c9
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 0 deletions.
diff --git a/test/row-details.html b/test/row-details.html
@@ -26,6 +26,30 @@
     </template>
   </test-fixture>
 
+  <dom-module id="x-grid">
+    <template>
+      <vaadin-grid id="grid" style="width: 50px; height: 400px;">
+        <template class="row-details"><span>[[index]]</span>-details</template>
+        <vaadin-grid-column>
+          <template>[[index]]</template>
+        </vaadin-grid-column>
+      </vaadin-grid>
+    </template>
+    <script>
+      HTMLImports.whenReady(function() {
+        Polymer({
+          is: 'x-grid'
+        });
+      });
+    </script>
+  </dom-module>
+
+  <test-fixture id="with-scope">
+    <template>
+      <x-grid></x-grid>
+    </template>
+  </test-fixture>
+
   <test-fixture id="repeat">
     <template>
       <vaadin-grid style="width: 200px; height: 400px;" size="100">
@@ -160,6 +184,27 @@
         });
       });
 
+      describe('inside a parent scope', function() {
+
+        beforeEach(function() {
+          grid = fixture('with-scope').$.grid;
+          grid.items = ['foo', 'bar', 'baz'];
+          bodyRows = getRows(grid.$.scroller.$.items);
+          Polymer.dom.flush();
+        });
+
+        it('should have the correct index on details template', function() {
+          // expand item 1
+          grid.expandItem('bar');
+
+          // expand item 0
+          grid.expandItem('foo');
+
+          var cells = getRowCells(bodyRows[1]);
+          expect(getCellContent(cells[1]).textContent.trim()).to.equal('1-details');
+        });
+      });
+
       describe('repeat', function() {
 
         var items = [];

diff --git a/vaadin-grid-row-details-behavior.html b/vaadin-grid-row-details-behavior.html
@@ -68,6 +68,7 @@
       var templatizer = new vaadin.elements.grid.Templatizer(this.dataHost);
       templatizer._instanceProps = {
         expanded: true,
+        index: true,
         item: true,
         selected: true
       };