alfresco-ng2-components/lib/core/directives/infinite-select-scroll.directive.spec.ts
Cilibiu Bogdan 8471fe40a5
[ADF-5311] Extract infinite select scroll loading logic to a reusable component (#6536)
* move translation to core

* select scroll directive

* register directive

* add infinite scroll directive

* clean up component and aditional logic

* use  waitForAsync over async

* update docs

* change output emitter name

* revert to async

* restore default value;

* test
2021-01-15 11:35:39 +00:00

83 lines
2.5 KiB
TypeScript

/*!
* @license
* Copyright 2019 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component, ViewChild } from '@angular/core';
import { ComponentFixture, fakeAsync, flush, TestBed } from '@angular/core/testing';
import { InfiniteSelectScrollDirective } from './infinite-select-scroll.directive';
import { setupTestBed } from '../testing/setup-test-bed';
import { MatSelect, MatSelectModule } from '@angular/material/select';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@Component({
template: `
<mat-select adf-infinite-select-scroll (scrollEnd)="load()" >
<mat-option *ngFor="let option of options; let idx=index">
{{ option.text }}
</mat-option>
</mat-select>`
})
class TestComponent {
options = new Array(50).fill({text: 'dummy'});
@ViewChild(MatSelect, { static: true })
matSelect: MatSelect;
open() {
this.matSelect.open();
}
load() {
this.options.push(...new Array(10).fill({text: 'dummy'}));
}
}
describe('InfiniteSelectScrollDirective', () => {
let fixture: ComponentFixture<TestComponent>;
let component: TestComponent;
setupTestBed({
imports: [
MatSelectModule,
NoopAnimationsModule
],
declarations: [
TestComponent,
InfiniteSelectScrollDirective
]
});
beforeEach(() => {
fixture = TestBed.createComponent(TestComponent);
component = fixture.componentInstance;
});
beforeEach(fakeAsync(() => {
fixture.detectChanges();
component.open();
fixture.detectChanges();
flush();
}));
it('should call an action on scrollEnd event', fakeAsync(() => {
const panel = document.querySelector('.mat-select-panel') as HTMLElement;
panel.scrollTop = panel.scrollHeight;
panel.dispatchEvent(new Event('scroll'));
fixture.detectChanges();
expect(component.options.length).toBe(60);
}));
});