diff --git a/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.html b/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.html index 2b7e0ccca..ac0387f3f 100644 --- a/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.html +++ b/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.html @@ -1,5 +1,8 @@ - + diff --git a/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.ts b/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.ts index 55b10beab..8d40a0b3a 100644 --- a/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.ts +++ b/src/modules/list-column-selector-action/fixtures/list-column-selector-action.component.fixture.ts @@ -2,6 +2,7 @@ import { Component, ViewChild } from '@angular/core'; import { Observable } from 'rxjs/Observable'; import { SkyListViewGridComponent } from '../../list-view-grid'; +import { SkyListToolbarComponent } from '../../list-toolbar'; @Component({ selector: 'sky-test-cmp', @@ -20,4 +21,8 @@ export class ListColumnSelectorActionTestComponent { @ViewChild(SkyListViewGridComponent) public grid: SkyListViewGridComponent; + @ViewChild(SkyListToolbarComponent) + public toolbar: SkyListToolbarComponent; + + public searchText: string; } diff --git a/src/modules/list-column-selector-action/list-column-selector-action.spec.ts b/src/modules/list-column-selector-action/list-column-selector-action.spec.ts index 4805d5a8d..0664edda7 100644 --- a/src/modules/list-column-selector-action/list-column-selector-action.spec.ts +++ b/src/modules/list-column-selector-action/list-column-selector-action.spec.ts @@ -84,14 +84,14 @@ describe('List column selector action', () => { NoopAnimationsModule ] }) - .overrideComponent(SkyListComponent, { - set: { - providers: [ - { provide: ListState, useValue: state }, - { provide: ListStateDispatcher, useValue: dispatcher } - ] - } - }); + .overrideComponent(SkyListComponent, { + set: { + providers: [ + { provide: ListState, useValue: state }, + { provide: ListStateDispatcher, useValue: dispatcher } + ] + } + }); })); beforeEach(() => { @@ -163,6 +163,37 @@ describe('List column selector action', () => { tick(); })); + it('should not clear the search text when new columns are set', fakeAsync(() => { + component.searchText = 'something'; + toggleSecondaryActionsDropdown(); + + const chooseColumnsButton = getChooseColumnsButton(); + chooseColumnsButton.click(); + tick(); + + const checkboxLabelEl = document.querySelectorAll( + '.sky-modal .sky-list-view-checklist-item input' + ) as NodeListOf; + + expect(checkboxLabelEl.length).toBe(2); + + checkboxLabelEl.item(0).click(); + tick(); + + const submitButtonEl = document.querySelector('.sky-modal .sky-btn-primary') as HTMLButtonElement; + + submitButtonEl.click(); + tick(); + + component.grid.gridState.take(1).subscribe((gridState) => { + expect(gridState.displayedColumns.items.length).toBe(2); + expect(component.searchText).toEqual('something'); + }); + + flush(); + tick(); + })); + it('should keep previous columns on cancel', fakeAsync(() => { toggleSecondaryActionsDropdown(); diff --git a/src/modules/list-view-grid/list-view-grid.component.ts b/src/modules/list-view-grid/list-view-grid.component.ts index 19e6734da..67272ce88 100644 --- a/src/modules/list-view-grid/list-view-grid.component.ts +++ b/src/modules/list-view-grid/list-view-grid.component.ts @@ -233,10 +233,13 @@ export class SkyListViewGridComponent ) .filter(c => c !== undefined); - this.dispatcher.searchSetOptions(new ListSearchModel({ - functions: setFunctions, - fieldSelectors: displayedColumns.map(d => d.field) - })); + this.state.take(1).subscribe(s => { + this.dispatcher.searchSetOptions(new ListSearchModel({ + searchText: s.search.searchText, + functions: setFunctions, + fieldSelectors: displayedColumns.map(d => d.field) + })); + }); }); this.subscriptions.push(sub); }