fix(uiGrid): Use track by uid on columns

Track by name wasn't allowing for swapping out column definitions. If you re-used the same column names with different definitions this would cause your columns to lose their width CSS rules. Also re-enabled to unit test to check for this.
angular-ui · May 4, 2015 · e9ea9d4 · e9ea9d4
1 parent 1d9f81f
commit e9ea9d4
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 11 deletions.
diff --git a/src/templates/ui-grid/ui-grid-header.html b/src/templates/ui-grid/ui-grid-header.html
@@ -4,11 +4,11 @@
       <div class="ui-grid-header-canvas">
         <div class="ui-grid-header-cell-wrapper" ng-style="colContainer.headerCellWrapperStyle()">
           <div class="ui-grid-header-cell-row">
-            <div class="ui-grid-header-cell ui-grid-clearfix" ng-repeat="col in colContainer.renderedColumns track by col.colDef.name" ui-grid-header-cell col="col" render-index="$index"></div>
+            <div class="ui-grid-header-cell ui-grid-clearfix" ng-repeat="col in colContainer.renderedColumns track by col.uid" ui-grid-header-cell col="col" render-index="$index"></div>
           </div>
         </div>
       </div>
 
     </div>
   </div>
-</div>
+</div>
diff --git a/src/templates/ui-grid/ui-grid-row.html b/src/templates/ui-grid/ui-grid-row.html
@@ -1,2 +1 @@
- <div ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.colDef.name" class="ui-grid-cell" ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }"  ui-grid-cell></div>
-
+ <div ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.uid" class="ui-grid-cell" ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }"  ui-grid-cell></div>
diff --git a/test/unit/core/directives/uiGridCell.spec.js b/test/unit/core/directives/uiGridCell.spec.js
@@ -60,7 +60,7 @@ describe('uiGridCell', function () {
       recompile();
       var displayHtml = gridCell.html();
       expect(gridCell.hasClass('funcCellClass')).toBe(true);
-      
+
       $scope.col.noClass = true;
       $scope.grid.api.core.notifyDataChange( uiGridConstants.dataChange.COLUMN );
       expect(gridCell.hasClass('funcCellClass')).toBe(false);
@@ -80,18 +80,17 @@ describe('uiGridCell', function () {
       recompile();
       var displayHtml = gridCell.html();
       expect(gridCell.hasClass('funcCellClass')).toBe(true);
-      
+
       $scope.col = new GridColumn({name: 'col2'}, 0, $scope.grid);
       $scope.$digest();
       expect(gridCell.hasClass('funcCellClass')).toBe(false);
     }));
 */
   });
-  
+
   // Don't run this on IE9. The behavior looks correct when testing interactively but these tests fail
-/* not a valid test.....we think
   if (!navigator.userAgent.match(/MSIE\s+9\.0/)) {
-    it("should change a column's class when its uid changes", inject(function (gridUtil, $compile, uiGridConstants) {
+    iit("should change a column's class when its uid changes", inject(function (gridUtil, $compile, uiGridConstants) {
       // Reset the UIDs (used by columns) so they're fresh and clean
       gridUtil.resetUids();
 
@@ -146,5 +145,5 @@ describe('uiGridCell', function () {
       angular.element(gridElm).remove();
     }));
   }
-*/
-});
+
+});