[ADF-4394]Add two more tests on copyContent (#4630)

* Add two more tests

* Update data-table-component.page.ts

* Fix lint issues

demo-shell/src/app/components/datatable/copy-content/datatable.component.html

@@ -18,6 +18,7 @@
             <data-column key="id" title="Id" [copyContent]="true"></data-column>
             <data-column key="name" title="Name" class="adf-full-width name-column" [copyContent]="false"></data-column>
             <data-column key="createdBy" title="Created By"></data-column>
+            <data-column key="json" type="json" title="Json" [copyContent]="true"></data-column>
         </data-columns>
     </adf-datatable>
 </div>

demo-shell/src/app/components/datatable/copy-content/datatable.component.ts

@@ -60,17 +60,26 @@ export class DataTableComponent {
         {
             id: 1,
             name: 'First',
-            createdBy: 'Created one'
+            createdBy: 'Created one',
+            json: null
         },
         {
             id: 2,
             name: 'Second',
-            createdBy: 'Created two'
+            createdBy: 'Created two',
+            json: {
+                id: 4
+            }
         },
         {
             id: 3,
             name: 'Third',
-            createdBy: 'Created three'
+            createdBy: 'Created three',
+            json: {
+                id: 4,
+                name: 'Image 8',
+                createdOn: new Date(2016, 6, 2, 15, 8, 4)
+            }
         }
     ]
 );
@@ -119,7 +128,7 @@ export class DataTableComponent {
         { type: 'text', key: 'id', title: 'Id', sortable: true , cssClass: '', copyContent: true },
         { type: 'text', key: 'name', title: 'Name', cssClass: 'adf-ellipsis-cell', sortable: true, copyContent: false },
         { type: 'text', key: 'createdBy', title: 'Created By', sortable: true, cssClass: ''},
-        { type: 'json', key: 'json', title: 'Json', cssClass: 'adf-expand-cell-2'}
+        { type: 'json', key: 'json', title: 'Json', cssClass: 'adf-expand-cell-2', copyContent: true}
     ]
 );
 }

e2e/core/datatable/data-table-component.e2e.ts

@@ -164,10 +164,30 @@ describe('Datatable component', () => {
             expect(copyContentDataTablePage.getClipboardInputText()).toEqual('1');
             copyContentDataTablePage.clickOnIdColumn('2');
             notificationPage.checkNotifyContains('Text copied to clipboard');
+            copyContentDataTablePage.mouseOverIdColumn('3');
             copyContentDataTablePage.clickOnIdColumn('3');
             notificationPage.checkNotifyContains('Text copied to clipboard');
             copyContentDataTablePage.pasteClipboard();
             expect(copyContentDataTablePage.getClipboardInputText()).toEqual('3');
         });
+
+        it('[C307100] A column value of type text and with copyContent set to true is copied when clicking on it', () => {
+            dataTablePage.mouseOverIdColumn('1');
+            expect(dataTablePage.getCopyContentTooltip()).toEqual('Click to copy');
+            dataTablePage.clickOnIdColumn('1');
+            notificationPage.checkNotifyContains('Text copied to clipboard');
+            dataTablePage.pasteClipboard();
+            expect(dataTablePage.getClipboardInputText()).toEqual('1');
+        });
+
+        it('[C307101] A column value of type json and with copyContent set to true is copied when clicking on it', () => {
+            const jsonValue = `{   "id": 4 }`;
+            copyContentDataTablePage.mouseOverJsonColumn(2);
+            expect(copyContentDataTablePage.getCopyContentTooltip()).toEqual('Click to copy');
+            copyContentDataTablePage.clickOnJsonColumn(2);
+            notificationPage.checkNotifyContains('Text copied to clipboard');
+            copyContentDataTablePage.pasteClipboard();
+            expect(copyContentDataTablePage.getClipboardInputText()).toContain(jsonValue);
+        });
     });
 });

e2e/pages/adf/contentServicesPage.ts

