mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-4933] Adding keydown event on data row to simulate double click when pressing 'enter' key (#5564)
* changing the event on row from keyup to keydown to fix the issue of reopening the file after closing ussing only keyboard (opening and closing the file by enter) * Reverting the 'onRowKeyDown' to not make a breaking change and added a new method to handle the opening file using 'enter' key * Added unit test - it should emit double click if keydown "enter key" on row * Small changes for clean coding
This commit is contained in:
@@ -59,6 +59,7 @@
|
||||
[row]="row"
|
||||
(select)="onEnterKeyPressed(row, $event)"
|
||||
(keyup)="onRowKeyUp(row, $event)"
|
||||
(keydown)="onRowEnterKeyDown(row, $event)"
|
||||
[adf-upload]="allowDropFiles && rowAllowsDrop(row)"
|
||||
[adf-upload-data]="row"
|
||||
[ngStyle]="rowStyle"
|
||||
|
@@ -297,6 +297,34 @@ describe('DataTable', () => {
|
||||
expect(rows[1].getValue('name')).toEqual('test2');
|
||||
});
|
||||
|
||||
it('should double click if keydown "enter key" on row', () => {
|
||||
const event = new KeyboardEvent('keydown', {
|
||||
code: 'Enter',
|
||||
key: 'Enter'
|
||||
} as KeyboardEventInit );
|
||||
const dataRows =
|
||||
[ { name: 'test1'}, { name: 'test2' } ];
|
||||
|
||||
dataTable.data = new ObjectDataTableAdapter([],
|
||||
[new ObjectDataColumn({ key: 'name' })]
|
||||
);
|
||||
|
||||
dataTable.ngOnChanges({
|
||||
rows: new SimpleChange(null, dataRows, false)
|
||||
});
|
||||
|
||||
fixture.detectChanges();
|
||||
dataTable.ngAfterViewInit();
|
||||
|
||||
const rowElement = document.querySelectorAll('.adf-datatable-body .adf-datatable-row')[0];
|
||||
|
||||
spyOn(dataTable.rowDblClick, 'emit');
|
||||
|
||||
rowElement.dispatchEvent(event);
|
||||
|
||||
expect(dataTable.rowDblClick.emit).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should set custom sort order', () => {
|
||||
const dataSortObj = new DataSorting('dummyName', 'asc');
|
||||
const dataRows =
|
||||
|
@@ -474,11 +474,17 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck,
|
||||
this.clickObserver.next(dataRowEvent);
|
||||
}
|
||||
|
||||
onRowKeyUp(row: DataRow, e: KeyboardEvent) {
|
||||
onRowEnterKeyDown(row: DataRow, keyboardEvent: KeyboardEvent) {
|
||||
if (keyboardEvent.key === 'Enter') {
|
||||
this.onKeyboardNavigate(row, keyboardEvent);
|
||||
}
|
||||
}
|
||||
|
||||
onRowKeyUp(row: DataRow, keyboardEvent: KeyboardEvent) {
|
||||
const event = new CustomEvent('row-keyup', {
|
||||
detail: {
|
||||
row: row,
|
||||
keyboardEvent: e,
|
||||
keyboardEvent: keyboardEvent,
|
||||
sender: this
|
||||
},
|
||||
bubbles: true
|
||||
@@ -487,11 +493,7 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck,
|
||||
this.elementRef.nativeElement.dispatchEvent(event);
|
||||
|
||||
if (event.defaultPrevented) {
|
||||
e.preventDefault();
|
||||
} else {
|
||||
if (e.key === 'Enter') {
|
||||
this.onKeyboardNavigate(row, e);
|
||||
}
|
||||
keyboardEvent.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user