chore(*): Fix tests.

Author: MKirova

projects/igniteui-angular/src/lib/grids/columns/column.component.ts

@@ -440,24 +440,36 @@ export class IgxColumnComponent implements AfterContentInit {
     @Input()
     public maxWidth: string;
 
+    /**
+     * @hidden
+     */
     get maxWidthPx() {
         const gridAvailableSize = this.grid.calcWidth;
         const isPercentageWidth = this.maxWidth && typeof this.maxWidth === 'string' && this.maxWidth.indexOf('%') !== -1;
         return isPercentageWidth ?  parseFloat(this.maxWidth) / 100 * gridAvailableSize : parseFloat(this.maxWidth);
     }
 
+    /**
+     * @hidden
+     */
     get maxWidthPercent() {
         const gridAvailableSize = this.grid.calcWidth;
         const isPercentageWidth = this.maxWidth && typeof this.maxWidth === 'string' && this.maxWidth.indexOf('%') !== -1;
         return isPercentageWidth ?  parseFloat(this.maxWidth) : parseFloat(this.maxWidth) / gridAvailableSize * 100;
     }
 
+    /**
+     * @hidden
+     */
     get minWidthPx() {
         const gridAvailableSize = this.grid.calcWidth;
         const isPercentageWidth = this.minWidth && typeof this.minWidth === 'string' && this.minWidth.indexOf('%') !== -1;
         return isPercentageWidth ?  parseFloat(this.minWidth) / 100 * gridAvailableSize : parseFloat(this.minWidth);
     }
 
+    /**
+     * @hidden
+     */
     get minWidthPercent() {
         const gridAvailableSize = this.grid.calcWidth;
         const isPercentageWidth = this.minWidth && typeof this.minWidth === 'string' && this.minWidth.indexOf('%') !== -1;
@@ -1779,27 +1791,29 @@ export class IgxColumnComponent implements AfterContentInit {
      */
     public autosize() {
         if (!this.columnGroup) {
-            const size = this.getLargestCellWidth();
-            const gridAvailableSize = this.grid.calcWidth;
-            let newWidth;
-            const isPercentageWidth = this.width && typeof this.width === 'string' && this.width.indexOf('%') !== -1;
-            if (isPercentageWidth) {
-                const percentageSize =  parseFloat(size) / gridAvailableSize * 100;
-                newWidth = percentageSize + '%';
-            } else {
-                newWidth = size;
-            }
-            if (this.maxWidth && (parseFloat(size) > this.maxWidthPx)) {
-                newWidth = isPercentageWidth ? this.maxWidthPercent + '%' : this.maxWidthPx + 'px';
-            } else if (parseFloat(size) < this.minWidthPx) {
-                newWidth = isPercentageWidth ? this.minWidthPercent + '%' : this.minWidthPx + 'px';
-            }
-
-            this.width = newWidth;
+            const size = this.getAutoSize();
+            this.width = size;
             this.grid.reflow();
         }
     }
 
+    /**
+     * @hidden
+     */
+    public getAutoSize() {
+        const size = this.getLargestCellWidth();
+        const gridAvailableSize = this.grid.calcWidth;
+        let newWidth;
+        const isPercentageWidth = this.width && typeof this.width === 'string' && this.width.indexOf('%') !== -1;
+        if (isPercentageWidth) {
+            const percentageSize =  parseFloat(size) / gridAvailableSize * 100;
+            newWidth = percentageSize + '%';
+        } else {
+            newWidth = size;
+        }
+        return newWidth;
+    }
+
     /**
      * @hidden
      */
@@ -1905,7 +1919,7 @@ export class IgxColumnComponent implements AfterContentInit {
         const colWidth = this.width;
         const isPercentageWidth = colWidth && typeof colWidth === 'string' && colWidth.indexOf('%') !== -1;
         if (isPercentageWidth) {
-            this._calcWidth = parseInt(colWidth, 10) / 100 * grid.calcWidth;
+            this._calcWidth = parseInt(colWidth, 10) / 100 * (grid.calcWidth - grid.featureColumnsWidth());
         } else if (!colWidth) {
             // no width
             this._calcWidth = this.defaultWidth || grid.getPossibleColumnWidth();

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

@@ -392,7 +392,8 @@ describe('IgxGrid - Deferred Column Resizing #grid', () => {
         UIInteractions.simulateMouseEvent('mouseup', resizer, 350, 5);
         fixture.detectChanges();
 
-        expect(grid.columns[1].width).toEqual('250px');
+        // column has maxWidth='150px'
+        expect(grid.columns[1].width).toEqual('150px');
     });
 
     it('should autoresize column on double click.', async() => {
@@ -490,7 +491,7 @@ describe('IgxGrid - Deferred Column Resizing #grid', () => {
         expect(grid.columns[0].width).toEqual('300px');
         expect(fixture.componentInstance.count).toEqual(1);
         expect(fixture.componentInstance.column).toBe(grid.columns[0]);
-        expect(fixture.componentInstance.prevWidth).toEqual('150');
+        expect(fixture.componentInstance.prevWidth).toEqual('150px');
         expect(fixture.componentInstance.newWidth).toEqual('300px');
 
         expect(grid.columns[1].width).toEqual('150px');

projects/igniteui-angular/src/lib/grids/resizing/resizing.service.ts

@@ -77,14 +77,17 @@ export class IgxColumnResizingService {
      * Autosizes the column to the longest currently visible cell value, including the header cell.
      * If the column has a predifined maxWidth and the autosized column width will become bigger than it,
      * then the column is sized to its maxWidth.
-     * If the column is pinned and the autosized column width will cause the pinned area to become bigger
-     * than the maximum allowed pinned area width (80% of the total grid width), autosizing will be deismissed.
      */
     public autosizeColumnOnDblClick() {
         const currentColWidth = this.column.headerCell.elementRef.nativeElement.getBoundingClientRect().width;
-
-
-        this.column.autosize();
+        const isPercentageWidth = this.column.width && typeof this.column.width === 'string' && this.column.width.indexOf('%') !== -1;
+        let size = this.column.getAutoSize();
+        if (this.column.maxWidth && (parseFloat(size) > this.column.maxWidthPx)) {
+            size = isPercentageWidth ? this.column.maxWidthPercent + '%' : this.column.maxWidthPx + 'px';
+        } else if (parseFloat(size) < this.column.minWidthPx) {
+            size = isPercentageWidth ? this.column.minWidthPercent + '%' : this.column.minWidthPx + 'px';
+        }
+        this.column.width = size;
 
         this.zone.run(() => {});
 
@@ -106,7 +109,7 @@ export class IgxColumnResizingService {
         const isPercentageWidth = colWidth && typeof colWidth === 'string' && colWidth.indexOf('%') !== -1;
         let currentColWidth = parseFloat(colWidth);
         const actualWidth = this.column.headerCell.elementRef.nativeElement.getBoundingClientRect().width;
-        currentColWidth = Number.isNaN(currentColWidth) ? actualWidth : currentColWidth + 'px';
+        currentColWidth = Number.isNaN(currentColWidth) ? parseFloat(actualWidth) : currentColWidth;
 
         if (isPercentageWidth) {
             this._handlePercentageResize(diff, this.column);