Pass through 'idForFirstItem' to the vertical-collection, so scroll-p…

…osition can be restored (#616)

* CHG: now 'idForFirstItem' is passed through to the vertica-collection, so there's a possibility to restore scroll-position

* CHG: add idForFirstItem-test

addon/components/ember-tbody/component.js

@@ -193,6 +193,16 @@ export default class EmberTBody extends Component {
   @type('string')
   key = '@identity';
 
+  /**
+    The property is passed through to the vertical-collection. If set, upon initialization
+    the scroll position will be set such that the item
+    with the provided id is at the top left on screen.
+    If the item with id cannot be found, scrollTop is set to 0.
+  */
+  @argument({ defaultIfUndefined: true })
+  @type(optional('string'))
+  idForFirstItem = null;
+
   /**
     A selector string that will select the element from
     which to calculate the viewable height.

addon/components/ember-tbody/template.hbs

@@ -11,6 +11,7 @@
   lastReached=lastReached
   firstVisibleChanged=firstVisibleChanged
   lastVisibleChanged=lastVisibleChanged
+  idForFirstItem=idForFirstItem
 
   as |rowValue|
 }}

tests/helpers/generate-table.js

@@ -40,6 +40,10 @@ const fullTable = hbs`
         staticHeight=staticHeight
         enableCollapse=enableCollapse
         enableTree=enableTree
+        key=key
+        bufferSize=bufferSize
+        idForFirstItem=idForFirstItem
+
 
         onSelect="onSelect"
         selectingChildrenSelectsParent=selectingChildrenSelectsParent

tests/integration/components/basic-test.js

@@ -71,6 +71,27 @@ module('Integration | basic', function() {
       );
     });
 
+    test('idForFirstItem works, so scroll position can be restored', async function(assert) {
+      let rowCount = 100;
+      let columnCount = 10;
+
+      await generateTable(this, {
+        columnCount,
+        rowCount,
+        key: 'id',
+        idForFirstItem: '60',
+        bufferSize: 0,
+      });
+
+      assert.ok(table.rows.length < rowCount, 'not all rows have been rendered');
+      assert.equal(table.getCell(0, 0).text.trim(), '60A', 'correct first row rendered');
+      assert.notEqual(
+        table.getCell(table.rows.length - 1, 0).text.trim(),
+        '99A',
+        'last rendered row is not last data row'
+      );
+    });
+
     test('fixed cells work', async function(assert) {
       function validateElements(container, elements, measurement) {
         for (let element of elements) {