[ADF-2322] Card view datatable and documentlist (#2968)

* move table in style

* Enable the cardview mode

* add button in demo shell to change view
add missing translation terms toolbar

* missing comma

* add example in demo shell

* style loading and images

* border card container

* document list tests

* test check class and input

* test fix

* fix test process services

* more documentation

* rirpristinate base pacakge integgration

* remove test color
This commit is contained in:
Eugenio Romano
2018-02-21 09:57:01 +00:00
committed by GitHub
parent ff887772e3
commit 62d5dd1b30
25 changed files with 699 additions and 273 deletions

View File

@@ -51,6 +51,86 @@ describe('DataTable', () => {
element = fixture.debugElement.nativeElement;
});
it('should use the cardview style if cardview is true', () => {
let newData = new ObjectDataTableAdapter(
[
{ name: '1' },
{ name: '2' }
],
[new ObjectDataColumn({ key: 'name' })]
);
dataTable.cardview = true;
dataTable.ngOnChanges({
data: new SimpleChange(null, newData, false)
});
fixture.detectChanges();
expect(element.querySelector('.adf-data-table-card')).not.toBeNull();
expect(element.querySelector('.adf-data-table')).toBeNull();
});
it('should use the cardview style if cardview is false', () => {
let newData = new ObjectDataTableAdapter(
[
{ name: '1' },
{ name: '2' }
],
[new ObjectDataColumn({ key: 'name' })]
);
dataTable.cardview = false;
dataTable.ngOnChanges({
data: new SimpleChange(null, newData, false)
});
fixture.detectChanges();
expect(element.querySelector('.adf-data-table-card')).toBeNull();
expect(element.querySelector('.adf-data-table')).not.toBeNull();
});
it('should hide the header if showHeader is false', () => {
let newData = new ObjectDataTableAdapter(
[
{ name: '1' },
{ name: '2' }
],
[new ObjectDataColumn({ key: 'name' })]
);
dataTable.showHeader = false;
dataTable.loading = false;
dataTable.ngOnChanges({
data: new SimpleChange(null, newData, false)
});
fixture.detectChanges();
expect(element.querySelector('.adf-datatable-header')).toBe(null);
});
it('should show the header if showHeader is true', () => {
let newData = new ObjectDataTableAdapter(
[
{ name: '1' },
{ name: '2' }
],
[new ObjectDataColumn({ key: 'name' })]
);
dataTable.showHeader = true;
dataTable.loading = false;
dataTable.ngOnChanges({
data: new SimpleChange(null, newData, false)
});
fixture.detectChanges();
expect(element.querySelector('.adf-datatable-header')).toBeDefined();
});
it('should emit "sorting-changed" DOM event', (done) => {
const column = new ObjectDataColumn({ key: 'name', sortable: true, direction: 'asc' });
dataTable.data = new ObjectDataTableAdapter(
@@ -206,32 +286,40 @@ describe('DataTable', () => {
});
it('should put actions menu to the right by default', () => {
dataTable.data = new ObjectDataTableAdapter([], [
<DataColumn> {},
<DataColumn> {},
<DataColumn> {}
]);
dataTable.data = new ObjectDataTableAdapter(
[
{ name: '1' },
{ name: '2' },
{ name: '3' },
{ name: '4' }
],
[new ObjectDataColumn({ key: 'name' })]
);
dataTable.actions = true;
fixture.detectChanges();
let headers = element.querySelectorAll('th');
expect(headers.length).toBe(4);
expect(headers[headers.length - 1].classList.contains('actions-column')).toBeTruthy();
let actions = element.querySelectorAll('[id^=action_menu_right]');
expect(actions.length).toBe(4);
});
it('should put actions menu to the left', () => {
dataTable.data = new ObjectDataTableAdapter([], [
<DataColumn> {},
<DataColumn> {},
<DataColumn> {}
]);
dataTable.data = new ObjectDataTableAdapter(
[
{ name: '1' },
{ name: '2' },
{ name: '3' },
{ name: '4' }
],
[new ObjectDataColumn({ key: 'name' })]
);
dataTable.actions = true;
dataTable.actionsPosition = 'left';
fixture.detectChanges();
let headers = element.querySelectorAll('th');
expect(headers.length).toBe(4);
expect(headers[0].classList.contains('actions-column')).toBeTruthy();
let actions = element.querySelectorAll('[id^=action_menu_left]');
expect(actions.length).toBe(4);
});
it('should initialize default adapter', () => {