[ADF-4488] - FormCloud - Should be able to render a dropdown with a RestService bind (#4834)

* new test file

* fix failures, passing string instead of boolean flag.

* ADF-4488 - FormCloud - Not able to render a dropdown with a RestService bind

* ADF-4488 - FormCloud - Not able to render a dropdown with a RestService bind

* added await for entry of undefined error

* added missing async for the tests.

* changed location

* changed locatioremoved unnecessary async

* moved the locators to task-form-cloud-component page

* removed the taskDetailsCloudPage as is unnecessary and getting the assertions from taskHeaderCloudPage.

* fiv circular dependency

* fix circular dependency

e2e/pages/adf/demo-shell/process-services/taskDetailsCloudDemoPage.ts

@@ -1,45 +0,0 @@
-/*!
- * @license
- * Copyright 2019 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 { BrowserVisibility, BrowserActions } from '@alfresco/adf-testing';
-import { element, by } from 'protractor';
-import { TaskFormCloudComponent } from '@alfresco/adf-testing';
-
-export class TaskDetailsCloudDemoPage {
-
-    taskFormCloudPage = new TaskFormCloudComponent();
-
-    taskDetailsHeader = element(by.css(`h4[data-automation-id='task-details-header']`));
-    releaseButton = element(by.css('button[adf-cloud-unclaim-task]'));
-
-    taskFormCloud() {
-        return this.taskFormCloudPage;
-    }
-
-    checkTaskDetailsHeaderIsDisplayed() {
-        BrowserVisibility.waitUntilElementIsVisible(this.taskDetailsHeader);
-        return this;
-    }
-
-    getTaskDetailsHeader() {
-        return BrowserActions.getText(this.taskDetailsHeader);
-    }
-
-    getReleaseButtonText() {
-        return BrowserActions.getText(this.releaseButton);
-    }
-}

e2e/process-services-cloud/form-field/dropdown-widget.e2e.ts

@@ -0,0 +1,125 @@
+/*!
+ * @license
+ * Copyright 2019 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 {
+    TasksService, QueryService, ProcessDefinitionsService, ProcessInstancesService,
+    LoginSSOPage, ApiService, SettingsPage, IdentityService, GroupIdentityService, Widget, NotificationHistoryPage, TaskHeaderCloudPage, TaskFormCloudComponent
+} from '@alfresco/adf-testing';
+import { NavigationBarPage } from '../../pages/adf/navigationBarPage';
+import { TasksCloudDemoPage } from '../../pages/adf/demo-shell/process-services/tasksCloudDemoPage';
+import { AppListCloudPage } from '@alfresco/adf-testing';
+import resources = require('../../util/resources');
+import { browser } from 'protractor';
+
+describe('Form Field Component - Dropdown Widget', () => {
+    const loginSSOPage = new LoginSSOPage();
+    const navigationBarPage = new NavigationBarPage();
+    const appListCloudComponent = new AppListCloudPage();
+    const tasksCloudDemoPage = new TasksCloudDemoPage();
+    const taskFormCloudComponent = new TaskFormCloudComponent();
+    const notificationHistoryPage = new NotificationHistoryPage();
+    const settingsPage = new SettingsPage();
+    const taskHeaderCloudPage = new TaskHeaderCloudPage();
+    const widget = new Widget();
+    const dropdown = widget.dropdown();
+    const apiService = new ApiService(
+        browser.params.config.oauth2.clientId,
+        browser.params.config.bpmHost, browser.params.config.oauth2.host, browser.params.config.providers
+    );
+
+    let tasksService: TasksService;
+    let identityService: IdentityService;
+    let groupIdentityService: GroupIdentityService;
+    let processDefinitionService: ProcessDefinitionsService;
+    let processInstancesService: ProcessInstancesService;
+    let queryService: QueryService;
+
+    let runningProcessInstance, testUser, groupInfo, tasklist, task;
+    const simpleApp = resources.ACTIVITI7_APPS.SIMPLE_APP.name;
+
+    beforeAll(async (done) => {
+
+        await apiService.login(browser.params.identityAdmin.email, browser.params.identityAdmin.password);
+        identityService = new IdentityService(apiService);
+        groupIdentityService = new GroupIdentityService(apiService);
+        testUser = await identityService.createIdentityUserWithRole(apiService, [identityService.roles.aps_user]);
+
+        groupInfo = await groupIdentityService.getGroupInfoByGroupName('hr');
+        await identityService.addUserToGroup(testUser.idIdentityService, groupInfo.id);
+        await apiService.login(testUser.email, testUser.password);
+
+        processDefinitionService = new ProcessDefinitionsService(apiService);
+        const processDefinition = await processDefinitionService.getProcessDefinitionByName('dropdownrestprocess', simpleApp);
+
+        processInstancesService = new ProcessInstancesService(apiService);
+        await processInstancesService.createProcessInstance(processDefinition.entry.key, simpleApp);
+
+        runningProcessInstance = await processInstancesService.createProcessInstance(processDefinition.entry.key, simpleApp);
+        queryService = new QueryService(apiService);
+
+        tasklist = await queryService.getProcessInstanceTasks(runningProcessInstance.entry.id, simpleApp);
+        task = await tasklist.list.entries[0];
+        tasksService = new TasksService(apiService);
+        await tasksService.claimTask(task.entry.id, simpleApp);
+
+        await settingsPage.setProviderBpmSso(
+            browser.params.config.bpmHost,
+            browser.params.config.oauth2.host,
+            browser.params.config.identityHost);
+        loginSSOPage.loginSSOIdentityService(testUser.email, testUser.password);
+        done();
+    });
+
+    afterAll(async (done) => {
+        await apiService.login(browser.params.identityAdmin.email, browser.params.identityAdmin.password);
+        await identityService.deleteIdentityUser(testUser.idIdentityService);
+        done();
+    });
+
+    beforeEach(() => {
+        navigationBarPage.navigateToProcessServicesCloudPage();
+        appListCloudComponent.checkApsContainer();
+        appListCloudComponent.goToApp(simpleApp);
+
+    });
+
+    it('[C290069] Should be able to read rest service dropdown options, save and complete the task form', async () => {
+        tasksCloudDemoPage.myTasksFilter().clickTaskFilter();
+        tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(task.entry.name);
+        tasksCloudDemoPage.taskListCloudComponent().selectRow(task.entry.name);
+        taskHeaderCloudPage.checkTaskPropertyListIsDisplayed();
+        taskFormCloudComponent.formFields().checkFormIsDisplayed();
+        taskFormCloudComponent.formFields().checkWidgetIsVisible('Dropdown097maj');
+        dropdown.selectOption('Clementine Bauch', 'dropdown-cloud-widget mat-select');
+        expect(dropdown.getSelectedOptionText('Dropdown097maj')).toBe('Clementine Bauch');
+        taskFormCloudComponent.checkSaveButtonIsDisplayed().clickSaveButton();
+        expect(dropdown.getSelectedOptionText('Dropdown097maj')).toBe('Clementine Bauch');
+        taskFormCloudComponent.checkCompleteButtonIsDisplayed().clickCompleteButton();
+        expect(tasksCloudDemoPage.getActiveFilterName()).toBe('My Tasks');
+        tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(task.entry.name);
+        notificationHistoryPage.checkNotifyContains('Task has been saved successfully');
+
+        tasksCloudDemoPage.completedTasksFilter().clickTaskFilter();
+        tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(task.entry.name);
+        tasksCloudDemoPage.taskListCloudComponent().selectRow(task.entry.name);
+        taskFormCloudComponent.formFields().checkFormIsDisplayed();
+        taskFormCloudComponent.formFields().checkWidgetIsVisible('Dropdown097maj');
+        expect(dropdown.getSelectedOptionText('Dropdown097maj')).toBe('Clementine Bauch');
+        taskFormCloudComponent.checkCompleteButtonIsNotDisplayed();
+    });
+
+});

e2e/process-services-cloud/start-task-custom-app-cloud.e2e.ts

@@ -22,7 +22,6 @@ import {
     LoginSSOPage, AppListCloudPage, StringUtil, TaskHeaderCloudPage,
     StartTasksCloudPage, PeopleCloudComponentPage, TasksService, ApiService, IdentityService, SettingsPage, GroupIdentityService
 } from '@alfresco/adf-testing';
-import { TaskDetailsCloudDemoPage } from '../pages/adf/demo-shell/process-services/taskDetailsCloudDemoPage';
 import resources = require('../util/resources');
 
 describe('Start Task', () => {
@@ -34,7 +33,6 @@ describe('Start Task', () => {
     const tasksCloudDemoPage = new TasksCloudDemoPage();
     const startTask = new StartTasksCloudPage();
     const peopleCloudComponent = new PeopleCloudComponentPage();
-    const taskDetailsCloudDemoPage = new TaskDetailsCloudDemoPage();
     const settingsPage = new SettingsPage();
     const apiService = new ApiService(
         browser.params.config.oauth2.clientId,
@@ -118,8 +116,8 @@ describe('Start Task', () => {
         tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(unassignedTaskName);
         const taskId = tasksCloudDemoPage.taskListCloudComponent().getIdCellValue(unassignedTaskName);
         tasksCloudDemoPage.taskListCloudComponent().selectRow(unassignedTaskName);
-        taskDetailsCloudDemoPage.checkTaskDetailsHeaderIsDisplayed();
-        expect(taskDetailsCloudDemoPage.getTaskDetailsHeader()).toContain(taskId);
+        taskHeaderCloudPage.checkTaskPropertyListIsDisplayed();
+        expect(taskHeaderCloudPage.getId()).toBe(taskId);
         expect(taskHeaderCloudPage.getAssignee()).toBe('No assignee');
     });
 

e2e/process-services-cloud/task-form-cloud-component.e2e.ts

@@ -16,11 +16,12 @@
  */
 
 import { browser } from 'protractor';
-import { AppListCloudPage, StringUtil, ApiService, LoginSSOPage, TasksService, QueryService,
-    ProcessDefinitionsService, ProcessInstancesService, SettingsPage } from '@alfresco/adf-testing';
+import {
+    AppListCloudPage, StringUtil, ApiService, LoginSSOPage, TasksService, QueryService,
+    ProcessDefinitionsService, ProcessInstancesService, SettingsPage, TaskHeaderCloudPage, TaskFormCloudComponent
+} from '@alfresco/adf-testing';
 import { NavigationBarPage } from '../pages/adf/navigationBarPage';
 import { TasksCloudDemoPage } from '../pages/adf/demo-shell/process-services/tasksCloudDemoPage';
-import { TaskDetailsCloudDemoPage } from '../pages/adf/demo-shell/process-services/taskDetailsCloudDemoPage';
 
 import resources = require('../util/resources');
 
@@ -30,7 +31,8 @@ describe('Task form cloud component', () => {
     const navigationBarPage = new NavigationBarPage();
     const appListCloudComponent = new AppListCloudPage();
     const tasksCloudDemoPage = new TasksCloudDemoPage();
-    const taskDetailsCloudDemoPage = new TaskDetailsCloudDemoPage();
+    const taskHeaderCloudPage = new TaskHeaderCloudPage();
+    const taskFormCloudComponent = new TaskFormCloudComponent();
     const settingsPage = new SettingsPage();
 
     let tasksService: TasksService;
@@ -84,7 +86,7 @@ describe('Task form cloud component', () => {
         tasksCloudDemoPage.myTasksFilter().clickTaskFilter();
         tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(assigneeTask.entry.name);
         tasksCloudDemoPage.taskListCloudComponent().selectRow(assigneeTask.entry.name);
-        expect(taskDetailsCloudDemoPage.getReleaseButtonText()).toBe('RELEASE');
+        expect(taskFormCloudComponent.getReleaseButtonText()).toBe('RELEASE');
     });
 
     describe('Complete task - cloud directive', () => {
@@ -101,8 +103,8 @@ describe('Task form cloud component', () => {
             expect(tasksCloudDemoPage.getActiveFilterName()).toBe('Completed Tasks');
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(completedTaskName);
             tasksCloudDemoPage.taskListCloudComponent().selectRow(completedTaskName);
-            taskDetailsCloudDemoPage.checkTaskDetailsHeaderIsDisplayed();
-            taskDetailsCloudDemoPage.taskFormCloud().checkCompleteButtonIsNotDisplayed();
+            taskHeaderCloudPage.checkTaskPropertyListIsDisplayed();
+            taskFormCloudComponent.checkCompleteButtonIsNotDisplayed();
         });
 
         it('[C307095] Task can not be completed by owner user', () => {
@@ -112,8 +114,8 @@ describe('Task form cloud component', () => {
 
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(createdTask.entry.name);
             tasksCloudDemoPage.taskListCloudComponent().selectRow(createdTask.entry.name);
-            taskDetailsCloudDemoPage.checkTaskDetailsHeaderIsDisplayed();
-            taskDetailsCloudDemoPage.taskFormCloud().checkCompleteButtonIsNotDisplayed();
+            taskHeaderCloudPage.checkTaskPropertyListIsDisplayed();
+            taskFormCloudComponent.checkCompleteButtonIsNotDisplayed();
         });
 
         it('[C307110] Task list is displayed after clicking on Cancel button', () => {
@@ -122,8 +124,8 @@ describe('Task form cloud component', () => {
 
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(assigneeTask.entry.name);
             tasksCloudDemoPage.taskListCloudComponent().selectRow(assigneeTask.entry.name);
-            taskDetailsCloudDemoPage.checkTaskDetailsHeaderIsDisplayed();
-            taskDetailsCloudDemoPage.taskFormCloud().clickCancelButton();
+            taskHeaderCloudPage.checkTaskPropertyListIsDisplayed();
+            taskFormCloudComponent.clickCancelButton();
 
             expect(tasksCloudDemoPage.getActiveFilterName()).toBe('My Tasks');
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(assigneeTask.entry.name);
@@ -135,13 +137,13 @@ describe('Task form cloud component', () => {
 
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(toBeCompletedTask.entry.name);
             tasksCloudDemoPage.taskListCloudComponent().selectRow(toBeCompletedTask.entry.name);
-            taskDetailsCloudDemoPage.checkTaskDetailsHeaderIsDisplayed();
-            taskDetailsCloudDemoPage.taskFormCloud().checkCompleteButtonIsDisplayed().clickCompleteButton();
+            taskHeaderCloudPage.checkTaskPropertyListIsDisplayed();
+            taskFormCloudComponent.checkCompleteButtonIsDisplayed().clickCompleteButton();
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(toBeCompletedTask.entry.name);
 
             tasksCloudDemoPage.completedTasksFilter().clickTaskFilter();
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(toBeCompletedTask.entry.name);
-            taskDetailsCloudDemoPage.taskFormCloud().checkCompleteButtonIsNotDisplayed();
+            taskFormCloudComponent.checkCompleteButtonIsNotDisplayed();
         });
 
         it('[C307111] Task of a process can be completed by a user that is owner and assignee', () => {
@@ -150,13 +152,13 @@ describe('Task form cloud component', () => {
 
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(claimedTask.entry.name);
             tasksCloudDemoPage.taskListCloudComponent().selectRow(claimedTask.entry.name);
-            taskDetailsCloudDemoPage.checkTaskDetailsHeaderIsDisplayed();
-            taskDetailsCloudDemoPage.taskFormCloud().checkCompleteButtonIsDisplayed().clickCompleteButton();
+            taskHeaderCloudPage.checkTaskPropertyListIsDisplayed();
+            taskFormCloudComponent.checkCompleteButtonIsDisplayed().clickCompleteButton();
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(claimedTask.entry.name);
 
             tasksCloudDemoPage.completedTasksFilter().clickTaskFilter();
             tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(claimedTask.entry.name);
-            taskDetailsCloudDemoPage.taskFormCloud().checkCompleteButtonIsNotDisplayed();
+            taskFormCloudComponent.checkCompleteButtonIsNotDisplayed();
         });
     });
 

lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.html

@@ -42,7 +42,7 @@
                 <ng-template [ngTemplateOutlet]="taskFormCloudButtons">
                 </ng-template>
                 <button mat-button *ngIf="canCompleteTask()" adf-cloud-complete-task [appName]="appName"
-                        [taskId]="taskId" (success)="onCompleteTask()" color="primary">
+                        [taskId]="taskId" (success)="onCompleteTask()" color="primary" id="adf-form-complete">
                     {{'ADF_CLOUD_TASK_FORM.EMPTY_FORM.BUTTONS.COMPLETE' | translate}}
                 </button>
             </mat-card-actions>

lib/testing/src/lib/core/pages/form/formFields.ts

@@ -21,7 +21,7 @@ import { ElementFinder } from 'protractor/built/element';
 
 export class FormFields {
 
-    formContent = element(by.css('adf-form'));
+    formContent = element(by.css('adf-form-renderer'));
     refreshButton = element(by.css('div[class*="form-reload-button"] mat-icon'));
     saveButton = element(by.cssContainingText('mat-card-actions[class*="adf-for"] span', 'SAVE'));
     valueLocator = by.css('input');

lib/testing/src/lib/core/pages/form/widgets/dropdownWidget.ts

@@ -23,27 +23,26 @@ export class DropdownWidget {
 
     formFields = new FormFields();
 
-    selectedOptionLocator = by.css('mat-select[id="dropdown"] span span');
-    dropdown = element(by.id('dropdown'));
-
-    getSelectedOptionText(fieldId) {
-        return this.formFields.getFieldText(fieldId, this.selectedOptionLocator);
+    getSelectedOptionText(fieldId: string = 'dropdown') {
+        return this.formFields.getFieldText(fieldId, by.css(`mat-select[id="${fieldId}"] span span`));
     }
 
-    selectOption(option) {
-        this.openDropdown();
+    selectOption(option: string, locator: string = '#dropdown') {
+        this.openDropdown(locator);
         const row = element(by.cssContainingText('mat-option span', option));
         BrowserActions.click(row);
     }
 
-    openDropdown() {
-        this.checkDropdownIsDisplayed();
-        BrowserVisibility.waitUntilElementIsClickable(this.dropdown);
-        return this.dropdown.click();
+    openDropdown(locator: string = '#dropdown') {
+        this.checkDropdownIsDisplayed(locator);
+        const dropdown = locator ? element(by.css(`${locator}`)) : element(by.css(`#dropdown`));
+        BrowserVisibility.waitUntilElementIsClickable(dropdown);
+        return BrowserActions.click(dropdown);
     }
 
-    checkDropdownIsDisplayed() {
-        BrowserVisibility.waitUntilElementIsVisible(this.dropdown);
-        return this.dropdown;
+    checkDropdownIsDisplayed(locator: string = '#dropdown') {
+        const dropdown = element(by.css(`${locator}`));
+        BrowserVisibility.waitUntilElementIsVisible(dropdown);
+        return dropdown;
     }
 }

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

@@ -18,11 +18,15 @@
 import { element, by } from 'protractor';
 import { BrowserVisibility } from '../../core/utils/browser-visibility';
 import { BrowserActions } from '../../core/utils/browser-actions';
+import { FormFields } from '../../core/pages/form/formFields';
 
 export class TaskFormCloudComponent {
 
-    cancelButton = element(by.css("button[id='adf-cloud-cancel-task']"));
-    completeButton = element(by.css('button[adf-cloud-complete-task]'));
+    cancelButton = element(by.css('button[id="adf-cloud-cancel-task"]'));
+    completeButton = element(by.css('button[id="adf-form-complete"]'));
+    releaseButton = element(by.css('button[adf-cloud-unclaim-task]'));
+    saveButton = element(by.css('button[id="adf-form-save"]'));
+    form = element(by.css('adf-cloud-form'));
 
     checkCompleteButtonIsDisplayed() {
         BrowserVisibility.waitUntilElementIsVisible(this.completeButton);
@@ -30,7 +34,7 @@ export class TaskFormCloudComponent {
     }
 
     checkCompleteButtonIsNotDisplayed() {
-        BrowserVisibility.waitUntilElementIsNotVisible(this.completeButton);
+        BrowserVisibility.waitUntilElementIsNotOnPage(this.completeButton);
         return this;
     }
 
@@ -44,4 +48,27 @@ export class TaskFormCloudComponent {
         return this;
     }
 
+    formFields() {
+        return new FormFields();
+    }
+
+    checkFormIsDisplayed() {
+        BrowserVisibility.waitUntilElementIsVisible(this.form);
+        return this;
+    }
+
+    getReleaseButtonText() {
+        return BrowserActions.getText(this.releaseButton);
+    }
+
+    checkSaveButtonIsDisplayed() {
+        BrowserVisibility.waitUntilElementIsVisible(this.saveButton);
+        return this;
+    }
+
+    clickSaveButton() {
+        BrowserVisibility.waitUntilElementIsVisible(this.saveButton);
+        this.saveButton.click();
+        return this;
+    }
 }

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

@@ -17,6 +17,7 @@
 
 import { element, by } from 'protractor';
 import { BrowserActions } from '../../core/utils/browser-actions';
+import { BrowserVisibility } from '../../core/utils/browser-visibility';
 
 export class TaskHeaderCloudPage {
 
@@ -77,4 +78,8 @@ export class TaskHeaderCloudPage {
         return BrowserActions.getText(this.dueDateField);
     }
 
+    checkTaskPropertyListIsDisplayed() {
+        return BrowserVisibility.waitUntilElementIsVisible(this.taskPropertyList);
+    }
+
 }