chore(*): addressed PR comments and fixed exporter test #6673

Author: igdmdimitrov

projects/igniteui-angular/src/lib/services/excel/excel-exporter-grid.spec.ts

@@ -266,14 +266,13 @@ describe('Excel Exporter', () => {
             const grid = fix.componentInstance.grid;
             grid.columns[1].hidden = true;
             grid.columns[2].hidden = true;
-            const columnWidths = [100, 200, 0, undefined, null];
+            const columnWidths = [100, 200, 0, null];
             fix.detectChanges();
 
             await setColWidthAndExport(grid, options, fix, columnWidths[0]);
             await setColWidthAndExport(grid, options, fix, columnWidths[1]);
             await setColWidthAndExport(grid, options, fix, columnWidths[2]);
             await setColWidthAndExport(grid, options, fix, columnWidths[3]);
-            await setColWidthAndExport(grid, options, fix, columnWidths[4]);
         });
 
         it('should export all rows with the height specified in options.', async () => {

projects/igniteui-angular/src/lib/services/excel/excel-exporter.ts

@@ -83,7 +83,7 @@ export class IgxExcelExporterService extends IgxBaseExporter {
         }
 
         const worksheetData =
-            new WorksheetData(data, options, this._indexOfLastPinnedColumn, this._sort, this._isTreeGrid, this.columnWidthList);
+            new WorksheetData(data, this.columnWidthList, options, this._indexOfLastPinnedColumn, this._sort, this._isTreeGrid);
 
         this._xlsx = new JSZip();
 

projects/igniteui-angular/src/lib/services/excel/excel-files.ts

@@ -112,9 +112,12 @@ export class WorksheetFile implements IExcelFile {
             for (let i = 0; i < worksheetData.columnCount; i++) {
                 const width = dictionary.columnWidths[i];
                 // Use the width provided in the options if it exists
-                const widthInTwips = worksheetData.options.columnWidth ?
-                                    worksheetData.options.columnWidth :
-                                    Math.max(((width / 96) * 14.4), WorksheetFile.MIN_WIDTH);
+                let widthInTwips = worksheetData.options.columnWidth !== undefined ?
+                                        worksheetData.options.columnWidth :
+                                        Math.max(((width / 96) * 14.4), WorksheetFile.MIN_WIDTH);
+                if (widthInTwips === 0 || widthInTwips === null) {
+                    widthInTwips = WorksheetFile.MIN_WIDTH;
+                }
 
                 cols.push(`<col min="${(i + 1)}" max="${(i + 1)}" width="${widthInTwips}" customWidth="1"/>`);
             }
@@ -175,9 +178,12 @@ export class WorksheetFile implements IExcelFile {
             for (let i = 0; i < worksheetData.columnCount; i++) {
                 const width = dictionary.columnWidths[i];
                 // Use the width provided in the options if it exists
-                const widthInTwips = worksheetData.options.columnWidth ?
-                                    worksheetData.options.columnWidth :
-                                    Math.max(((width / 96) * 14.4), WorksheetFile.MIN_WIDTH);
+                let widthInTwips = worksheetData.options.columnWidth !== undefined ?
+                                        worksheetData.options.columnWidth :
+                                        Math.max(((width / 96) * 14.4), WorksheetFile.MIN_WIDTH);
+                if (widthInTwips === 0 || widthInTwips === null) {
+                    widthInTwips = WorksheetFile.MIN_WIDTH;
+                }
 
                 cols += `<col min="${(i + 1)}" max="${(i + 1)}" width="${widthInTwips}" customWidth="1"/>`;
             }

projects/igniteui-angular/src/lib/services/excel/test-data.service.spec.ts

@@ -615,7 +615,7 @@ export class FileContentData {
             case null:
             case 0:
                 wsDataColSettings =
-                    `<cols><col min="1" max="1" width="227.85" customWidth="1"/></cols>`;
+                    `<cols><col min="1" max="1" width="8.34" customWidth="1"/></cols>`;
                 break;
         }
 

projects/igniteui-angular/src/lib/services/excel/worksheet-data-dictionary.ts

@@ -23,7 +23,6 @@ export class WorksheetDataDictionary {
 
     public stringsCount: number;
 
-    // TODO Switch to fixed column width since auto-calculation takes a lot of time
     constructor(columnCount: number, columnWidth: number, columnWidthsList: number[]) {
         this._dictionary = {};
         this._widthsDictionary = {};

projects/igniteui-angular/src/lib/services/excel/worksheet-data.ts

@@ -10,9 +10,9 @@ export class WorksheetData {
     private _keys: string[];
     private _isSpecialData: boolean;
 
-    constructor(private _data: any[], public options: IgxExcelExporterOptions, public indexOfLastPinnedColumn,
-                public sort: any, public isTreeGridData = false, public columnWidths: number[]) {
-        this.initializeData(columnWidths);
+    constructor(private _data: any[], private _columnWidths: number[], public options: IgxExcelExporterOptions,
+            public indexOfLastPinnedColumn, public sort: any, public isTreeGridData = false) {
+        this.initializeData();
     }
 
     public get data() {
@@ -43,7 +43,7 @@ export class WorksheetData {
         return this._dataDictionary;
     }
 
-    private initializeData(columnWidths: number[]) {
+    private initializeData() {
         if (!this._data || this._data.length === 0) {
             return;
         }
@@ -60,6 +60,6 @@ export class WorksheetData {
         this._columnCount = this._keys.length;
         this._rowCount = this._data.length + 1;
 
-        this._dataDictionary = new WorksheetDataDictionary(this._columnCount, this.options.columnWidth, columnWidths);
+        this._dataDictionary = new WorksheetDataDictionary(this._columnCount, this.options.columnWidth, this._columnWidths);
     }
 }

projects/igniteui-angular/src/lib/services/exporter-common/base-export-service.ts

@@ -117,7 +117,7 @@ export abstract class IgxBaseExporter {
 
         const columns = grid.columnList.toArray();
         this._columnList = new Array<any>(columns.length);
-        this._columnWidthList = new Array<any>(columns.length);
+        this._columnWidthList = new Array<any>(columns.filter(c => !c.hidden).length);
 
         const hiddenColumns = [];
         let lastVisbleColumnIndex = -1;

src/app/grid-performance/grid-performance.sample.html

@@ -1,6 +1,6 @@
 <div style="height: 100vh; width: 100wh">
     <span> Fixed Size Rows</span>
-    <igx-grid #grid1 [showToolbar]="true" [rowHeight]="20" displayDensity="compact" [columnHiding]="true" [data]="localData" [rowSelection]="selectionMode" [allowFiltering]="true" [filterMode]="'excelStyleFilter'" [exportCsv]="true" [exportExcel]="true" exportText="Export" exportExcelText="Export to Excel" exportCsvText="Export to CSV">
+    <igx-grid #grid1 [showToolbar]="true" [rowHeight]="20" displayDensity="compact" [columnHiding]="true" [data]="localData" [rowSelection]="selectionMode" [allowFiltering]="true" [filterMode]="'excelStyleFilter'">
         <igx-column *ngFor="let c of columns" [sortable]="true" [filterable]="true" [resizable]="true" [field]="c.field" [header]="c.field" [width]="c.width">
         </igx-column>
     </igx-grid>

src/main.ts

@@ -1,5 +1,3 @@
-// TODO this is fixing the JSZip perf
-// import 'setimmediate';
 import { enableProdMode } from '@angular/core';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';