reverted #1047 (updating styles)

doc/CHANGES.md

@@ -25,11 +25,12 @@ Change log
 
 ## v0.5.3-dev (upcoming changes)
 
+- fix for griditems with x=0 placement wrong order (introduced for #1017) ([#1054](https://github.com/gridstack/gridstack.js/issues/1054)).
+- fix `cellHeight(val)` not working due to style change caused by #937 fix ([#1068](https://github.com/gridstack/gridstack.js/issues/1068)).
 - add `gridstack.poly.js` for IE and older browsers, removed `core-js` lib from samples (<1k vs 85k), and all IE8 mentions ([#1061](https://github.com/gridstack/gridstack.js/pull/1061)).
 - add `jquery-ui.js` (and min.js) as minimal subset we need (55k vs 248k), which is now part of `gridstack.all.js`. Include individual parts if you need your own lib instead of all.js
 ([#1064](https://github.com/gridstack/gridstack.js/pull/1064)).
 - changed jquery dependency to lowest we can use (>=1.8) ([#629](https://github.com/gridstack/gridstack.js/issues/629)).
-- fix for griditems with x=0 placement wrong order (introduced for #1017) ([#1054](https://github.com/gridstack/gridstack.js/issues/1054)).
 
 ## v0.5.3 (2019-11-20)
 

spec/gridstack-spec.js

@@ -247,27 +247,35 @@ describe('gridstack', function() {
     afterEach(function() {
       document.body.removeChild(document.getElementById('gs-cont'));
     });
-    it('should have no changes', function() {
+    it('should start at 80 then become 120', function() {
+      var cellHeight = 80;
+      var verticalMargin = 10;
       var options = {
-        cellHeight: 80,
-        verticalMargin: 10,
+        cellHeight: cellHeight,
+        verticalMargin: verticalMargin,
         column: 12
       };
       $('.grid-stack').gridstack(options);
-      var grid = $('.grid-stack').data('gridstack');
-      grid.cellHeight( grid.cellHeight() );
-      expect(grid.cellHeight()).toBe(80);
-    });
-    it('should change cellHeight to 120', function() {
-      var options = {
-        cellHeight: 80,
-        verticalMargin: 10,
-        column: 10
-      };
-      $('.grid-stack').gridstack(options);
-      var grid = $('.grid-stack').data('gridstack');
-      grid.cellHeight( 120 );
-      expect(grid.cellHeight()).toBe(120);
+      var container = $('.grid-stack');
+      var grid = container.data('gridstack');
+      var rows = container.attr('data-gs-current-height');
+
+      expect(grid.cellHeight()).toBe(cellHeight);
+      expect(parseInt(container.css('height'))).toBe(rows * cellHeight + (rows-1) * verticalMargin);
+
+      grid.cellHeight( grid.cellHeight() ); // should be no-op
+      expect(grid.cellHeight()).toBe(cellHeight);
+      expect(parseInt(container.css('height'))).toBe(rows * cellHeight + (rows-1) * verticalMargin);
+
+      cellHeight = 120; // should change and CSS actual height
+      grid.cellHeight( cellHeight );
+      expect(grid.cellHeight()).toBe(cellHeight);
+      expect(parseInt(container.css('height'))).toBe(rows * cellHeight + (rows-1) * verticalMargin);
+
+      cellHeight = 20; // should change and CSS actual height
+      grid.cellHeight( cellHeight );
+      expect(grid.cellHeight()).toBe(cellHeight);
+      expect(parseInt(container.css('height'))).toBe(rows * cellHeight + (rows-1) * verticalMargin);
     });
   });
 

src/gridstack.js

@@ -1091,14 +1091,14 @@
       maxHeight = this._styles._max;
     }
 
-    if (this._styles._max !== 0 && maxHeight <= this._styles._max) { // Keep this._styles._max increasing
-      return ;
-    }
     this._initStyles();
     this._updateContainerHeight();
     if (!this.opts.cellHeight) { // The rest will be handled by CSS
       return ;
     }
+    if (this._styles._max !== 0 && maxHeight <= this._styles._max) { // Keep this._styles._max increasing
+      return ;
+    }
 
     if (!this.opts.verticalMargin || this.opts.cellHeightUnit === this.opts.verticalMarginUnit) {
       getHeight = function(nbRows, nbMargins) {