Skip to content

Commit d7ae9e5

Browse files
authored
fix main test and bug (#2859)
fixed the main test file which exposed multiple bugs! : * GridStack:init(null) didn't set this.opts * loading exiting layout incorrecly moved items (when just one caused collision) * update(el, {id: 'newId'}) didn't update the id * some attr setting optimization going forward need to get full test coverage to help find issues... continue #2850
1 parent adf410f commit d7ae9e5

File tree

8 files changed

+544
-539
lines changed

8 files changed

+544
-539
lines changed

angular/projects/demo/src/app/app.component.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@
103103
</div>
104104
} @else if (show===8) {
105105
<div>
106-
<p>delay loading of components</p>
106+
<p>open console and scroll to see delay loading of components</p>
107107
<div style="height: 120px; overflow-y: auto">
108108
<gridstack [options]="gridOptionsDelay"></gridstack>
109109
</div>

doc/CHANGES.md

+5
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ Change log
55
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
66
**Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)*
77

8+
- [11.0.1-dev (TBD)](#1101-dev-tbd)
89
- [11.0.1 (2024-10-21)](#1101-2024-10-21)
910
- [11.0.0 (2024-10-20)](#1100-2024-10-20)
1011
- [10.3.1 (2024-07-21)](#1031-2024-07-21)
@@ -115,6 +116,10 @@ Change log
115116

116117
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
117118

119+
## 11.0.1-dev (TBD)
120+
* fix: [#2859](https://github.com/gridstack/gridstack.js/pull/2859) re-enabled tests and fix numerous issues found (see CL). Also thank you [lmartorella](https://github.com/lmartorella) for getting me going and starting it.
121+
* fix: [#2851](https://github.com/gridstack/gridstack.js/pull/2851) added support for custom max layout saving - Thank you [lmartorella](https://github.com/lmartorella)
122+
118123
## 11.0.1 (2024-10-21)
119124
* fix: [#2834](https://github.com/gridstack/gridstack.js/pull/2834) v11 angular missing package.json
120125
* fix: [#2835](https://github.com/gridstack/gridstack.js/bug/2835) make sure we have unique USER id

react/lib/constants.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,17 @@ export const BREAKPOINTS = [
66
{ c: 6, w: 950 },
77
{ c: 8, w: 1100 },
88
];
9+
const cellHeight = 50;
910

1011
export const SUB_GRID_OPTIONS: GridStackOptions = {
1112
acceptWidgets: true,
12-
column: 12,
1313
columnOpts: {
1414
breakpoints: BREAKPOINTS,
1515
layout: 'moveScale',
1616
},
1717
margin: 8,
1818
minRow: 2,
19+
cellHeight,
1920
} as const;
2021

2122
export const GRID_OPTIONS: GridStackOptions = {
@@ -25,7 +26,7 @@ export const GRID_OPTIONS: GridStackOptions = {
2526
breakpoints: BREAKPOINTS,
2627
layout: 'moveScale',
2728
},
28-
float: false,
2929
margin: 8,
30+
cellHeight,
3031
subGridOpts: SUB_GRID_OPTIONS,
3132
} as const;

spec/gridstack-engine-spec.ts

+35-36
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,7 @@ describe('gridstack engine:', function() {
55
'use strict';
66
let e: GridStackEngine;
77
let ePriv: any; // cast engine for private vars access
8-
9-
let findNode = function(e: GridStackEngine, id: string) {
8+
let findNode = function(id: string) {
109
return e.nodes.find(n => n.id === id);
1110
};
1211

@@ -247,16 +246,16 @@ describe('gridstack engine:', function() {
247246
e.prepareNode({x: 0, y: 0, w:1, h:1, id: '1'}),
248247
];
249248
ePriv._packNodes();
250-
expect(findNode(e, '1')).toEqual(jasmine.objectContaining({x: 0, y: 0, h: 1}));
251-
expect(findNode(e, '1')!._dirty).toBeFalsy();
249+
expect(findNode('1')).toEqual(jasmine.objectContaining({x: 0, y: 0, h: 1}));
250+
expect(findNode('1')!._dirty).toBeFalsy();
252251
});
253252

254253
it('should pack one node correctly', function() {
255254
e.nodes = [
256255
e.prepareNode({x: 0, y: 1, w:1, h:1, id: '1'}),
257256
];
258257
ePriv._packNodes();
259-
expect(findNode(e, '1')).toEqual(jasmine.objectContaining({x: 0, y: 0, _dirty: true}));
258+
expect(findNode('1')).toEqual(jasmine.objectContaining({x: 0, y: 0, _dirty: true}));
260259
});
261260

262261
it('should pack nodes correctly', function() {
@@ -265,8 +264,8 @@ describe('gridstack engine:', function() {
265264
e.prepareNode({x: 0, y: 5, w:1, h:1, id: '2'}),
266265
];
267266
ePriv._packNodes();
268-
expect(findNode(e, '1')).toEqual(jasmine.objectContaining({x: 0, y: 0, _dirty: true}));
269-
expect(findNode(e, '2')).toEqual(jasmine.objectContaining({x: 0, y: 1, _dirty: true}));
267+
expect(findNode('1')).toEqual(jasmine.objectContaining({x: 0, y: 0, _dirty: true}));
268+
expect(findNode('2')).toEqual(jasmine.objectContaining({x: 0, y: 1, _dirty: true}));
270269
});
271270

272271
it('should pack reverse nodes correctly', function() {
@@ -275,8 +274,8 @@ describe('gridstack engine:', function() {
275274
e.prepareNode({x: 0, y: 1, w:1, h:1, id: '2'}),
276275
];
277276
ePriv._packNodes();
278-
expect(findNode(e, '2')).toEqual(jasmine.objectContaining({x: 0, y: 0, _dirty: true}));
279-
expect(findNode(e, '1')).toEqual(jasmine.objectContaining({x: 0, y: 1, _dirty: true}));
277+
expect(findNode('2')).toEqual(jasmine.objectContaining({x: 0, y: 0, _dirty: true}));
278+
expect(findNode('1')).toEqual(jasmine.objectContaining({x: 0, y: 1, _dirty: true}));
280279
});
281280

282281
it('should respect locked nodes', function() {
@@ -285,9 +284,9 @@ describe('gridstack engine:', function() {
285284
e.prepareNode({x: 0, y: 5, w:1, h:1, id: '2'}),
286285
];
287286
ePriv._packNodes();
288-
expect(findNode(e, '1')).toEqual(jasmine.objectContaining({x: 0, y: 1, h: 1}));
289-
expect(findNode(e, '1')!._dirty).toBeFalsy();
290-
expect(findNode(e, '2')).toEqual(jasmine.objectContaining({x: 0, y: 2, _dirty: true}));
287+
expect(findNode('1')).toEqual(jasmine.objectContaining({x: 0, y: 1, h: 1}));
288+
expect(findNode('1')!._dirty).toBeFalsy();
289+
expect(findNode('2')).toEqual(jasmine.objectContaining({x: 0, y: 2, _dirty: true}));
291290
});
292291
});
293292
});
@@ -329,17 +328,17 @@ describe('gridstack engine:', function() {
329328
];
330329
// add locked item
331330
e.addNode(nodes[0])
332-
expect(findNode(e, '0')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 12, h: 1, locked: true}));
331+
expect(findNode('0')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 12, h: 1, locked: true}));
333332
// add item that moves past locked one
334333
e.addNode(nodes[1])
335-
expect(findNode(e, '0')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 12, h: 1, locked: true}));
336-
expect(findNode(e, '1')).toEqual(jasmine.objectContaining({x: 1, y: 2, h: 3}));
334+
expect(findNode('0')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 12, h: 1, locked: true}));
335+
expect(findNode('1')).toEqual(jasmine.objectContaining({x: 1, y: 2, h: 3}));
337336
// locked item can still be moved directly (what user does)
338-
let node0 = findNode(e, '0');
337+
let node0 = findNode('0');
339338
expect(e.moveNode(node0!, {y:6})).toEqual(true);
340-
expect(findNode(e, '0')).toEqual(jasmine.objectContaining({x: 0, y: 6, h: 1, locked: true}));
339+
expect(findNode('0')).toEqual(jasmine.objectContaining({x: 0, y: 6, h: 1, locked: true}));
341340
// but moves regular one past it
342-
let node1 = findNode(e, '1');
341+
let node1 = findNode('1');
343342
expect(e.moveNode(node1!, {x:6, y:6})).toEqual(true);
344343
expect(node1).toEqual(jasmine.objectContaining({x: 6, y: 7, w: 2, h: 3}));
345344
// but moves regular one before (gravity ON)
@@ -361,42 +360,42 @@ describe('gridstack engine:', function() {
361360
// Add two side-by-side components 6+6 = 12 columns
362361
e.addNode({ x: 0, y: 0, w: 6, h: 1, id: 'left' });
363362
e.addNode({ x: 6, y: 0, w: 6, h: 1, id: 'right' });
364-
e.save().forEach(node => e.nodeBoundFix(findNode(e, node.id!)!));
365-
expect(findNode(e, 'left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 6, h: 1}));
366-
expect(findNode(e, 'right')).toEqual(jasmine.objectContaining({x: 6, y: 0, w: 6, h: 1}));
363+
e.save().forEach(node => e.nodeBoundFix(findNode(node.id!)!));
364+
expect(findNode('left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 6, h: 1}));
365+
expect(findNode('right')).toEqual(jasmine.objectContaining({x: 6, y: 0, w: 6, h: 1}));
367366
// Resize to 1 column
368367
e.column = 1;
369368
e.columnChanged(12, 1);
370-
e.save().forEach(node => e.nodeBoundFix(findNode(e, node.id!)!));
371-
expect(findNode(e, 'left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 1, h: 1}));
372-
expect(findNode(e, 'right')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 1, h: 1}));
369+
e.save().forEach(node => e.nodeBoundFix(findNode(node.id!)!));
370+
expect(findNode('left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 1, h: 1}));
371+
expect(findNode('right')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 1, h: 1}));
373372
// Resize back to 12 column
374373
e.column = 12;
375374
e.columnChanged(1, 12);
376-
e.save().forEach(node => e.nodeBoundFix(findNode(e, node.id!)!));
377-
expect(findNode(e, 'left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 6, h: 1}));
378-
expect(findNode(e, 'right')).toEqual(jasmine.objectContaining({x: 6, y: 0, w: 6, h: 1}));
375+
e.save().forEach(node => e.nodeBoundFix(findNode(node.id!)!));
376+
expect(findNode('left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 6, h: 1}));
377+
expect(findNode('right')).toEqual(jasmine.objectContaining({x: 6, y: 0, w: 6, h: 1}));
379378
});
380379
it('wont\'t break layouts with more than 12 columns', function() {
381380
ePriv = e = new GridStackEngine({ column: 24 });
382381
// Add two side-by-side components 12+12 = 24 columns
383382
e.addNode({ x: 0, y: 0, w: 12, h: 1, id: 'left' });
384383
e.addNode({ x: 12, y: 0, w: 12, h: 1, id: 'right' });
385-
e.save().forEach(node => e.nodeBoundFix(findNode(e, node.id!)!));
386-
expect(findNode(e, 'left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 12, h: 1}));
387-
expect(findNode(e, 'right')).toEqual(jasmine.objectContaining({x: 12, y: 0, w: 12, h: 1}));
384+
e.save().forEach(node => e.nodeBoundFix(findNode(node.id!)!));
385+
expect(findNode('left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 12, h: 1}));
386+
expect(findNode('right')).toEqual(jasmine.objectContaining({x: 12, y: 0, w: 12, h: 1}));
388387
// Resize to 1 column
389388
e.column = 1;
390389
e.columnChanged(24, 1);
391-
e.save().forEach(node => e.nodeBoundFix(findNode(e, node.id!)!));
392-
expect(findNode(e, 'left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 1, h: 1}));
393-
expect(findNode(e, 'right')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 1, h: 1}));
390+
e.save().forEach(node => e.nodeBoundFix(findNode(node.id!)!));
391+
expect(findNode('left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 1, h: 1}));
392+
expect(findNode('right')).toEqual(jasmine.objectContaining({x: 0, y: 1, w: 1, h: 1}));
394393
// Resize back to 24 column
395394
e.column = 24;
396395
e.columnChanged(1, 24);
397-
e.save().forEach(node => e.nodeBoundFix(findNode(e, node.id!)!));
398-
expect(findNode(e, 'left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 12, h: 1}));
399-
expect(findNode(e, 'right')).toEqual(jasmine.objectContaining({x: 12, y: 0, w: 12, h: 1}));
396+
e.save().forEach(node => e.nodeBoundFix(findNode(node.id!)!));
397+
expect(findNode('left')).toEqual(jasmine.objectContaining({x: 0, y: 0, w: 12, h: 1}));
398+
expect(findNode('right')).toEqual(jasmine.objectContaining({x: 12, y: 0, w: 12, h: 1}));
400399
});
401400
});
402401

0 commit comments

Comments
 (0)