@angular/cdk/scrolling#ViewportRuler TypeScript Examples
The following examples show how to use
@angular/cdk/scrolling#ViewportRuler.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: tab-header.component.spec.ts From alauda-ui with MIT License | 5 votes |
describe('TabHeaderComponent', () => {
const change = new Subject();
let fixture: ComponentFixture<SimpleTabHeaderAppComponent>;
let appComponent: SimpleTabHeaderAppComponent;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CommonModule, PortalModule, IconModule],
declarations: [
TabHeaderComponent,
TabHeaderActiveIndicatorComponent,
TabLabelWrapperDirective,
SimpleTabHeaderAppComponent,
],
providers: [
ViewportRuler,
{
provide: Directionality,
useFactory: () => ({ value: 'ltr', change: change.asObservable() }),
},
],
});
});
describe('pagination', () => {
beforeEach(() => {
fixture = TestBed.createComponent(SimpleTabHeaderAppComponent);
fixture.detectChanges();
appComponent = fixture.componentInstance;
});
// FIXME: looks like JSDom does not work properly with offsetWidth?
// eslint-disable-next-line jest/no-disabled-tests
it.skip('should show width when tab list width exceeds container', () => {
fixture.detectChanges();
expect(appComponent.tabHeader._showPaginationControls).toBe(false);
// Add enough tabs that it will obviously exceed the width
appComponent.addTabsForScrolling();
fixture.detectChanges();
fixture.detectChanges();
expect(appComponent.tabHeader._showPaginationControls).toBe(true);
});
});
});
Example #2
Source File: tab-header.component.ts From alauda-ui with MIT License | 5 votes |
constructor(
private readonly _changeDetectorRef: ChangeDetectorRef,
private readonly _viewportRuler: ViewportRuler,
) {}