Skip to content

Commit 753fc20

Browse files
committed
unit test progress
1 parent ddac0ba commit 753fc20

File tree

8 files changed

+85
-12
lines changed

8 files changed

+85
-12
lines changed

src/cdk-experimental/column-resize/column-resize-directives/default-enabled-column-resize-flex.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import {Directive, ElementRef, NgZone} from '@angular/core';
1010
import {Directionality} from '@angular/cdk/bidi';
1111

1212
import {ColumnResize} from '../column-resize';
13-
import {ColumnResizeNotifierSource} from '../column-resize-notifier';
13+
import {ColumnResizeNotifier, ColumnResizeNotifierSource} from '../column-resize-notifier';
1414
import {HeaderRowEventDispatcher} from '../event-dispatcher';
1515
import {HOST_BINDINGS, FLEX_PROVIDERS} from './constants';
1616

@@ -24,6 +24,7 @@ import {HOST_BINDINGS, FLEX_PROVIDERS} from './constants';
2424
})
2525
export class CdkDefaultEnabledColumnResizeFlex extends ColumnResize {
2626
constructor(
27+
readonly columnResizeNotifier: ColumnResizeNotifier,
2728
readonly directionality: Directionality,
2829
protected readonly elementRef: ElementRef,
2930
protected readonly eventDispatcher: HeaderRowEventDispatcher,

src/cdk-experimental/column-resize/column-resize-directives/default-enabled-column-resize.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import {Directive, ElementRef, NgZone} from '@angular/core';
1010
import {Directionality} from '@angular/cdk/bidi';
1111

1212
import {ColumnResize} from '../column-resize';
13-
import {ColumnResizeNotifierSource} from '../column-resize-notifier';
13+
import {ColumnResizeNotifier, ColumnResizeNotifierSource} from '../column-resize-notifier';
1414
import {HeaderRowEventDispatcher} from '../event-dispatcher';
1515
import {HOST_BINDINGS, TABLE_PROVIDERS} from './constants';
1616

@@ -24,6 +24,7 @@ import {HOST_BINDINGS, TABLE_PROVIDERS} from './constants';
2424
})
2525
export class CdkDefaultEnabledColumnResize extends ColumnResize {
2626
constructor(
27+
readonly columnResizeNotifier: ColumnResizeNotifier,
2728
readonly directionality: Directionality,
2829
protected readonly elementRef: ElementRef,
2930
protected readonly eventDispatcher: HeaderRowEventDispatcher,

src/cdk-experimental/column-resize/column-resize.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {filter, map, mapTo, pairwise, startWith, take, takeUntil} from 'rxjs/ope
1313

1414
import {closest, matches} from '../popover-edit/polyfill';
1515

16-
import {ColumnResizeNotifierSource} from './column-resize-notifier';
16+
import {ColumnResizeNotifier, ColumnResizeNotifierSource} from './column-resize-notifier';
1717
import {HEADER_CELL_SELECTOR, RESIZE_OVERLAY_SELECTOR} from './constants';
1818
import {HeaderRowEventDispatcher} from './event-dispatcher';
1919

@@ -22,9 +22,12 @@ const WITH_RESIZED_COLUMN_CLASS = 'cdk-column-resize-with-resized-column';
2222

2323
let nextId = 0;
2424

25-
export abstract class ColumnResize implements AfterViewInit, OnDestroy {
25+
export abstract class ColumnResize implements AfterViewInit, OnDestroy, OnInit {
2626
protected readonly destroyed = new ReplaySubject<void>();
2727

28+
/* Publicly accessible interface for triggering and being notified of resizes. */
29+
abstract readonly columnResizeNotifier: ColumnResizeNotifier;
30+
2831
abstract readonly directionality: Directionality;
2932
protected abstract readonly elementRef: ElementRef;
3033
protected abstract readonly eventDispatcher: HeaderRowEventDispatcher;

src/material-experimental/column-resize/column-resize-directives/column-resize-flex.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {Directive, ElementRef, NgZone} from '@angular/core';
22
import {Directionality} from '@angular/cdk/bidi';
33
import {
44
ColumnResize,
5+
ColumnResizeNotifier,
56
ColumnResizeNotifierSource,
67
HeaderRowEventDispatcher,
78
} from '@angular/cdk-experimental/column-resize';
@@ -18,6 +19,7 @@ import {AbstractMatColumnResize, FLEX_HOST_BINDINGS, FLEX_PROVIDERS} from './com
1819
})
1920
export class MatColumnResizeFlex extends AbstractMatColumnResize {
2021
constructor(
22+
readonly columnResizeNotifier: ColumnResizeNotifier,
2123
readonly directionality: Directionality,
2224
protected readonly elementRef: ElementRef,
2325
protected readonly eventDispatcher: HeaderRowEventDispatcher,

src/material-experimental/column-resize/column-resize-directives/column-resize.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {Directive, ElementRef, NgZone} from '@angular/core';
22
import {Directionality} from '@angular/cdk/bidi';
33
import {
44
ColumnResize,
5+
ColumnResizeNotifier,
56
ColumnResizeNotifierSource,
67
HeaderRowEventDispatcher,
78
} from '@angular/cdk-experimental/column-resize';
@@ -18,6 +19,7 @@ import {AbstractMatColumnResize, TABLE_HOST_BINDINGS, TABLE_PROVIDERS} from './c
1819
})
1920
export class MatColumnResize extends AbstractMatColumnResize {
2021
constructor(
22+
readonly columnResizeNotifier: ColumnResizeNotifier,
2123
readonly directionality: Directionality,
2224
protected readonly elementRef: ElementRef,
2325
protected readonly eventDispatcher: HeaderRowEventDispatcher,

src/material-experimental/column-resize/column-resize-directives/default-enabled-column-resize-flex.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {Directive, ElementRef, NgZone} from '@angular/core';
22
import {Directionality} from '@angular/cdk/bidi';
33
import {
44
ColumnResize,
5+
ColumnResizeNotifier,
56
ColumnResizeNotifierSource,
67
HeaderRowEventDispatcher,
78
} from '@angular/cdk-experimental/column-resize';
@@ -18,6 +19,7 @@ import {AbstractMatColumnResize, FLEX_HOST_BINDINGS, FLEX_PROVIDERS} from './com
1819
})
1920
export class MatDefaultEnabledColumnResizeFlex extends AbstractMatColumnResize {
2021
constructor(
22+
readonly columnResizeNotifier: ColumnResizeNotifier,
2123
readonly directionality: Directionality,
2224
protected readonly elementRef: ElementRef,
2325
protected readonly eventDispatcher: HeaderRowEventDispatcher,

src/material-experimental/column-resize/column-resize-directives/default-enabled-column-resize.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {Directive, ElementRef, NgZone} from '@angular/core';
22
import {Directionality} from '@angular/cdk/bidi';
33
import {
44
ColumnResize,
5+
ColumnResizeNotifier,
56
ColumnResizeNotifierSource,
67
HeaderRowEventDispatcher,
78
} from '@angular/cdk-experimental/column-resize';
@@ -18,6 +19,7 @@ import {AbstractMatColumnResize, TABLE_HOST_BINDINGS, TABLE_PROVIDERS} from './c
1819
})
1920
export class MatDefaultEnabledColumnResize extends AbstractMatColumnResize {
2021
constructor(
22+
readonly columnResizeNotifier: ColumnResizeNotifier,
2123
readonly directionality: Directionality,
2224
protected readonly elementRef: ElementRef,
2325
protected readonly eventDispatcher: HeaderRowEventDispatcher,

src/material-experimental/column-resize/column-resize.spec.ts

Lines changed: 68 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ function test() {
1313
return 'string!';
1414
}
1515

16+
const MOUSE_START_OFFSET = 1000;
17+
1618
/*const flexTemplate = `
1719
<mat-table [dir]="direction" [dataSource]="dataSource">
1820
<!-- Position Column -->
@@ -143,27 +145,57 @@ abstract class BaseTestComponent {
143145
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
144146
dataSource = new ElementDataSource();
145147
direction = 'ltr';
146-
/*
147-
getColumnSize(index: number): number {
148148

149+
getColumnElement(index: number): HTMLElement {
150+
return querySelectorAll('.mat-resizable')[index] as HTMLElement;
151+
}
152+
153+
getColumnWidth(index: number): number {
154+
return this.getColumnElement().offsetWidth;
155+
}
156+
157+
triggerHoverState(): void {
158+
const headerRow = this.table.nativeElement.querySelector('.mat-header-row');
159+
headerRow.dispatchEvent(new Event('mouseover', {bubbles: true}));
149160
}
150161

151-
triggerHoverState() {
152-
const row = this.table.nativeElement.querySelector('.mat-header-row');
153-
row.dispatchEvent(new Event('mouseover', {bubbles: true}));
162+
endHoverState(): void {
163+
const dataRow = this.table.nativeElement.querySelector('.mat-row');
164+
dataRow.dispatchEvent(new Event('mouseover', {bubbles: true}));
165+
}
166+
167+
getOverlayThumbElement(index: number): HTMLElement {
168+
return querySelectorAll('.mat-column-resize-overlay-thumb')[index] as HTMLElement;
154169
}
155170

156171
beginColumnResizeWithMouse(index: number): void {
172+
this.triggerHoverState();
173+
174+
this.getOverlayThumbElement(index).dispatchEvent(new MouseEvent('mousedown', {
175+
bubbles: true,
176+
pageX: MOUSE_START_OFFSET,
177+
}));
157178
}
158179

159-
updateResizeWithMouseInProgress(index: number, delta: number): void {
180+
updateResizeWithMouseInProgress(index: number, totalDelta: number): void {
181+
document.dispatchEvent(new MouseEvent('mousemove', {
182+
bubbles: true,
183+
pageX: MOUSE_START_OFFSET + totalDelta,
184+
}));
160185
}
161186

162-
completeResizeWithMouseInProgress(index: number): void {
187+
completeResizeWithMouseInProgress(index: number, totalDelta: number): void {
188+
document.dispatchEvent(new MouseEvent('mouseup', {
189+
bubbles: true,
190+
pageX: MOUSE_START_OFFSET + totalDelta,
191+
}));
163192
}
164193

165194
resizeColumnWithMouse(index: number, resizeDelta: number): void {
166-
}*/
195+
this.beginColumnResizeWithMouse(index);
196+
this.updateResizeWithMouseInProgress(index, resizeDelta);
197+
this.completeResizeWithMouseInProgress(index, resizeDelta);
198+
}
167199
}
168200
/*
169201
abstract class BaseTestComponentRtl extends BaseTestComponent {
@@ -235,6 +267,34 @@ fdescribe('Material Popover Edit', () => {
235267
// throwing `querySelector` calls.
236268
overlayContainer.ngOnDestroy();
237269
});
270+
271+
it('applies max and min width limits at startup', () => {
272+
273+
});
274+
275+
it('shows resize handle overlays on header row hover and while a resize handle is in use',
276+
() => {
277+
278+
});
279+
280+
it('resizes the target column via mouse input', () => {
281+
282+
});
283+
284+
it('cancels an active mouse resize with the escape key', () => {
285+
});
286+
287+
it('notifies subscribers of a completed resize via ColumnResizeNotifier', () => {
288+
289+
});
290+
291+
it('does not notify subscribers of a canceled resize', () => {
292+
293+
});
294+
295+
it('performs a column resize triggered via ColumnResizeNotifier', () => {
296+
297+
});
238298
});
239299
}
240300
});

0 commit comments

Comments
 (0)