[ADF-1626] Fix double tabbing issue in datatable (#2416)

* Fix double tabbing issue in datatable

* Fix accessibility issue for process list

ng2-components/ng2-activiti-processlist/src/components/processlist.component.html

@@ -3,7 +3,8 @@
     <adf-datatable
         [data]="data"
         [loading]="isLoading"
-        (rowClick)="onRowClick($event)">
+        (rowClick)="onRowClick($event)"
+        (row-keyup)="onRowKeyUp($event)">
         <loading-content-template>
             <ng-template>
                 <!--Add your custom loading template here-->

ng2-components/ng2-activiti-processlist/src/components/processlist.component.spec.ts

@@ -278,6 +278,40 @@ describe('ProcessInstanceListComponent', () => {
         component.onRowClick(rowEvent);
     });
 
+    it('should emit row click event on Enter', (done) => {
+        let prevented = false;
+        let keyEvent = new CustomEvent('Keyboard event', { detail: {
+            keyboardEvent: { key: 'Enter' },
+            row: new ObjectDataRow({ id: 999 })
+        }});
+
+        spyOn(keyEvent, 'preventDefault').and.callFake(() => prevented = true);
+
+        component.rowClick.subscribe(taskId => {
+            expect(taskId).toEqual(999);
+            expect(component.getCurrentId()).toEqual(999);
+            expect(prevented).toBeTruthy();
+            done();
+        });
+
+        component.onRowKeyUp(keyEvent);
+    });
+
+    it('should NOT emit row click event on every other key', async(() => {
+        let triggered = false;
+        let keyEvent = new CustomEvent('Keyboard event', { detail: {
+            keyboardEvent: { key: 'Space' },
+            row: new ObjectDataRow({ id: 999 })
+        }});
+
+        component.rowClick.subscribe(() => triggered = true);
+        component.onRowKeyUp(keyEvent);
+
+        fixture.whenStable().then(() => {
+            expect(triggered).toBeFalsy();
+        });
+    }));
+
     describe('component changes', () => {
 
         beforeEach(() => {

ng2-components/ng2-activiti-processlist/src/components/processlist.component.ts

@@ -235,6 +235,18 @@ export class ProcessInstanceListComponent implements OnChanges, AfterContentInit
         this.rowClick.emit(this.currentInstanceId);
     }
 
+    /**
+     * Emit the event rowClick passing the current task id when pressed the Enter key on the selected row
+     * @param event
+     */
+    onRowKeyUp(event: CustomEvent) {
+        if (event.detail.keyboardEvent.key === 'Enter') {
+            event.preventDefault();
+            this.currentInstanceId = event.detail.row.getValue('id');
+            this.rowClick.emit(this.currentInstanceId);
+        }
+    }
+
     /**
      * Optimize name field
      * @param instances

ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html

@@ -36,7 +36,6 @@
     <tbody>
     <ng-container *ngIf="!loading">
         <tr *ngFor="let row of data.getRows(); let idx = index"
-            tabindex="0"
             role="button"
             [class.is-selected]="row.isSelected"
             [adf-upload]="allowDropFiles && rowAllowsDrop(row)" [adf-upload-data]="row"