From 5d3f47eacf914d9f471f2094a105253377338138 Mon Sep 17 00:00:00 2001
From: davidcanonieto <david.cano@alfresco.com>
Date: Wed, 6 Mar 2019 13:19:55 +0000
Subject: [PATCH] [ADF-4122] Improve Datatable and fix broken e2e tests (#4398)

* [ADF-4122] Improve Datatable and fix broken e2e tests

* [ADF-4122] Fix e2e element selector
---
 .../app/components/datatable/datatable.component.html    | 2 +-
 .../src/app/components/datatable/datatable.component.ts  | 9 +++++++--
 e2e/pages/adf/dataTablePage.ts                           | 4 ++--
 .../components/datatable/datatable.component.scss        | 4 +++-
 4 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/demo-shell/src/app/components/datatable/datatable.component.html b/demo-shell/src/app/components/datatable/datatable.component.html
index 6c0cbd8ce7..32fca95c03 100644
--- a/demo-shell/src/app/components/datatable/datatable.component.html
+++ b/demo-shell/src/app/components/datatable/datatable.component.html
@@ -10,7 +10,7 @@
     Sticky header
 </mat-slide-toggle>
 
-<div style="height: 300px; overflow-y: auto;">
+<div style="height: 310px; overflow-y: auto;">
     <adf-datatable 
         #dataTable 
         [data]="data"
diff --git a/demo-shell/src/app/components/datatable/datatable.component.ts b/demo-shell/src/app/components/datatable/datatable.component.ts
index 102de1ad40..f979512b80 100644
--- a/demo-shell/src/app/components/datatable/datatable.component.ts
+++ b/demo-shell/src/app/components/datatable/datatable.component.ts
@@ -81,7 +81,12 @@ export class DataTableComponent {
             [
                 {
                     id: 1,
-                    name: 'Name 1',
+                    name: `Lorem ipsum dolor sit amet, consectetur adipiscing elit,
+                            sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+                            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+                            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+                            Excepteur sint occaecat cupidatat non proident,
+                            sunt in culpa qui officia deserunt mollit anim id est laborum.`,
                     createdOn: new Date(2016, 6, 2, 15, 8, 1),
                     createdBy: this._createdBy,
                     icon: 'material-icons://folder_open'
@@ -112,7 +117,7 @@ export class DataTableComponent {
                 { type: 'image', key: 'icon', title: '', srTitle: 'Thumbnail' },
                 { type: 'text', key: 'id', title: 'Id', sortable: true , cssClass: 'adf-ellipsis-cell' },
                 { type: 'text', key: 'createdOn', title: 'Created On', sortable: true, cssClass: 'adf-ellipsis-cell adf-expand-cell-5' },
-                { type: 'text', key: 'name', title: 'Name', cssClass: '', sortable: true },
+                { type: 'text', key: 'name', title: 'Name', cssClass: 'adf-ellipsis-cell', sortable: true },
                 { type: 'text', key: 'createdBy.name', title: 'Created By', sortable: true, cssClass: ''}
             ]
         );
diff --git a/e2e/pages/adf/dataTablePage.ts b/e2e/pages/adf/dataTablePage.ts
index d013596f2b..c9bef6c327 100644
--- a/e2e/pages/adf/dataTablePage.ts
+++ b/e2e/pages/adf/dataTablePage.ts
@@ -65,8 +65,8 @@ export class DataTablePage {
     }
 
     getRowByRowNumber(rowNumber) {
-        Util.waitUntilElementIsVisible(element(by.css(`div[data-automation-id='text_` + rowNumber + `']`)));
-        return element(by.css(`div[data-automation-id='text_` + rowNumber + `']`));
+        Util.waitUntilElementIsVisible(element(by.css(`div[data-automation-id='text_` + rowNumber + `'] span`)));
+        return element(by.css(`div[data-automation-id='text_` + rowNumber + `'] span`));
     }
 
     getRowCheckbox(rowNumber) {
diff --git a/lib/core/datatable/components/datatable/datatable.component.scss b/lib/core/datatable/components/datatable/datatable.component.scss
index 033a488795..99c44e327d 100644
--- a/lib/core/datatable/components/datatable/datatable.component.scss
+++ b/lib/core/datatable/components/datatable/datatable.component.scss
@@ -370,7 +370,7 @@
         }
 
         .adf-ellipsis-cell {
-            overflow: hidden;
+            position: sticky;
             text-overflow: ellipsis;
             white-space: nowrap;
 
@@ -387,6 +387,8 @@
                     white-space: nowrap;
                     display: block;
                     width: calc(100% - 2em);
+                    position: absolute;
+                    margin-top: -10px;
                 }
             }