From 4af9ebfc20146d39c26088b964b37de035dd53d5 Mon Sep 17 00:00:00 2001 From: Diyan Dimitrov Date: Thu, 17 Jan 2019 09:17:30 +0200 Subject: [PATCH 1/4] test(search): fixing search tests #3637 --- .../src/lib/grids/grid/grid.search.spec.ts | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts index f3bada047db..7563af922db 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts @@ -714,8 +714,8 @@ describe('IgxGrid - search API', () => { expect(isInView(3, grid.rowList.first.virtDirRow.state)).toBeTruthy(); }); - it('should keep the active highlight when active cell enters and exits edit mode', () => { - pending('When the cell enters edit mode, the highlight stays and the content is doubled! Happens in tests only!'); + fit('should keep the active highlight when active cell enters and exits edit mode', async () => { + // pending('When the cell enters edit mode, the highlight stays and the content is doubled! Happens in tests only!'); const rv = fix.debugElement.query(By.css(CELL_CSS_CLASS)).nativeElement; const cell = grid.getCellByColumn(0, 'ID'); const initialValue = rv.textContent; @@ -724,6 +724,7 @@ describe('IgxGrid - search API', () => { cell.column.editable = true; fix.detectChanges(); + await wait(16); grid.findNext('1'); @@ -731,6 +732,8 @@ describe('IgxGrid - search API', () => { expect(activeHighlight).not.toBeNull(); cell.inEditMode = true; + // fix.detectChanges(); + await wait(16); fix.detectChanges(); expect(cell.inEditMode).toBe(true); @@ -738,16 +741,17 @@ describe('IgxGrid - search API', () => { expect(activeHighlight).toBeNull(); cell.inEditMode = false; + await wait(16); fix.detectChanges(); - expect(rv.textContent).toBe(initialValue); + expect(rv.innerText).toBe(initialValue); expect(rv.querySelectorAll('.' + component.highlightClass).length).toBe(1); activeHighlight = rv.querySelector('.' + component.activeClass); expect(activeHighlight).not.toBeNull(); }); - it('should update highlights when a new value is entered', () => { - pending('When the cell enters edit mode, the highlight stays and the content is doubled! Happens in tests only!'); + fit('should update highlights when a new value is entered', async () => { + // pending('When the cell enters edit mode, the highlight stays and the content is doubled! Happens in tests only!'); const rv = fix.debugElement.query(By.css(CELL_CSS_CLASS)); const cell = grid.getCellByColumn(0, 'ID'); @@ -774,8 +778,9 @@ describe('IgxGrid - search API', () => { cell.update(inputElem.value); fix.detectChanges(); + await wait(16); - expect(rv.nativeElement.textContent).toBe('11'); + expect(rv.nativeElement.innerText).toBe('11'); activeHighlight = rv.nativeElement.querySelector('.' + component.activeClass); const highlights = rv.nativeElement.querySelectorAll('.' + component.highlightClass); expect(highlights.length).toBe(2); From c6e333b835d2e72ccc1044793385ca6e322c972a Mon Sep 17 00:00:00 2001 From: Diyan Dimitrov Date: Thu, 17 Jan 2019 09:20:08 +0200 Subject: [PATCH 2/4] fix(search): fix converting nodeLists to array #3637 --- .../directives/text-highlight/text-highlight.directive.ts | 4 ++-- .../src/lib/grids/grid/grid.search.spec.ts | 8 ++------ 2 files changed, 4 insertions(+), 8 deletions(-) diff --git a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts index d42ab9158e2..fa6e1013f0c 100644 --- a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts @@ -318,7 +318,7 @@ export class IgxTextHighlightDirective implements AfterViewInit, OnDestroy, OnCh if (this._observer === null) { const callback = (mutationList) => { mutationList.forEach((mutation) => { - const removedNodes = new Array(... mutation.removedNodes); + const removedNodes = Array.from(mutation.removedNodes); removedNodes.forEach((n) => { if (n === this._container) { this._nodeWasRemoved = true; @@ -326,7 +326,7 @@ export class IgxTextHighlightDirective implements AfterViewInit, OnDestroy, OnCh } }); - const addedNodes = new Array(... mutation.addedNodes); + const addedNodes = Array.from(mutation.addedNodes); addedNodes.forEach((n) => { if (n === this.parentElement.firstElementChild && this._nodeWasRemoved) { this._container = this.parentElement.firstElementChild; diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts index 7563af922db..5f38065840e 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid.search.spec.ts @@ -714,8 +714,7 @@ describe('IgxGrid - search API', () => { expect(isInView(3, grid.rowList.first.virtDirRow.state)).toBeTruthy(); }); - fit('should keep the active highlight when active cell enters and exits edit mode', async () => { - // pending('When the cell enters edit mode, the highlight stays and the content is doubled! Happens in tests only!'); + it('should keep the active highlight when active cell enters and exits edit mode', async () => { const rv = fix.debugElement.query(By.css(CELL_CSS_CLASS)).nativeElement; const cell = grid.getCellByColumn(0, 'ID'); const initialValue = rv.textContent; @@ -732,7 +731,6 @@ describe('IgxGrid - search API', () => { expect(activeHighlight).not.toBeNull(); cell.inEditMode = true; - // fix.detectChanges(); await wait(16); fix.detectChanges(); @@ -750,9 +748,7 @@ describe('IgxGrid - search API', () => { expect(activeHighlight).not.toBeNull(); }); - fit('should update highlights when a new value is entered', async () => { - // pending('When the cell enters edit mode, the highlight stays and the content is doubled! Happens in tests only!'); - + it('should update highlights when a new value is entered', async () => { const rv = fix.debugElement.query(By.css(CELL_CSS_CLASS)); const cell = grid.getCellByColumn(0, 'ID'); cell.column.editable = true; From 1a873a038725cbe1a19d8dafac3ee91da71aeff0 Mon Sep 17 00:00:00 2001 From: Diyan Dimitrov Date: Thu, 17 Jan 2019 11:22:17 +0200 Subject: [PATCH 3/4] fix(search): observe highlight when changing inEditMode #3637 --- .../src/lib/grids/cell.component.ts | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/projects/igniteui-angular/src/lib/grids/cell.component.ts b/projects/igniteui-angular/src/lib/grids/cell.component.ts index b839f523eed..87f9b2704c7 100644 --- a/projects/igniteui-angular/src/lib/grids/cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/cell.component.ts @@ -267,12 +267,15 @@ export class IgxGridCellComponent implements OnInit, AfterViewInit { */ get inEditMode(): boolean { const editableCell = this.gridAPI.get_cell_inEditMode(this.gridID); - if (editableCell) { - return this.cellID.rowID === editableCell.cellID.rowID && - this.cellID.columnID === editableCell.cellID.columnID; - } else { - return false; + const result = editableCell ? this.cellID.rowID === editableCell.cellID.rowID && + this.cellID.columnID === editableCell.cellID.columnID : false; + + if (result && !this._cellEditMode && this.highlight && this.grid.lastSearchInfo.searchText) { + this.highlight.observe(); } + this._cellEditMode = result; + + return result; } /** @@ -289,9 +292,6 @@ export class IgxGridCellComponent implements OnInit, AfterViewInit { if (this.column.editable && value) { this.focused = true; this.gridAPI.set_cell_inEditMode(this.gridID, this); - if (this.highlight && this.grid.lastSearchInfo.searchText) { - this.highlight.observe(); - } this.editValue = this.value; } else { this.gridAPI.escape_editMode(this.gridID, this.cellID); @@ -498,6 +498,7 @@ export class IgxGridCellComponent implements OnInit, AfterViewInit { private cellSelectionID: string; private prevCellSelectionID: string; private previousCellEditMode = false; + private _cellEditMode: boolean; constructor( public gridAPI: GridBaseAPIService, From 5b4171240b41b2fc440290a5c7eb408a877d195e Mon Sep 17 00:00:00 2001 From: Diyan Dimitrov Date: Thu, 17 Jan 2019 11:29:08 +0200 Subject: [PATCH 4/4] fix(search): renaming private member #3637 --- projects/igniteui-angular/src/lib/grids/cell.component.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/projects/igniteui-angular/src/lib/grids/cell.component.ts b/projects/igniteui-angular/src/lib/grids/cell.component.ts index 87f9b2704c7..f85e3ea7a04 100644 --- a/projects/igniteui-angular/src/lib/grids/cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/cell.component.ts @@ -270,10 +270,10 @@ export class IgxGridCellComponent implements OnInit, AfterViewInit { const result = editableCell ? this.cellID.rowID === editableCell.cellID.rowID && this.cellID.columnID === editableCell.cellID.columnID : false; - if (result && !this._cellEditMode && this.highlight && this.grid.lastSearchInfo.searchText) { + if (result && !this._inEditMode && this.highlight && this.grid.lastSearchInfo.searchText) { this.highlight.observe(); } - this._cellEditMode = result; + this._inEditMode = result; return result; } @@ -498,7 +498,7 @@ export class IgxGridCellComponent implements OnInit, AfterViewInit { private cellSelectionID: string; private prevCellSelectionID: string; private previousCellEditMode = false; - private _cellEditMode: boolean; + private _inEditMode: boolean; constructor( public gridAPI: GridBaseAPIService,