Skip to content

test(table): remove redundant test #15273

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Feb 21, 2019
Merged

test(table): remove redundant test #15273

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
225 changes: 92 additions & 133 deletions src/cdk/table/table.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@ describe('CdkTable', () => {
let component: any;
let tableElement: HTMLElement;

function createComponent<T>(componentType: Type<T>, declarations: any[] = []):
ComponentFixture<T> {
function createComponent<T>(
componentType: Type<T>, declarations: any[] = []): ComponentFixture<T> {
TestBed.configureTestingModule({
imports: [CdkTableModule, BidiModule],
declarations: [componentType, ...declarations],
Expand Down Expand Up @@ -306,28 +306,6 @@ describe('CdkTable', () => {
]);
});

it('should be able to render and change multiple header and footer rows', () => {
setupTableTestApp(MultipleHeaderFooterRowsCdkTableApp);
fixture.detectChanges();

expectTableToMatchContent(tableElement, [
['first-header'],
['second-header'],
['first-footer'],
['second-footer'],
]);

component.showAlternativeHeadersAndFooters = true;
fixture.detectChanges();

expectTableToMatchContent(tableElement, [
['first-header'],
['second-header'],
['first-footer'],
['second-footer'],
]);
});

it('should be able to project a caption', fakeAsync(() => {
setupTableTestApp(NativeHtmlTableWithCaptionApp);
fixture.detectChanges();
Expand Down Expand Up @@ -447,8 +425,7 @@ describe('CdkTable', () => {
it('should throw an error if the data source is not valid', () => {
component.dataSource = {invalid: 'dataSource'};

expect(() => fixture.detectChanges())
.toThrowError(getTableUnknownDataSourceError().message);
expect(() => fixture.detectChanges()).toThrowError(getTableUnknownDataSourceError().message);
});

it('should throw an error if the data source is not valid', () => {
Expand Down Expand Up @@ -526,8 +503,7 @@ describe('CdkTable', () => {
const rowGroups: HTMLElement[] = Array.from(thisTableElement.querySelectorAll('thead, tfoot'));
expect(rowGroups.length).toBe(2, 'Expected table to have a thead and tfoot');
for (const group of rowGroups) {
expect(group.style.display)
.toBe('none', 'Expected thead and tfoot to be `display: none`');
expect(group.style.display).toBe('none', 'Expected thead and tfoot to be `display: none`');
}
});

Expand Down Expand Up @@ -566,15 +542,15 @@ describe('CdkTable', () => {
});

it('should throw an error if a column definition is requested but not defined after render',
fakeAsync(() => {
const columnDefinitionMissingAfterRenderFixture =
createComponent(MissingColumnDefAfterRenderCdkTableApp);
expect(() => {
columnDefinitionMissingAfterRenderFixture.detectChanges();
flush();
columnDefinitionMissingAfterRenderFixture.detectChanges();
}).toThrowError(getTableUnknownColumnError('column_a').message);
}));
fakeAsync(() => {
const columnDefinitionMissingAfterRenderFixture =
createComponent(MissingColumnDefAfterRenderCdkTableApp);
expect(() => {
columnDefinitionMissingAfterRenderFixture.detectChanges();
flush();
columnDefinitionMissingAfterRenderFixture.detectChanges();
}).toThrowError(getTableUnknownColumnError('column_a').message);
}));

it('should throw an error if the row definitions are missing', () => {
expect(() => createComponent(MissingAllRowDefsCdkTableApp).detectChanges())
Expand Down Expand Up @@ -660,18 +636,18 @@ describe('CdkTable', () => {
});

it('should error if there is row data that does not have a matching row template',
fakeAsync(() => {
const whenRowWithoutDefaultFixture = createComponent(WhenRowWithoutDefaultCdkTableApp);
const data = whenRowWithoutDefaultFixture.componentInstance.dataSource.data;
expect(() => {
try {
whenRowWithoutDefaultFixture.detectChanges();
flush();
} catch {
flush();
}
}).toThrowError(getTableMissingMatchingRowDefError(data[0]).message);
}));
fakeAsync(() => {
const whenRowWithoutDefaultFixture = createComponent(WhenRowWithoutDefaultCdkTableApp);
const data = whenRowWithoutDefaultFixture.componentInstance.dataSource.data;
expect(() => {
try {
whenRowWithoutDefaultFixture.detectChanges();
flush();
} catch {
flush();
}
}).toThrowError(getTableMissingMatchingRowDefError(data[0]).message);
}));

it('should fail when multiple rows match data without multiTemplateDataRows', fakeAsync(() => {
let whenFixture = createComponent(WhenRowMultipleDefaultsCdkTableApp);
Expand Down Expand Up @@ -717,40 +693,40 @@ describe('CdkTable', () => {
});

it('should have the correct data and row indicies when data contains multiple instances of ' +
'the same object instance', () => {
setupTableTestApp(WhenRowCdkTableApp);
component.multiTemplateDataRows = true;
component.showIndexColumns();

const obj = {value: true};
component.dataSource.data = [obj, obj, obj, obj];
fixture.detectChanges();

expectTableToMatchContent(tableElement, [
['Index', 'Data Index', 'Render Index'],
['', '0', '0'],
['', '1', '1'],
['', '1', '2'],
['', '2', '3'],
['', '3', '4'],
]);

// Push unique data on the front and add another obj to the array
component.dataSource.data = [{value: false}, obj, obj, obj, obj, obj];
fixture.detectChanges();

expectTableToMatchContent(tableElement, [
['Index', 'Data Index', 'Render Index'],
['', '0', '0'],
['', '1', '1'],
['', '1', '2'],
['', '2', '3'],
['', '3', '4'],
['', '4', '5'],
['', '5', '6'],
]);

});
'the same object instance',
() => {
setupTableTestApp(WhenRowCdkTableApp);
component.multiTemplateDataRows = true;
component.showIndexColumns();

const obj = {value: true};
component.dataSource.data = [obj, obj, obj, obj];
fixture.detectChanges();

expectTableToMatchContent(tableElement, [
['Index', 'Data Index', 'Render Index'],
['', '0', '0'],
['', '1', '1'],
['', '1', '2'],
['', '2', '3'],
['', '3', '4'],
]);

// Push unique data on the front and add another obj to the array
component.dataSource.data = [{value: false}, obj, obj, obj, obj, obj];
fixture.detectChanges();

expectTableToMatchContent(tableElement, [
['Index', 'Data Index', 'Render Index'],
['', '0', '0'],
['', '1', '1'],
['', '1', '2'],
['', '2', '3'],
['', '3', '4'],
['', '4', '5'],
['', '5', '6'],
]);
});
});
});

Expand All @@ -774,8 +750,7 @@ describe('CdkTable', () => {
});
}

function expectStickyStyles(
element: any, zIndex: string, directions: PositionDirections = {}) {
function expectStickyStyles(element: any, zIndex: string, directions: PositionDirections = {}) {
expect(element.style.position).toContain('sticky');
expect(element.style.zIndex).toBe(zIndex, `Expected zIndex to be ${zIndex}`);

Expand Down Expand Up @@ -820,8 +795,8 @@ describe('CdkTable', () => {

expectStickyStyles(headerRows[0], '100', {top: '0px'});
expectNoStickyStyles([headerRows[1]]);
expectStickyStyles(headerRows[2], '100',
{top: headerRows[0].getBoundingClientRect().height + 'px'});
expectStickyStyles(
headerRows[2], '100', {top: headerRows[0].getBoundingClientRect().height + 'px'});

component.stickyHeaders = [];
fixture.detectChanges();
Expand All @@ -832,8 +807,8 @@ describe('CdkTable', () => {
component.stickyFooters = ['footer-1', 'footer-3'];
fixture.detectChanges();

expectStickyStyles(footerRows[0], '10',
{bottom: footerRows[1].getBoundingClientRect().height + 'px'});
expectStickyStyles(
footerRows[0], '10', {bottom: footerRows[1].getBoundingClientRect().height + 'px'});
expectNoStickyStyles([footerRows[1]]);
expectStickyStyles(footerRows[2], '10', {bottom: '0px'});

Expand Down Expand Up @@ -1200,8 +1175,8 @@ describe('CdkTable', () => {
mutateData();

// Change each item reference to show that the trackby is not checking the item properties.
component.dataSource.data = component.dataSource.data
.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));
component.dataSource.data =
component.dataSource.data.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));

// Expect that all the rows are considered new since their references are all different
const changedRows = getRows(tableElement);
Expand All @@ -1217,8 +1192,8 @@ describe('CdkTable', () => {

// Change each item reference to show that the trackby is checking the item properties.
// Otherwise this would cause them all to be removed/added.
component.dataSource.data = component.dataSource.data
.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));
component.dataSource.data =
component.dataSource.data.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));

// Expect that the first and second rows were swapped and that the last row is new
const changedRows = getRows(tableElement);
Expand All @@ -1234,8 +1209,8 @@ describe('CdkTable', () => {

// Change each item reference to show that the trackby is checking the index.
// Otherwise this would cause them all to be removed/added.
component.dataSource.data = component.dataSource.data
.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));
component.dataSource.data =
component.dataSource.data.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));

// Expect first two to be the same since they were swapped but indicies are consistent.
// The third element was removed and caught by the table so it was removed before another
Expand All @@ -1256,8 +1231,8 @@ describe('CdkTable', () => {

// Change each item reference to show that the trackby is checking the index.
// Otherwise this would cause them all to be removed/added.
component.dataSource.data = component.dataSource.data
.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));
component.dataSource.data =
component.dataSource.data.map((item: TestData) => ({a: item.a, b: item.b, c: item.c}));

// Expect the rows were given the right implicit data even though the rows were not moved.
fixture.detectChanges();
Expand Down Expand Up @@ -1396,13 +1371,19 @@ interface TestData {
class FakeDataSource extends DataSource<TestData> {
isConnected = false;

get data() { return this._dataChange.getValue(); }
set data(data: TestData[]) { this._dataChange.next(data); }
get data() {
return this._dataChange.getValue();
}
set data(data: TestData[]) {
this._dataChange.next(data);
}
_dataChange = new BehaviorSubject<TestData[]>([]);

constructor() {
super();
for (let i = 0; i < 3; i++) { this.addData(); }
for (let i = 0; i < 3; i++) {
this.addData();
}
}

connect(collectionViewer: CollectionViewer) {
Expand Down Expand Up @@ -1436,7 +1417,7 @@ class BooleanDataSource extends DataSource<boolean> {
return this._dataChange;
}

disconnect() { }
disconnect() {}
}

@Component({
Expand Down Expand Up @@ -1561,40 +1542,14 @@ class NullDataCdkTableApp {
<td cdk-footer-cell *cdkFooterCellDef> second-footer </td>
</ng-container>

<ng-container *ngIf="!showAlternativeHeadersAndFooters">
<tr cdk-header-row *cdkHeaderRowDef="['first-header']"></tr>
<tr cdk-header-row *cdkHeaderRowDef="['second-header']"></tr>
<tr cdk-footer-row *cdkFooterRowDef="['first-footer']"></tr>
<tr cdk-footer-row *cdkFooterRowDef="['second-footer']"></tr>
</ng-container>

<ng-container cdkColumnDef="alt-first-header">
<th cdk-header-cell *cdkHeaderCellDef> alt-first-header </th>
</ng-container>

<ng-container cdkColumnDef="alt-second-header">
<th cdk-header-cell *cdkHeaderCellDef> alt-second-header </th>
</ng-container>

<ng-container cdkColumnDef="alt-first-footer">
<td cdk-footer-cell *cdkFooterCellDef> alt-first-footer </td>
</ng-container>

<ng-container cdkColumnDef="alt-second-footer">
<td cdk-footer-cell *cdkFooterCellDef> alt-second-footer </td>
</ng-container>

<ng-container *ngIf="showAlternativeHeadersAndFooters">
<tr cdk-header-row *cdkHeaderRowDef="['alt-first-header']"></tr>
<tr cdk-header-row *cdkHeaderRowDef="['alt-second-header']"></tr>
<tr cdk-footer-row *cdkFooterRowDef="['alt-first-footer']"></tr>
<tr cdk-footer-row *cdkFooterRowDef="['alt-second-footer']"></tr>
</ng-container>
<tr cdk-header-row *cdkHeaderRowDef="['first-header']"></tr>
<tr cdk-header-row *cdkHeaderRowDef="['second-header']"></tr>
<tr cdk-footer-row *cdkFooterRowDef="['first-footer']"></tr>
<tr cdk-footer-row *cdkFooterRowDef="['second-footer']"></tr>
</cdk-table>
`
})
class MultipleHeaderFooterRowsCdkTableApp {
showAlternativeHeadersAndFooters = false;
}

@Component({
Expand Down Expand Up @@ -1656,7 +1611,9 @@ class WhenRowCdkTableApp {
isIndex1 = (index: number, _rowData: TestData) => index == 1;
hasC3 = (_index: number, rowData: TestData) => rowData.c == 'c_3';

constructor() { this.dataSource.addData(); }
constructor() {
this.dataSource.addData();
}

@ViewChild(CdkTable) table: CdkTable<TestData>;

Expand Down Expand Up @@ -2030,7 +1987,9 @@ class MissingColumnDefAfterRenderCdkTableApp implements AfterViewInit {
displayedColumns: string[] = [];

ngAfterViewInit() {
setTimeout(() => { this.displayedColumns = ['column_a']; }, 0);
setTimeout(() => {
this.displayedColumns = ['column_a'];
}, 0);
}
}

Expand Down