search

IgniteUI / igniteui-angular

Ignite UI for Angular is a complete library of Angular-native, Material-based Angular UI components with the fastest grids and charts, Pivot Grid, Dock Manager, Hierarchical Grid, and more.
https://www.infragistics.com/products/ignite-ui-angular
Other
568 stars 159 forks source link

Column moving with MRL duplicates drag ghost and errors out #14429

Open damyanpetev opened 6 days ago

damyanpetev commented 6 days ago

Description

When dragging columns on a grid with MRL setup, drag ghosts get duplicated and generally the second throws while being moved. For grouping the second ghost seems to work. If moving is enabled as well, there's an additional error and the move fails completely. Pretty sure this is a regression.

Steps to reproduce

  1. Open https://stackblitz.com/edit/zm7hi5 (cloned from https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/multi-row-layout#angular-multi-row-layout-example where it reproduces as well)
  2. Open dev tools console
  3. Grab a groupable column to drag (e.g. Contact Title)
  4. Drag around and drop the first ghost
  5. Move over the leftover ghost to start moving it
  6. Inspect the console

Result

Drag ghosts duplicates and the second throws while being moved:

polyfills.js:10462 Uncaught TypeError: Cannot read properties of null (reading 'grid')
    at IgxColumnMovingDropDirective.onDragEnter (vendor.js:175009:40)
    at Object.next (vendor.js:121806:201)

Moving adds another error and doesn't work at all:

polyfills.js:10462 Uncaught TypeError: Cannot read properties of null (reading 'level')
    at IgxColumnMovingDropDirective.onDragOver (vendor.js:174985:81)
    at Object.next (vendor.js:121808:200)

grid-mrl-drag

Expected result

Drag ghosts shouldn't duplicate, there should be no errors and column moving should work with MRL.

Attachments

Attach a sample if available, and screenshots, if applicable.