Undo does not work when deleting selected children and parent

[chuckn0rris]

Forum post

Hi,

We have found a scenario when undo does not revert a delete in a tree grid under certain circumstances. This is reproducible in a modified version of the Tree Grid demo:

Select a parent record and a child using the checkbox column (e.g. "Gates 1-5" and "Gate 3")
Delete both records at once by right clicking and clicking Delete
Press Undo

The parent record will reappear with all of it's children, except the child that was selected previously.

See this video for a walkthrough: https://drive.google.com/file/d/1ufPX4rH7Ou4Ft7iSuTuBqUEWpJdxFO7_/view?usp=sharing

Code used:

import { TreeGrid, GridRowModel, StateTrackingManager } from '../../build/grid.module.js?462681';
import shared from '../_shared/shared.module.js?462681';

class Gate extends GridRowModel {
    static get fields() {
        return [
            {
                name: 'capacity',
                type: 'number'
            },
            'domestic',
            'airline',
            'manager'
        ];
    }
}

// Transform a parent node to a leaf node when all its children are removed
Gate.convertEmptyParentToLeaf = true;

let tree = new TreeGrid({

selectionMode: {row: true, checkbox: {hideable: false}},
    appendTo: 'container',

features: {
    cellEdit: true,
    filter: true,
    rowReorder: true,
    stripe: true
},

loadMask: 'Loading tree data...',

columns: [
    { text: 'Id', field: 'id', width: 40, editor: false },
    { text: 'ParentIndex', field: 'parentIndex', width: 40, hidden: true },
    {
        text: 'Name',
        field: 'name',
        flex: 3,
        type: 'tree',
        touchConfig: { editor: false }
        // You can customize expand/collapse icons
        // expandIconCls   : 'b-fa b-fa-plus-square',
        // collapseIconCls : 'b-fa b-fa-minus-square'
    },
    { type: 'aggregate', text: 'Capacity', field: 'capacity', flex: 1 },
    { text: 'Domestic', field: 'domestic', flex: 1 },
    { text: 'Airline', field: 'airline', flex: 1 },
    {
        text: 'Responsible<br/>Manager',
        field: 'manager',
        width: 100,
        htmlEncodeHeaderText: false
    }
],

store: {
    modelClass: Gate,
    readUrl: 'data/kastrup-airport.json',
    autoLoad: true,
    stm: new StateTrackingManager({ disable: false, autoRecord: true })
},

tbar: [
    {
        type: 'button',
        ref: 'customButton',
        icon: 'b-fa-folder-open',
        pressedIcon: 'b-fa-plane',
        text: 'Use custom tree icons',
        toggleable: true,
        onToggle({ pressed }) {
            tree.store.readUrl =
                'data/' + (pressed ? 'ohare-airport.json' : 'kastrup-airport.json');
            tree.element.classList[pressed ? 'add' : 'remove']('ohare-airport');
            tree.store.load();
        }
    },
    {
        type: 'button',
        ref: 'expandAllButton',
        icon: 'b-fa b-fa-angle-double-down',
        text: 'Expand all',
        onAction: () => tree.expandAll()
    },
    {
        type: 'button',
        ref: 'collapseAllButton',
        icon: 'b-fa b-fa-angle-double-up',
        text: 'Collapse all',
        onAction: () => tree.collapseAll()
    },
    {
        type: 'button',
        text: 'Undo',
        onAction: () => {
            tree.store.stm.undo();
        }
    },
    {
        type: 'button',
        text: 'Redo',
        onAction: () => {
            tree.store.stm.redo();
        }
    }
]
});


tree.store.stm.enable();

Thanks,
Josh

[canonic-epicure]

Reproduced