Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion addon/components/grid-stack.js
Original file line number Diff line number Diff line change
Expand Up @@ -159,7 +159,7 @@ export default class GridStackComponent extends Component {
el.remove(); // in batch mode engine.removeNode doesn't call back to remove DOM
}
});
if (triggerEvent) {
if (triggerEvent && !this.isDestroying && !this.isDestroyed) {
this.gridStack?._triggerRemoveEvent();
this.gridStack?._triggerChangeEvent();
}
Expand Down
36 changes: 34 additions & 2 deletions tests/integration/components/grid-stack-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -145,8 +145,7 @@ module('Integration | Component | grid stack', function (hooks) {
});

test('onChange, onAdded, onRemove actions', async function (assert) {
// onAdded should run twice, onChange once, onRemoved twice
assert.expect(15);
assert.expect(12);

this.set('items', A([1]));

Expand Down Expand Up @@ -303,4 +302,37 @@ module('Integration | Component | grid stack', function (hooks) {
.dom(`[data-id="3"]`)
.hasAttribute('gs-y', '2', 'Updating a grid-stack-item moves conflicting items to a different row');
});

test('do not fire `onChange` or `onRemoved` during teardown', async function (assert) {
assert.expect(1);

this.set('shouldRender', true);
this.set('items', [
{ id: 0, options: { x: 0, y: 0, w: 5, h: 1 } },
{ id: 1, options: { x: 6, y: 0, w: 3, h: 1 } },
{ id: 2, options: { x: 0, y: 1, w: 4, h: 1 } },
{ id: 3, options: { x: 6, y: 1, w: 2, h: 1 } },
]);

this.onChange = () => assert.notOk(true, '`onChange` should not fire on teardown');
this.onRemoved = () => assert.notOk(true, '`onRemoved` should not fire on teardown');

await render(hbs`
{{#if this.shouldRender}}
<GridStack
onChange={{this.onChange}}
onRemoved={{this.onChange}}
>
{{#each this.items as |item|}}
<GridStackItem data-id={{item.id}} @options={{item.options}}>
{{item.id}}
</GridStackItem>
{{/each}}
</GridStack>
{{/if}}
`);

this.set('shouldRender', false);
assert.ok(true, 'all is good');
});
});