Resize+Reorder combination fails on TurboTable header

[ARandomDude]

I'm submitting a ... (check one with "x")

[X] bug report => Search github for a similar issue or PR before submitting
[X ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)
http://plnkr.co/edit/YNPi0CMkzaQ1z0AVoaC3?p=preview

Current behavior
When resizing a column, if columns can also be reordered, dragging the column resizer also calls the drag listener so that everytime you try to resize a column, you inadvertendly drag it.

Expected behavior
When resizing a column, the drag listener should be temporarily removed.

[yeweinan]

Same issue here, rc2 doesn't fix it

[winarg]

5.2.0 doesn't fix it either :(

[marslan2037]

same issue

[ARandomDude]

As a workaround, you can do the following:

Monkeypatch Table#onColumnResizeBegin and Table#onColumnDragStart, so that the first method sets a flag (e.g. this['resizingInProgress'] = true) and that the latter method just returns if this flag is set. Also, Table#onColumnResizeEnd needs to set this flag to false at the end of the method. Of course, all three methods should call their original behavior, too.

[ArdynVex]

@ARandomDude
I've tried this code:

ngAfterViewInit(): void {
let _onColumnResizeBegin = this.table.onColumnResizeBegin.bind(this.table);
this.table.onColumnResizeBegin = (event) => {
this.resizingInProgress = true;
_onColumnResizeBegin(event);
};
let _onColumnResizeEnd = this.table.onColumnResizeEnd.bind(this.table);
this.table.onColumnResizeEnd = (event, column) => {
this.resizingInProgress = false;
_onColumnResizeEnd(event, column);
};
let _onColumnDragStart = this.table.onColumnDragStart.bind(this.table);
this.table.onColumnDragStart = (event, columnElement) => {
if (this.resizingInProgress)
return;
_onColumnDragStart(event, columnElement);
}
}

But nothing changed.

[abahrisd]

Create PR for this issue.
For example, you can monkeypatch onColumnDragStart method, like this.
In template:

<p-table #dt ...

In your component:

...
@ViewChild('dt') table;
...

ngOnInit() {
    this.table.onColumnDragStart = function (event, columnElement) {
    
        if (this.domHandler.hasClass(event.target, 'ui-column-resizer') || this.resizeHelperViewChild.nativeElement.style.display === 'block') {
            event.preventDefault();
            return;
        }
        
        this.reorderIconWidth = this.domHandler.getHiddenElementOuterWidth(this.reorderIndicatorUpViewChild.nativeElement);
        this.reorderIconHeight = this.domHandler.getHiddenElementOuterHeight(this.reorderIndicatorDownViewChild.nativeElement);
        this.draggedColumn = columnElement;
        event.dataTransfer.setData('text', 'b'); // For firefox
    }.bind(this.table);
}