mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[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:
@@ -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', () => {
|
||||
|
Reference in New Issue
Block a user