Filtering Row covers the first row of igxGrid when it is dynamically activated and Multi Column Headers are used

[npaunov]

Description

Filtering Row covers the first row of igxGrid when it is dynamically activated and Multi Column Headers are used

• igniteui-angular version: 7.0.x
• browser: all

Steps to reproduce

1. Open dev demos and go to grid-column-groups.sample.html
2. Remove [allowFiltering]="true" .
3. Add button :

<button type="button" (click)="setFilter()">Set Filtering</button>

4. Add handler in typescript:

    setFilter() {
        this.grid.allowFiltering = !this.grid.allowFiltering;
        this.grid.cdr.markForCheck();
      }

5. Run the demos and click the button.
6. Click filter chip.

Result

5. The filtering row appears over the first grid row.
6. The filtering UI appears above the filtering row.

Expected result

5. The filtering row should push down the first grid row.
6. The filtering UI should replace the filtering row.

Note: everything works as expected if there are no Multi Column Headers used.

Attachments