Skip to content

Commit ac546e5

Browse files
adumesnyadumesny
committed
Drop into full grid fix
* fix #263 * prevent dropping into a full grid (code was already there but failed to create node for testing from outside)
1 parent fc1446d commit ac546e5

3 files changed

Lines changed: 46 additions & 2 deletions

File tree

‎doc/CHANGES.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,7 @@ Change log
113113
* fix: [#2503](https://github.com/gridstack/gridstack.js/issues/2503) Drag and drop a widget on top of a locked widget - Thank you [JakubEleniuk](https://github.com/JakubEleniuk)
114114
* fix: [#2584](https://github.com/gridstack/gridstack.js/issues/2584) wrong sort order during 1 column resize - Thank you [JakubEleniuk](https://github.com/JakubEleniuk) again.
115115
* fix: [#2639](https://github.com/gridstack/gridstack.js/issues/2639) load() with mix of new item without coordinates
116+
* fix: [#2633](https://github.com/gridstack/gridstack.js/issues/2633) Drop into full grid causes crash
116117

117118
## 10.1.1 (2024-03-03)
118119
* fix: [#2620](https://github.com/gridstack/gridstack.js/pull/2620) allow resizing with sizeToContent:NUMBER is uses

‎spec/e2e/html/2633_drop_full_crash.html‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<title>#2633 Drop into full crash</title>
8+
<link rel="stylesheet" href="../../../demo/demo.css" />
9+
<script src="../../../dist/gridstack-all.js"></script>
10+
</head>
11+
<body>
12+
<div class="container-fluid">
13+
<h1>#2633 Drop into full crash</h1>
14+
<div class="grid-stack-item" gs-w="2" gs-h="2">
15+
<div class="grid-stack-item-content">2x2</div>
16+
</div>
17+
<br><br>
18+
<div class="grid-stack"></div>
19+
</div>
20+
<script src="events.js"></script>
21+
<script type="text/javascript">
22+
var count = 0;
23+
var items = [
24+
{x: 0, y: 0, w: 2, h: 2},
25+
{x: 2, y: 0, w: 2, h: 2},
26+
{x: 4, y: 0, w: 2, h: 2},
27+
{x: 6, y: 0, w: 2, h: 2},
28+
{x: 8, y: 0, w: 2, h: 2},
29+
{x: 10, y: 0, w: 2, h: 2},
30+
];
31+
items.forEach(w => w.content = String(count++));
32+
33+
var options = { // put in gridstack options here
34+
float: false,
35+
acceptWidgets: true,
36+
maxRow: 2
37+
};
38+
var grid = GridStack.init(options).load(items);
39+
40+
GridStack.setupDragIn('.grid-stack-item', { appendTo: 'body', helper: 'clone' });
41+
</script>
42+
</body>
43+
</html>

‎src/gridstack.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2113,7 +2113,7 @@ export class GridStack {
21132113

21142114
dd.droppable(this.el, {
21152115
accept: (el: GridItemHTMLElement) => {
2116-
let node: GridStackNode = el.gridstackNode;
2116+
let node: GridStackNode = el.gridstackNode || this._readAttr(el, false);
21172117
// set accept drop to true on ourself (which we ignore) so we don't get "can't drop" icon in HTML5 mode while moving
21182118
if (node?.grid === this) return true;
21192119
if (!this.opts.acceptWidgets) return false;
@@ -2125,7 +2125,7 @@ export class GridStack {
21252125
let selector = (this.opts.acceptWidgets === true ? '.grid-stack-item' : this.opts.acceptWidgets as string);
21262126
canAccept = el.matches(selector);
21272127
}
2128-
// finally check to make sure we actually have space left #1571
2128+
// finally check to make sure we actually have space left #1571 #2633
21292129
if (canAccept && node && this.opts.maxRow) {
21302130
let n = { w: node.w, h: node.h, minW: node.minW, minH: node.minH }; // only width/height matters and autoPosition
21312131
canAccept = this.engine.willItFit(n);

0 commit comments

Comments
 (0)