@@ -651,7 +651,7 @@ export class ContentServicesPage {
     }
 
     checkRowIsDisplayed(rowName) {
-        const row = this.contentList.dataTablePage().getRowElement('Display name', rowName);
+        const row = this.contentList.dataTablePage().getCellElementByValue('Display name', rowName);
         BrowserVisibility.waitUntilElementIsVisible(row);
     }
 

e2e/pages/adf/demo-shell/customSourcesPage.ts

@@ -71,7 +71,7 @@ export class CustomSources {
     }
 
     getStatusCell(rowName) {
-        const cell = this.dataTable.getCellByRowAndColumn('Name', rowName, column.status);
+        const cell = this.dataTable.getCellByRowContentAndColumn('Name', rowName, column.status);
         BrowserVisibility.waitUntilElementIsVisible(cell);
         return cell.getText();
     }

e2e/pages/adf/demo-shell/dataTablePage.ts

@@ -24,7 +24,8 @@ export class DataTablePage {
     columns = {
         id: 'Id',
         name: 'Name',
-        createdBy: 'Created By'
+        createdBy: 'Created By',
+        json: 'Json'
     };
 
     data = {
@@ -66,7 +67,7 @@ export class DataTablePage {
     }
 
     replaceRows(id) {
-        const rowID = this.dataTable.getRowElement(this.columns.id, id);
+        const rowID = this.dataTable.getCellElementByValue(this.columns.id, id);
         BrowserVisibility.waitUntilElementIsVisible(rowID);
         this.replaceRowsElement.click();
         BrowserVisibility.waitUntilElementIsNotVisible(rowID);
@@ -89,7 +90,7 @@ export class DataTablePage {
     }
 
     checkRowIsNotSelected(rowNumber) {
-        const isRowSelected = this.dataTable.getRowElement(this.columns.id, rowNumber)
+        const isRowSelected = this.dataTable.getCellElementByValue(this.columns.id, rowNumber)
             .element(by.xpath(`ancestor::div[contains(@class, 'adf-datatable-row custom-row-style ng-star-inserted is-selected')]`));
         BrowserVisibility.waitUntilElementIsNotOnPage(isRowSelected);
     }
@@ -116,13 +117,14 @@ export class DataTablePage {
     }
 
     clickCheckbox(rowNumber) {
-        const checkbox = this.dataTable.getRowElement(this.columns.id, rowNumber).element(by.xpath(`ancestor::div[contains(@class, 'adf-datatable-row')]//mat-checkbox/label`));
+        const checkbox = this.dataTable.getCellElementByValue(this.columns.id, rowNumber)
+            .element(by.xpath(`ancestor::div[contains(@class, 'adf-datatable-row')]//mat-checkbox/label`));
         BrowserVisibility.waitUntilElementIsVisible(checkbox);
         checkbox.click();
     }
 
     selectRow(rowNumber) {
-        const locator = this.dataTable.getRowElement(this.columns.id, rowNumber);
+        const locator = this.dataTable.getCellElementByValue(this.columns.id, rowNumber);
         BrowserVisibility.waitUntilElementIsVisible(locator);
         BrowserVisibility.waitUntilElementIsClickable(locator);
         locator.click();
@@ -130,7 +132,7 @@ export class DataTablePage {
     }
 
     selectRowWithKeyboard(rowNumber) {
-        const row = this.dataTable.getRowElement(this.columns.id, rowNumber);
+        const row = this.dataTable.getCellElementByValue(this.columns.id, rowNumber);
         browser.actions().sendKeys(protractor.Key.COMMAND).click(row).perform();
     }
 
@@ -142,7 +144,7 @@ export class DataTablePage {
     }
 
     getRowCheckbox(rowNumber) {
-        return this.dataTable.getRowElement(this.columns.id, rowNumber).element(by.xpath(`ancestor::div/div/mat-checkbox[contains(@class, 'mat-checkbox-checked')]`));
+        return this.dataTable.getCellElementByValue(this.columns.id, rowNumber).element(by.xpath(`ancestor::div/div/mat-checkbox[contains(@class, 'mat-checkbox-checked')]`));
     }
 
     getCopyContentTooltip() {
@@ -161,10 +163,18 @@ export class DataTablePage {
         return this.dataTable.mouseOverColumn(this.columns.id, name);
     }
 
+    mouseOverJsonColumn(rowNumber) {
+        return this.dataTable.mouseOverElement(this.dataTable.getCellByRowNumberAndColumnName(rowNumber - 1, this.columns.json));
+    }
+
     clickOnIdColumn(name) {
         return this.dataTable.clickColumn(this.columns.id, name);
     }
 
+    clickOnJsonColumn(rowNumber) {
+        return this.dataTable.clickElement(this.dataTable.getCellByRowNumberAndColumnName(rowNumber - 1, this.columns.json));
+    }
+
     clickOnNameColumn(name) {
         return this.dataTable.clickColumn(this.columns.name, name);
     }

e2e/pages/adf/permissionsPage.ts

@@ -119,7 +119,7 @@ export class PermissionsPage {
     }
 
     getRoleCellValue(rowName) {
-        const locator = new DataTableComponentPage().getCellByRowAndColumn('Authority ID', rowName, column.role);
+        const locator = new DataTableComponentPage().getCellByRowContentAndColumn('Authority ID', rowName, column.role);
         BrowserVisibility.waitUntilElementIsVisible(locator);
         return locator.getText();
     }

e2e/pages/adf/searchResultsPage.ts

@@ -29,7 +29,7 @@ export class SearchResultsPage {
     contentServices = new ContentServicesPage();
 
     getNodeHighlight(content) {
-        return this.dataTable.getCellByRowAndColumn('Display name', content, 'Search');
+        return this.dataTable.getCellByRowContentAndColumn('Display name', content, 'Search');
     }
 
     tableIsLoaded() {

lib/core/datatable/components/datatable/datatable.component.html

@@ -159,8 +159,7 @@
                                     [tooltip]="getCellTooltip(row, col)">
                                 </adf-datatable-cell>
                             </div>
-                            <div *ngSwitchCase="'json'" class="adf-cell-value"
+                            <div *ngSwitchCase="'json'" class="adf-cell-value">
-                                 [attr.data-automation-id]="'text_' + data.getValue(row, col)">
                                 <adf-json-cell
                                     [copyContent]="col.copyContent"
                                     [data]="data"

lib/testing/src/lib/core/pages/data-table-component.page.ts

@@ -102,13 +102,13 @@ export class DataTableComponentPage {
     }
 
     checkRowIsSelected(columnName, columnValue) {
-        const selectedRow = this.getRowElement(columnName, columnValue).element(by.xpath(`ancestor::div[contains(@class, 'is-selected')]`));
+        const selectedRow = this.getCellElementByValue(columnName, columnValue).element(by.xpath(`ancestor::div[contains(@class, 'is-selected')]`));
         BrowserVisibility.waitUntilElementIsVisible(selectedRow);
         return this;
     }
 
     checkRowIsNotSelected(columnName, columnValue) {
-        const selectedRow = this.getRowElement(columnName, columnValue).element(by.xpath(`ancestor::div[contains(@class, 'is-selected')]`));
+        const selectedRow = this.getCellElementByValue(columnName, columnValue).element(by.xpath(`ancestor::div[contains(@class, 'is-selected')]`));
         BrowserVisibility.waitUntilElementIsNotOnPage(selectedRow);
         return this;
     }
@@ -155,7 +155,7 @@ export class DataTableComponentPage {
     }
 
     getTooltip(columnName, columnValue) {
-        return this.getRowElement(columnName, columnValue).getAttribute('title');
+        return this.getCellElementByValue(columnName, columnValue).getAttribute('title');
     }
 
     getFileHyperlink(filename) {
@@ -226,22 +226,17 @@ export class DataTableComponentPage {
     }
 
     checkContentIsDisplayed(columnName, columnValue) {
-        const row = this.getRowElement(columnName, columnValue);
+        const row = this.getCellElementByValue(columnName, columnValue);
         BrowserVisibility.waitUntilElementIsVisible(row);
         return this;
     }
 
     checkContentIsNotDisplayed(columnName, columnValue) {
-        const row = this.getRowElement(columnName, columnValue);
+        const row = this.getCellElementByValue(columnName, columnValue);
         BrowserVisibility.waitUntilElementIsNotOnPage(row);
         return this;
     }
 
-    contentInPosition(position) {
-        BrowserVisibility.waitUntilElementIsVisible(this.contents);
-        return this.contents.get(position - 1).getText();
-    }
-
     getRow(columnName, columnValue) {
         const row = this.rootElement.all(by.css(`div[title="${columnName}"] div[data-automation-id="text_${columnValue}"]`)).first()
             .element(by.xpath(`ancestor::div[contains(@class, 'adf-datatable-row')]`));
@@ -249,7 +244,12 @@ export class DataTableComponentPage {
         return row;
     }
 
-    getRowElement(columnName, columnValue) {
+    contentInPosition(position) {
+        BrowserVisibility.waitUntilElementIsVisible(this.contents);
+        return this.contents.get(position - 1).getText();
+    }
+
+    getCellElementByValue(columnName, columnValue) {
         return this.rootElement.all(by.css(`div[title="${columnName}"] div[data-automation-id="text_${columnValue}"] span`)).first();
     }
 
@@ -281,7 +281,11 @@ export class DataTableComponentPage {
         return this.list.count();
     }
 
-    getCellByRowAndColumn(rowColumn, rowContent, columnName) {
+    getCellByRowNumberAndColumnName(rowNumber, columnName) {
+        return this.list.get(rowNumber).element(by.css(`div[title="${columnName}"] span`));
+    }
+
+    getCellByRowContentAndColumn(rowColumn, rowContent, columnName) {
         return this.getRow(rowColumn, rowContent).element(by.css(`div[title='${columnName}']`));
     }
 
@@ -320,17 +324,27 @@ export class DataTableComponentPage {
     }
 
     mouseOverColumn(columnName, columnValue) {
-        const column = this.getRowElement(columnName, columnValue);
+        const column = this.getCellElementByValue(columnName, columnValue);
-        BrowserVisibility.waitUntilElementIsVisible(column);
+        this.mouseOverElement(column);
-        browser.actions().mouseMove(column).perform();
+        return this;
+    }
+
+    mouseOverElement(elem) {
+        BrowserVisibility.waitUntilElementIsVisible(elem);
+        browser.actions().mouseMove(elem).perform();
         return this;
     }
 
     clickColumn(columnName, columnValue) {
-        const column = this.getRowElement(columnName, columnValue);
+        const column = this.getCellElementByValue(columnName, columnValue);
-        BrowserVisibility.waitUntilElementIsVisible(column);
+        this.clickElement(column);
-        BrowserVisibility.waitUntilElementIsClickable(column);
+        return this;
-        column.click();
+    }
+
+    clickElement(elem) {
+        BrowserVisibility.waitUntilElementIsVisible(elem);
+        BrowserVisibility.waitUntilElementIsClickable(elem);
+        elem.click();
         return this;
     }
 }

lib/testing/src/lib/process-services-cloud/pages/task-list-cloud-component.page.ts

@@ -67,7 +67,7 @@ export class TaskListCloudComponentPage {
     }
 
     getRow(taskName) {
-        return this.dataTable.getRowElement('Name', taskName);
+        return this.dataTable.getCellElementByValue('Name', taskName);
     }
 
     checkContentIsDisplayedByProcessInstanceId(taskName) {
@@ -105,7 +105,7 @@ export class TaskListCloudComponentPage {
     }
 
     getIdCellValue(rowName) {
-        const locator = new DataTableComponentPage().getCellByRowAndColumn('Name', rowName, column.id);
+        const locator = new DataTableComponentPage().getCellByRowContentAndColumn('Name', rowName, column.id);
         BrowserVisibility.waitUntilElementIsVisible(locator);
         return locator.getText();
     }