[ADF-3332][ADF-3352] Add property e2e test and leftsidebar viewer (#3814)

* new viewer test
left sidebar
fix height width no overlay viewer

* fix lint and failing e2e

* missing semi column

* fix test

* fix template

* documentation

e2e/content-services/tag_component.e2e.ts

@@ -28,6 +28,7 @@ import AlfrescoApi = require('alfresco-js-api-node');
 import { UploadActions } from '../actions/ACS/upload.actions';
 
 import Util = require('../util/util');
+import { browser } from 'protractor';
 
 describe('Tag component', () => {
 
@@ -105,6 +106,9 @@ describe('Tag component', () => {
     it('[C260378] Multiple tags', () => {
         tagPage.insertNodeId(pdfFileModel.id);
         tagPage.addTag(tagList[2]);
+
+        browser.driver.sleep(3000); // wait CS return tags
+
         tagPage.checkTagListIsOrderedAscending();
         tagPage.checkTagListByNodeIdIsOrderedAscending();
         tagPage.checkTagListContentServicesIsOrderedAscending();

e2e/core/viewer_properties.e2e.ts

@@ -0,0 +1,180 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { browser } from 'protractor';
+
+import TestConfig = require('../test.config');
+
+import LoginPage = require('../pages/adf/loginPage');
+import ContentServicesPage = require('../pages/adf/contentServicesPage');
+import ViewerPage = require('../pages/adf/viewerPage');
+
+import resources = require('../util/resources');
+
+import FileModel = require('../models/ACS/fileModel');
+import AcsUserModel = require('../models/ACS/acsUserModel');
+
+import AlfrescoApi = require('alfresco-js-api-node');
+import { UploadActions } from '../actions/ACS/upload.actions';
+
+describe('Viewer - properties', () => {
+
+    let acsUser = new AcsUserModel();
+    let viewerPage = new ViewerPage();
+    let contentServicesPage = new ContentServicesPage();
+    let loginPage = new LoginPage();
+
+    let pngFile = new FileModel({
+        'name': resources.Files.ADF_DOCUMENTS.PNG.file_name,
+        'location': resources.Files.ADF_DOCUMENTS.PNG.file_location
+    });
+
+    beforeAll(async (done) => {
+        let uploadActions = new UploadActions();
+
+        this.alfrescoJsApi = new AlfrescoApi({
+            provider: 'ECM',
+            hostEcm: TestConfig.adf.url
+        });
+
+        await this.alfrescoJsApi.login(TestConfig.adf.adminEmail, TestConfig.adf.adminPassword);
+
+        await this.alfrescoJsApi.core.peopleApi.addPerson(acsUser);
+
+        await this.alfrescoJsApi.login(acsUser.id, acsUser.password);
+
+        let pngFileUploaded = await uploadActions.uploadFile(this.alfrescoJsApi, pngFile.location, pngFile.name, '-my-');
+        Object.assign(pngFile, pngFileUploaded.entry);
+
+        loginPage.loginToContentServicesUsingUserModel(acsUser);
+
+        contentServicesPage.goToDocumentList();
+
+        contentServicesPage.checkAcsContainer();
+
+        viewerPage.viewFile(pngFile.name);
+
+        viewerPage.clickLeftSidebarButton();
+        viewerPage.checkLeftSideBarIsDisplayed();
+
+        done();
+    });
+
+    afterAll(async (done) => {
+        let uploadActions = new UploadActions();
+
+        await uploadActions.deleteFilesOrFolder(this.alfrescoJsApi, pngFile.getId());
+
+        done();
+    });
+
+    it('[C260066] Should Show/Hide viewer toolbar when showToolbar is true/false', () => {
+        viewerPage.checkToolbarIsDisplayed();
+        viewerPage.disableToolbar();
+        viewerPage.checkToolbarIsNotDisplayed();
+        viewerPage.enableToolbar();
+    });
+
+    it('[C260076] Should Show/Hide back button when allowGoBack is true/false', () => {
+        viewerPage.checkGoBackIsDisplayed();
+        viewerPage.disableGoBack();
+        viewerPage.checkGoBackIsNotDisplayed();
+        viewerPage.enableGoBack();
+    });
+
+    it('[C260077] Should Show toolbar options dropdown when adf-viewer-open-with directive is used', () => {
+        viewerPage.checkToolbarOptionsIsNotDisplayed();
+        viewerPage.enableToolbarOptions();
+        viewerPage.checkToolbarOptionsIsDisplayed();
+        viewerPage.disableToolbarOptions();
+    });
+
+    it('[C260079] Should Show/Hide download button when allowDownload is true/false', () => {
+        viewerPage.checkDownloadButtonDisplayed();
+        viewerPage.disableDownload();
+        viewerPage.checkDownloadButtonIsNotDisplayed();
+        viewerPage.enableDownload();
+    });
+
+    it('[C260082] Should Show/Hide print button when allowPrint is true/false', () => {
+        viewerPage.checkPrintButtonIsDisplayed();
+        viewerPage.disablePrint();
+        viewerPage.checkPrintButtonIsNotDisplayed();
+        viewerPage.enablePrint();
+    });
+
+    it('[C260087] Should Show/Hide share button when allowShare is true/false', () => {
+        viewerPage.checkShareButtonDisplayed();
+        viewerPage.disableShare();
+        viewerPage.checkShareButtonIsNotDisplayed();
+        viewerPage.enableShare();
+    });
+
+    it('[C260092] Should show adf-viewer-toolbar-actions directive buttons when adf-viewer-toolbar-actions is used', () => {
+        viewerPage.checkMoreActionsDisplayed();
+
+        viewerPage.disableMoreActions();
+
+        viewerPage.checkMoreActionsIsNotDisplayed();
+
+        viewerPage.enableMoreActions();
+    });
+
+    it('[C260074] Should show a custom file name when displayName property is used', () => {
+        viewerPage.checkFileNameIsDisplayed(pngFile.name);
+
+        viewerPage.enableCustomName();
+
+        viewerPage.enterCustomName('test custom title');
+        viewerPage.checkFileNameIsDisplayed('test custom title');
+
+        viewerPage.disableCustomName();
+    });
+
+    it('[C260090] Sould showSidebar allow right info-drawer to be shown', () => {
+        viewerPage.clickToggleRightSidebar();
+        viewerPage.checkInfoSideBarIsDisplayed();
+
+        viewerPage.clickToggleRightSidebar();
+        viewerPage.checkInfoSideBarIsNotDisplayed();
+    });
+
+    it('[C286442] Sould showLeftSidebar allow left info-drawer to be shown', () => {
+        viewerPage.clickToggleLeftSidebar();
+        viewerPage.checkLeftSideBarIsNotDisplayed();
+        viewerPage.clickLeftSidebarButton();
+        viewerPage.checkLeftSideBarIsDisplayed();
+    });
+
+    it('[C260089] Should Show/Hide info-drawer if allowSidebar true/false', () => {
+        viewerPage.clickInfoButton();
+
+        viewerPage.checkLeftSideBarIsDisplayed();
+        viewerPage.checkInfoSideBarIsDisplayed();
+
+        viewerPage.checkInfoButtonIsDisplayed();
+        viewerPage.checkLeftSideBarButtonIsDisplayed();
+
+        viewerPage.disableAllowSidebar();
+
+        viewerPage.checkInfoButtonIsNotDisplayed();
+        viewerPage.checkLeftSideBarButtonIsNotDisplayed();
+
+        viewerPage.checkLeftSideBarIsNotDisplayed();
+        viewerPage.checkInfoSideBarIsNotDisplayed();
+    });
+});

e2e/pages/adf/versionManagerPage.ts

@@ -96,7 +96,7 @@ export class VersionManagePage {
     }
 
     /**
-     * disables download
+     * disables readOnly
      */
     disableReadOnly() {
         Util.waitUntilElementIsVisible(this.readOnlySwitch);
@@ -108,7 +108,7 @@ export class VersionManagePage {
     }
 
     /**
-     * enables download
+     * enables readOnly
      */
     enableReadOnly() {
         Util.waitUntilElementIsVisible(this.readOnlySwitch);

e2e/pages/adf/viewerPage.js

@@ -21,8 +21,8 @@ var ViewerToolbarPage = function () {
 
     var closeButton = element(by.css("button[data-automation-id='adf-toolbar-back']"));
     var fileName = element(by.id("adf-viewer-display-name"));
-    var downloadButton = element(by.css("button[data-automation-id='adf-toolbar-download'] > span > mat-icon"));
     var infoButton = element(by.css("button[data-automation-id='adf-toolbar-sidebar']"));
+    var leftSideBarButton = element(by.css("button[data-automation-id='adf-toolbar-left-sidebar']"));
     var previousPageButton = element(by.id("viewer-previous-page-button"));
     var nextPageButton = element(by.id("viewer-next-page-button"));
     var zoomInButton = element(by.id("viewer-zoom-in-button"));
@@ -50,12 +50,42 @@ var ViewerToolbarPage = function () {
     var passwordSubmitDisabled = element(by.css("button[data-automation-id='adf-password-dialog-submit'][disabled]"));
     var passwordInput = element(by.css("input[data-automation-id='adf-password-dialog-input']"));
     var passwordError = element(by.css("mat-error[data-automation-id='adf-password-dialog-error']"));
-    var infoSideBar = element(by.css("div[class='adf-info-drawer-layout-header']"));
+    var infoSideBar = element(by.id("adf-right-sidebar"));
+    var leftSideBar = element(by.id("adf-left-sidebar"));
     var unsupportedFileContainer = element(by.cssContainingText(".label", "Document preview could not be loaded"));
     var pageCanvas = element.all(by.css("div[class='canvasWrapper']")).first();
     var activeTab = element(by.css("div[class*='mat-tab-label-active']"));
     var uploadNewVersionButton = element(by.css("input[data-automation-id='upload-single-file']"));
     var rightChevron = element(by.css("div[class*='header-pagination-after']"));
+    var toolbarSwitch = element(by.id('adf-switch-toolbar'));
+    var toolbar = element(by.id('adf-viewer-toolbar'));
+    var goBackSwitch = element(by.id('adf-switch-goback'));
+
+    var openWithSwitch = element(by.id('adf-switch-openwith'));
+    var openWith = element(by.id('adf-viewer-openwith'));
+
+    var customNameSwitch = element(by.id('adf-switch-custoname'));
+
+    var showRightSidebarSwitch = element(by.id('adf-switch-showrightsidebar'));
+    var showLeftSidebarSwitch = element(by.id('adf-switch-showleftsidebar'));
+
+    var moreActionsSwitch = element(by.id('adf-switch-moreactions'));
+    var moreActions = element(by.id('adf-viewer-moreactions'));
+
+    var downloadSwitch = element(by.id('adf-switch-download'));
+    var downloadButton = element(by.id('adf-viewer-download'));
+
+    var printSwitch = element(by.id('adf-switch-print'));
+    var printButton = element(by.id('adf-viewer-print'));
+
+    var allowSidebarSwitch = element(by.id('adf-switch-allowsidebar'));
+
+    var shareSwitch = element(by.id('adf-switch-share'));
+    var shareButton = element(by.id('adf-viewer-share'));
+
+    var uploadButton = element(by.id('adf-viewer-upload'));
+    var timeButton = element(by.id('adf-viewer-time'));
+    var bugButton = element(by.id('adf-viewer-bug'));
 
     this.canvasHeight = function () {
         var deferred = protractor.promise.defer();
@@ -164,6 +194,10 @@ var ViewerToolbarPage = function () {
         Util.waitUntilElementIsVisible(infoButton);
     };
 
+    this.checkInfoButtonIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(infoButton);
+    };
+
     this.checkFileThumbnailIsDisplayed = function () {
         Util.waitUntilElementIsVisible(fileThumbnail);
     };
@@ -287,11 +321,32 @@ var ViewerToolbarPage = function () {
         Util.waitUntilElementIsNotOnPage(infoSideBar);
     };
 
+    this.checkLeftSideBarButtonIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotOnPage(leftSideBarButton);
+    };
+
+    this.checkLeftSideBarButtonIsDisplayed = function () {
+        Util.waitUntilElementIsOnPage(leftSideBarButton);
+    };
+
     this.clickInfoButton = function () {
         Util.waitUntilElementIsVisible(infoButton);
         return infoButton.click();
     };
 
+    this.clickLeftSidebarButton = function () {
+        Util.waitUntilElementIsVisible(leftSideBarButton);
+        return leftSideBarButton.click();
+    };
+
+    this.checkLeftSideBarIsDisplayed = function () {
+        Util.waitUntilElementIsVisible(leftSideBar);
+    };
+
+    this.checkLeftSideBarIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotOnPage(leftSideBar);
+    };
+
     this.clickPasswordSubmit = function () {
         Util.waitUntilElementIsVisible(passwordSubmit);
         passwordSubmit.click();
@@ -391,7 +446,7 @@ var ViewerToolbarPage = function () {
             .map((element) => element.getAttribute('innerText'))
             .then((texts) => {
                 for (let text of texts) {
-                    if (text === tabName ) {
+                    if (text === tabName) {
                         break;
                     }
                     this.clickRightChevron();
@@ -399,13 +454,13 @@ var ViewerToolbarPage = function () {
             });
     };
 
-    this.clickRightChevron = function() {
+    this.clickRightChevron = function () {
         Util.waitUntilElementIsVisible(rightChevron);
         rightChevron.click();
         return this;
     };
 
-    this.clickOnVersionsTab = function() {
+    this.clickOnVersionsTab = function () {
         this.clickRightChevronToGetToTab('Versions');
         var versionsTab = element(by.cssContainingText("div[id*='mat-tab-label']", "Versions"));
         Util.waitUntilElementIsVisible(versionsTab);
@@ -413,23 +468,276 @@ var ViewerToolbarPage = function () {
         return this;
     };
 
-    this.checkUploadVersionsButtonIsDisplayed = function() {
+    this.checkUploadVersionsButtonIsDisplayed = function () {
         Util.waitUntilElementIsVisible(uploadNewVersionButton);
         return this;
     };
 
-    this.checkVersionIsDisplayed = function(version) {
+    this.checkVersionIsDisplayed = function (version) {
         Util.waitUntilElementIsVisible(element(by.cssContainingText("h4[class*='adf-version-list-item-name']", version)));
         return this;
     };
 
-    this.clickOnCommentsTab = function() {
+    this.clickOnCommentsTab = function () {
         var commentsTab = element(by.cssContainingText("div[id*='mat-tab-label']", "Comments"));
         Util.waitUntilElementIsVisible(commentsTab);
         commentsTab.click();
         return this;
     };
 
+    this.disableToolbar = function () {
+        Util.waitUntilElementIsVisible(toolbarSwitch);
+        toolbarSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                toolbarSwitch.click();
+            }
+        });
+    }
+
+    this.enableToolbar = function () {
+        Util.waitUntilElementIsVisible(toolbarSwitch);
+        toolbarSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                toolbarSwitch.click();
+            }
+        });
+    }
+
+    this.checkToolbarIsDisplayed = function () {
+        Util.waitUntilElementIsVisible(toolbar);
+        return this;
+    };
+
+    this.checkToolbarIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(toolbar);
+        return this;
+    };
+
+    this.disableGoBack = function () {
+        Util.waitUntilElementIsVisible(goBackSwitch);
+        goBackSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                goBackSwitch.click();
+            }
+        });
+    }
+
+    this.enableGoBack = function () {
+        Util.waitUntilElementIsVisible(goBackSwitch);
+        goBackSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                goBackSwitch.click();
+            }
+        });
+    }
+
+    this.checkGoBackIsDisplayed = function () {
+        Util.waitUntilElementIsVisible(closeButton);
+        return this;
+    };
+
+    this.checkGoBackIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(closeButton);
+        return this;
+    };
+
+    this.disableToolbarOptions = function () {
+        Util.waitUntilElementIsVisible(openWithSwitch);
+        openWithSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                openWithSwitch.click();
+            }
+        });
+    }
+
+    this.enableToolbarOptions = function () {
+        Util.waitUntilElementIsVisible(openWithSwitch);
+        openWithSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                openWithSwitch.click();
+            }
+        });
+    }
+
+    this.checkToolbarOptionsIsDisplayed = function () {
+        Util.waitUntilElementIsVisible(openWith);
+        return this;
+    };
+
+    this.checkToolbarOptionsIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(openWith);
+        return this;
+    };
+
+    this.disableDownload = function () {
+        Util.waitUntilElementIsVisible(downloadSwitch);
+        downloadSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                downloadSwitch.click();
+            }
+        });
+    }
+
+    this.enableDownload = function () {
+        Util.waitUntilElementIsVisible(openWithSwitch);
+        downloadSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                downloadSwitch.click();
+            }
+        });
+    }
+
+    this.checkDownloadButtonDisplayed = function () {
+        Util.waitUntilElementIsVisible(downloadButton);
+        return this;
+    };
+
+    this.checkDownloadButtonIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(downloadButton);
+        return this;
+    };
+
+    this.disablePrint = function () {
+        Util.waitUntilElementIsVisible(printSwitch);
+        printSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                printSwitch.click();
+            }
+        });
+    }
+
+    this.enablePrint = function () {
+        Util.waitUntilElementIsVisible(printSwitch);
+        printSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                printSwitch.click();
+            }
+        });
+    }
+
+    this.checkPrintButtonIsDisplayed = function () {
+        Util.waitUntilElementIsVisible(printButton);
+        return this;
+    };
+
+    this.checkPrintButtonIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(printButton);
+        return this;
+    };
+
+    this.disableShare = function () {
+        Util.waitUntilElementIsVisible(shareSwitch);
+        shareSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                shareSwitch.click();
+            }
+        });
+    }
+
+    this.enableShare = function () {
+        Util.waitUntilElementIsVisible(shareSwitch);
+        shareSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                shareSwitch.click();
+            }
+        });
+    }
+
+    this.disableAllowSidebar = function () {
+        Util.waitUntilElementIsVisible(allowSidebarSwitch);
+        allowSidebarSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                allowSidebarSwitch.click();
+            }
+        });
+    }
+
+    this.enableAllowSidebar = function () {
+        Util.waitUntilElementIsVisible(allowSidebarSwitch);
+        allowSidebarSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                allowSidebarSwitch.click();
+            }
+        });
+    }
+
+    this.checkShareButtonDisplayed = function () {
+        Util.waitUntilElementIsVisible(shareButton);
+        return this;
+    };
+
+    this.checkShareButtonIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(shareButton);
+        return this;
+    };
+
+    this.checkMoreActionsDisplayed = function () {
+        Util.waitUntilElementIsVisible(bugButton);
+        Util.waitUntilElementIsVisible(timeButton);
+        Util.waitUntilElementIsVisible(uploadButton);
+        return this;
+    };
+
+    this.checkMoreActionsIsNotDisplayed = function () {
+        Util.waitUntilElementIsNotVisible(bugButton);
+        Util.waitUntilElementIsNotVisible(timeButton);
+        Util.waitUntilElementIsNotVisible(uploadButton);
+        return this;
+    };
+
+    this.disableMoreActions = function () {
+        Util.waitUntilElementIsVisible(moreActionsSwitch);
+        moreActionsSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                moreActionsSwitch.click();
+            }
+        });
+    }
+
+    this.enableMoreActions = function () {
+        Util.waitUntilElementIsVisible(moreActionsSwitch);
+        moreActionsSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                moreActionsSwitch.click();
+            }
+        });
+    }
+
+    this.disableCustomName = function () {
+        Util.waitUntilElementIsVisible(customNameSwitch);
+        customNameSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') >= 0) {
+                customNameSwitch.click();
+            }
+        });
+    }
+
+    this.enableCustomName = function () {
+        Util.waitUntilElementIsVisible(customNameSwitch);
+        customNameSwitch.getAttribute('class').then((check) => {
+            if (check.indexOf('mat-checked') < 0) {
+                customNameSwitch.click();
+            }
+        });
+    }
+
+    this.clickToggleRightSidebar = function () {
+        Util.waitUntilElementIsVisible(showRightSidebarSwitch);
+        showRightSidebarSwitch.click();
+    }
+
+    this.clickToggleLeftSidebar = function () {
+        Util.waitUntilElementIsVisible(showLeftSidebarSwitch);
+        showLeftSidebarSwitch.click();
+    }
+
+    this.enterCustomName = function (text) {
+        const textField = element(by.css('input[data-automation-id="adf-text-custom-name"]'));
+        Util.waitUntilElementIsVisible(textField);
+        textField.sendKeys('');
+        textField.clear().sendKeys(text);
+        return this;
+    };
 };
 
 module.exports = ViewerToolbarPage;