Merge pull request #1232 from nasa/open1216

[Tables] Fixed table scroll by modifying selection of scrollable element. Fixes #1216

Author: VWoeltjen

platform/features/table/src/controllers/MCTTableController.js

@@ -1,7 +1,7 @@
 
 define(
-    [],
-    function () {
+    ['zepto'],
+    function ($) {
 
         /**
          * A controller for the MCTTable directive. Populates scope with
@@ -16,13 +16,13 @@ define(
             var self = this;
 
             this.$scope = $scope;
-            this.element = element;
+            this.element = $(element[0]);
             this.$timeout = $timeout;
             this.maxDisplayRows = 50;
 
-            this.scrollable = element.find('div');
-            this.thead = element.find('thead');
-            this.tbody = element.find('tbody');
+            this.scrollable = this.element.find('.l-view-section.scrolling').first();
+            this.resultsHeader = this.element.find('.mct-table>thead').first();
+            this.sizingTableBody = this.element.find('.sizing-table>tbody').first();
             this.$scope.sizingRow = {};
 
             this.scrollable.on('scroll', this.onScroll.bind(this));
@@ -261,8 +261,8 @@ define(
          * for individual rows.
          */
         MCTTableController.prototype.setElementSizes = function () {
-            var thead = this.thead,
-                tbody = this.tbody,
+            var thead = this.resultsHeader,
+                tbody = this.sizingTableBody,
                 firstRow = tbody.find('tr'),
                 column = firstRow.find('td'),
                 headerHeight = thead.prop('offsetHeight'),

platform/features/table/test/controllers/MCTTableControllerSpec.js

@@ -22,9 +22,16 @@
 
 define(
     [
+        "zepto",
         "../../src/controllers/MCTTableController"
     ],
-    function (MCTTableController) {
+    function ($, MCTTableController) {
+
+        var MOCK_ELEMENT_TEMPLATE =
+            '<div><div class="l-view-section scrolling">' +
+                '<table class="sizing-table"><tbody></tbody></table>' +
+                '<table class="mct-table"><thead></thead></table>' +
+            '</div></div>';
 
         describe('The MCTTable Controller', function () {
 
@@ -55,19 +62,7 @@ define(
                     watches[event] = callback;
                 });
 
-                mockElement = jasmine.createSpyObj('element', [
-                    'find',
-                    'prop',
-                    'on'
-                ]);
-                mockElement.find.andReturn(mockElement);
-                mockElement.prop.andReturn(0);
-                mockElement[0] = {
-                    scrollTop: 0,
-                    scrollHeight: 500,
-                    offsetHeight: 1000
-                };
-
+                mockElement = $(MOCK_ELEMENT_TEMPLATE);
                 mockExportService = jasmine.createSpyObj('exportService', [
                     'exportCSV'
                 ]);