Merge pull request #5669 from IgniteUI/fix-#3918-8.1.x

fix(grid): set flex shrink to 0 for all display containers

Author: Lipata

projects/igniteui-angular/src/lib/core/styles/components/_common/_igx-display-container.scss

@@ -3,6 +3,7 @@
     position: relative;
     width: 100%;
     overflow: hidden;
+    flex-shrink: 0;
 }
 
 %display-container--inactive {

projects/igniteui-angular/src/lib/grids/grid/grid.component.spec.ts

@@ -1342,10 +1342,13 @@ describe('IgxGrid Component Tests', () => {
             fix.detectChanges();
             await wait(16);
             // check UI
+            const rowSelectorHeader =  fix.nativeElement.querySelector('.igx-grid__thead').querySelector('.igx-grid__cbx-selection');
             const header0 = fix.debugElement.queryAll(By.css('igx-grid-header-group'))[0];
             const header1 = fix.debugElement.queryAll(By.css('igx-grid-header-group'))[1];
             const header2 = fix.debugElement.queryAll(By.css('igx-grid-header-group'))[2];
-            expect(header0.nativeElement.offsetWidth).toEqual(Math.round(0.7 * grid.unpinnedWidth));
+            const expectedWidth = Math.round(0.7 * (grid.unpinnedWidth + rowSelectorHeader.offsetWidth));
+            expect(header0.nativeElement.offsetWidth).toBeGreaterThanOrEqual(expectedWidth - 1);
+            expect(header0.nativeElement.offsetWidth).toBeLessThanOrEqual(expectedWidth + 1);
             expect(header1.nativeElement.offsetWidth).toEqual(136);
             expect(header2.nativeElement.offsetWidth).toEqual(136);
             expect(hScroll.nativeElement.hidden).toBe(false);