From 8f68899ce05c1580651f9c95ecefcbafa9adef12 Mon Sep 17 00:00:00 2001 From: davidcanonieto Date: Mon, 27 Apr 2020 00:09:52 +0100 Subject: [PATCH] [ADF-4900] Card View and Metadata Components refactoring (#5592) * [ADF-4900] Card View and Metadata Components refactoring * CSS linting * Unit test excluded * Rebase branch * Fix unit tests * Fix linting * Fix e2e tests * Fix 2e2 tests * Fix process-services e2e tests * More fixes * Fix more e2e tests * Fix unit test * Improve flaky unit test * Fix process services e2e tests * Update Process Header Cloud Page * Fix linting * Fix timing issue * Lintintg * Fix selectors * Fix e2e tests * Fix timing issue * Fix C260328 * Fix spellcheck * save screenshot * performance issue * Fix unit tests and e2e tests * fix e2e * refactoring * fix lint * fix e2e * Fix C309698 * fix other e2e * fix lint * increase timeout Co-authored-by: Eugenio Romano --- .../card-view/card-view.component.html | 2 +- .../card-view/card-view.component.ts | 62 +- .../file-view/file-view.component.html | 4 +- .../metadata/metadata-smoke-tests.e2e.ts | 56 +- .../permissions/permissions-component.e2e.ts | 6 - .../permissions/site-permissions.e2e.ts | 6 +- e2e/pages/adf/card-view-component.page.ts | 4 - e2e/pages/adf/metadata-view.page.ts | 81 ++- .../process-services/process-details.page.ts | 24 +- .../adf/process-services/task-details.page.ts | 83 ++- .../edit-task-filters-component.e2e.ts | 38 +- .../form-field/dropdown-widget.e2e.ts | 4 +- ...cess-task-attach-content-file-cloud.e2e.ts | 2 +- .../start-task-form-cloud.e2e.ts | 6 +- .../start-task-custom-app-cloud.e2e.ts | 2 +- .../task-filters-cloud.e2e.ts | 8 +- .../task-form-cloud-component-tab.e2e.ts | 32 +- .../task-form-cloud-component.e2e.ts | 26 +- .../task-header-cloud.e2e.ts | 13 +- .../task-list-cloud-action-menu.e2e.ts | 2 +- .../task-list-properties-sort.e2e.ts | 2 +- .../task-list-properties.e2e.ts | 66 +- .../task-list-selection.e2e.ts | 2 +- e2e/process-services/info-drawer.e2e.ts | 46 +- e2e/process-services/task-details.e2e.ts | 2 - .../widgets/people-group-widget.e2e.ts | 3 +- .../content-metadata.component.html | 31 +- .../content-metadata.component.scss | 8 +- .../content-metadata.component.spec.ts | 113 ++-- .../content-metadata.component.ts | 69 +- lib/core/card-view/card-view.module.scss | 2 + lib/core/card-view/card-view.module.ts | 4 +- .../card-view-arrayitem.component.scss | 2 + .../card-view-boolitem.component.html | 15 +- .../card-view-dateitem.component.html | 8 +- .../card-view-dateitem.component.scss | 4 + ...card-view-keyvaluepairsitem.component.html | 54 +- ...card-view-keyvaluepairsitem.component.scss | 50 +- .../card-view-mapitem.component.html | 23 +- .../card-view-mapitem.component.scss | 4 + .../card-view-selectitem.component.html | 26 +- .../card-view-selectitem.component.scss | 10 + .../card-view-textitem.component.html | 257 ++++---- .../card-view-textitem.component.scss | 50 +- .../card-view-textitem.component.spec.ts | 622 ++++++++---------- .../card-view-textitem.component.ts | 114 ++-- .../card-view/card-view.component.scss | 32 +- .../card-view/card-view.component.spec.ts | 10 +- .../models/card-view-floatitem.model.ts | 1 + .../models/card-view-intitem.model.ts | 1 + .../models/card-view-textitem.model.ts | 1 + .../process-header-cloud.component.spec.ts | 36 +- .../task-header-cloud.component.spec.ts | 91 ++- .../process-instance-header.component.spec.ts | 50 +- .../components/task-header.component.spec.ts | 14 +- .../card-view/card-view-text-item.page.ts | 26 +- .../src/lib/core/utils/browser-actions.ts | 12 +- .../edit-task-filter-cloud-component.page.ts | 2 +- .../process-header-cloud-component.page.ts | 28 +- .../pages/start-tasks-cloud-component.page.ts | 4 - .../task-filters-cloud-component.page.ts | 46 +- .../pages/task-form-cloud-component.page.ts | 3 +- .../pages/task-header-cloud-component.page.ts | 16 +- package.json | 2 +- .../travis/e2e/process-services-cloud-e2e.sh | 2 +- 65 files changed, 1211 insertions(+), 1214 deletions(-) diff --git a/demo-shell/src/app/components/card-view/card-view.component.html b/demo-shell/src/app/components/card-view/card-view.component.html index 672afa20c8..6d152113db 100644 --- a/demo-shell/src/app/components/card-view/card-view.component.html +++ b/demo-shell/src/app/components/card-view/card-view.component.html @@ -4,7 +4,7 @@ diff --git a/demo-shell/src/app/components/card-view/card-view.component.ts b/demo-shell/src/app/components/card-view/card-view.component.ts index a7175a26f8..6d2d8d2eba 100644 --- a/demo-shell/src/app/components/card-view/card-view.component.ts +++ b/demo-shell/src/app/components/card-view/card-view.component.ts @@ -78,8 +78,43 @@ export class CardViewComponent implements OnInit, OnDestroy { value: 'Spock', key: 'name', default: 'default bar', + editable: this.isEditable + }), + new CardViewTextItemModel({ + label: 'CardView Text Item - Protected value', + value: 'Spock', + key: 'name', + default: 'default bar', multiline: false, icon: 'icon', + editable: false + }), + new CardViewTextItemModel({ + label: 'CardView Text Item - Multiline', + value: 'Spock', + key: 'name', + default: 'default bar', + multiline: true, + icon: 'icon', + editable: this.isEditable + }), + new CardViewTextItemModel({ + label: 'CardView Text Item - Default Value', + value: '', + key: 'name', + default: 'default bar', + multiline: false, + icon: 'icon', + editable: this.isEditable + }), + new CardViewTextItemModel({ + label: 'CardView Text Item - Multivalue (chips)', + value: [1, 2, 3], + key: 'name', + default: 'default bar', + multiline: true, + multivalued: true, + icon: 'icon', editable: this.isEditable }), new CardViewDateItemModel({ @@ -105,6 +140,13 @@ export class CardViewComponent implements OnInit, OnDestroy { default: false, editable: this.isEditable }), + new CardViewBoolItemModel({ + label: 'Agree to all terms and conditions', + value: true, + key: 'boolean', + default: false, + editable: this.isEditable + }), new CardViewIntItemModel({ label: 'CardView Int Item', value: 213, @@ -118,14 +160,20 @@ export class CardViewComponent implements OnInit, OnDestroy { key: 'float', default: 0.0, editable: this.isEditable, - pipes: [{ pipe: this.decimalNumberPipe}] + pipes: [{ pipe: this.decimalNumberPipe }] }), new CardViewKeyValuePairsItemModel({ label: 'CardView Key-Value Pairs Item', - value: [], + value: [{ name: 'hey', value: 'you' }, { name: 'hey', value: 'you' }], key: 'key-value-pairs', editable: this.isEditable }), + new CardViewKeyValuePairsItemModel({ + label: 'CardView Key-Value Pairs Item', + value: [{ name: 'hey', value: 'you' }, { name: 'hey', value: 'you' }], + key: 'key-value-pairs', + editable: false + }), new CardViewSelectItemModel({ label: 'CardView Select Item', value: 'one', @@ -146,6 +194,7 @@ export class CardViewComponent implements OnInit, OnDestroy { default: 'click here', editable: this.isEditable, clickable: true, + icon: 'close', clickCallBack: () => { this.respondToCardClick(); } @@ -154,14 +203,15 @@ export class CardViewComponent implements OnInit, OnDestroy { label: 'CardView Array of items', value: of([ { icon: 'directions_bike', value: 'Zlatan' }, - { icon: 'directions_bike', value: 'Lionel Messi'}, - { value: 'Mohamed', directions_bike: 'save'}, - { value: 'Ronaldo'} + { icon: 'directions_bike', value: 'Lionel Messi' }, + { value: 'Mohamed', directions_bike: 'save' }, + { value: 'Ronaldo' } ]), key: 'array', icon: 'edit', default: 'Empty', - noOfItemsToDisplay: 2 + noOfItemsToDisplay: 2, + editable: this.isEditable }) ]; } diff --git a/demo-shell/src/app/components/file-view/file-view.component.html b/demo-shell/src/app/components/file-view/file-view.component.html index afbe02014a..0c0214f5e9 100644 --- a/demo-shell/src/app/components/file-view/file-view.component.html +++ b/demo-shell/src/app/components/file-view/file-view.component.html @@ -49,7 +49,7 @@ [color]="'primary'" (change)="toggleMulti()" [checked]="multi"> - multi accordion + Multi accordion

@@ -59,7 +59,7 @@ [color]="'primary'" (change)="toggleReadOnly()" [checked]="isReadOnly"> - Editable + Read Only

diff --git a/e2e/content-services/metadata/metadata-smoke-tests.e2e.ts b/e2e/content-services/metadata/metadata-smoke-tests.e2e.ts index b9ea9c27fa..772cbfaea6 100644 --- a/e2e/content-services/metadata/metadata-smoke-tests.e2e.ts +++ b/e2e/content-services/metadata/metadata-smoke-tests.e2e.ts @@ -76,7 +76,7 @@ describe('Metadata component', () => { const pngUploadedFile = await uploadActions.uploadFile(pngFileModel.location, pngFileModel.name, '-my-'); Object.assign(pngFileModel, pngUploadedFile.entry); pngFileModel.update(pngUploadedFile.entry); - }); + }); afterAll(async () => { await navigationBarPage.clickLogoutButton(); @@ -171,28 +171,18 @@ describe('Metadata component', () => { await expect(await metadataViewPage.getPropertyIconTooltip('properties.cm:title')).toEqual('Edit'); await expect(await metadataViewPage.getPropertyIconTooltip('properties.cm:description')).toEqual('Edit'); - await metadataViewPage.clickEditPropertyIcons('name'); - await metadataViewPage.updatePropertyIconIsDisplayed('name'); - await metadataViewPage.clearPropertyIconIsDisplayed('name'); - await metadataViewPage.enterPropertyText('name', 'exampleText'); - await metadataViewPage.clickClearPropertyIcon('name'); + await metadataViewPage.clickResetMetadata(); await expect(await metadataViewPage.getPropertyText('name')).toEqual(browser.params.resources.Files.ADF_DOCUMENTS.PNG.file_name); - await metadataViewPage.clickEditPropertyIcons('name'); await metadataViewPage.enterPropertyText('name', 'exampleText.png'); - await metadataViewPage.clickUpdatePropertyIcon('name'); - await expect(await metadataViewPage.getPropertyText('name')).toEqual('exampleText.png'); - - await metadataViewPage.clickEditPropertyIcons('properties.cm:title'); await metadataViewPage.enterPropertyText('properties.cm:title', 'example title'); - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:title'); - await expect(await metadataViewPage.getPropertyText('properties.cm:title')).toEqual('example title'); - - await metadataViewPage.clickEditPropertyIcons('properties.cm:description'); await metadataViewPage.enterDescriptionText('example description'); - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:description'); + + await expect(await metadataViewPage.getPropertyText('name')).toEqual('exampleText.png'); + await expect(await metadataViewPage.getPropertyText('properties.cm:title')).toEqual('example title'); await expect(await metadataViewPage.getPropertyText('properties.cm:description')).toEqual('example description'); + await metadataViewPage.clickSaveMetadata(); await viewerPage.clickCloseButton(); await contentServicesPage.waitForTableBody(); @@ -208,10 +198,9 @@ describe('Metadata component', () => { await expect(await metadataViewPage.getPropertyText('properties.cm:description')).toEqual('example description'); await metadataViewPage.editIconClick(); - await metadataViewPage.clickEditPropertyIcons('name'); await metadataViewPage.enterPropertyText('name', browser.params.resources.Files.ADF_DOCUMENTS.PNG.file_name); - await metadataViewPage.clickUpdatePropertyIcon('name'); await expect(await metadataViewPage.getPropertyText('name')).toEqual(browser.params.resources.Files.ADF_DOCUMENTS.PNG.file_name); + await metadataViewPage.clickSaveMetadata(); }); it('[C260181] Should be possible edit all the metadata aspect', async () => { @@ -228,22 +217,16 @@ describe('Metadata component', () => { await metadataViewPage.editIconClick(); - await metadataViewPage.clickEditPropertyIcons('properties.exif:software'); await metadataViewPage.enterPropertyText('properties.exif:software', 'test custom text software'); - await metadataViewPage.clickUpdatePropertyIcon('properties.exif:software'); - await expect(await metadataViewPage.getPropertyText('properties.exif:software')).toEqual('test custom text software'); - - await metadataViewPage.clickEditPropertyIcons('properties.exif:isoSpeedRatings'); await metadataViewPage.enterPropertyText('properties.exif:isoSpeedRatings', 'test custom text isoSpeedRatings'); - await metadataViewPage.clickUpdatePropertyIcon('properties.exif:isoSpeedRatings'); - await expect(await metadataViewPage.getPropertyText('properties.exif:isoSpeedRatings')).toEqual('test custom text isoSpeedRatings'); - - await metadataViewPage.clickEditPropertyIcons('properties.exif:fNumber'); await metadataViewPage.enterPropertyText('properties.exif:fNumber', 22); - await metadataViewPage.clickUpdatePropertyIcon('properties.exif:fNumber'); + await metadataViewPage.clickSaveMetadata(); + + await expect(await metadataViewPage.getPropertyText('properties.exif:isoSpeedRatings')).toEqual('test custom text isoSpeedRatings'); + await expect(await metadataViewPage.getPropertyText('properties.exif:software')).toEqual('test custom text software'); await expect(await metadataViewPage.getPropertyText('properties.exif:fNumber')).toEqual('22'); }); - }); + }); describe('Folder metadata', () => { @@ -253,7 +236,6 @@ describe('Metadata component', () => { await loginPage.loginToContentServicesUsingUserModel(acsUser); await navigationBarPage.clickContentServicesButton(); await contentServicesPage.waitForTableBody(); - }); it('[C261157] Should be possible use the metadata component When the node is a Folder', async () => { @@ -269,22 +251,19 @@ describe('Metadata component', () => { await metadataViewPage.editIconClick(); - await metadataViewPage.clickEditPropertyIcons('name'); await metadataViewPage.enterPropertyText('name', 'newnameFolder'); - await metadataViewPage.clickClearPropertyIcon('name'); + await metadataViewPage.clickResetButton(); await expect(await metadataViewPage.getPropertyText('name')).toEqual(folderName); - await metadataViewPage.clickEditPropertyIcons('name'); await metadataViewPage.enterPropertyText('name', 'newnameFolder'); - await metadataViewPage.clickUpdatePropertyIcon('name'); + await metadataViewPage.clickSaveMetadata(); await expect(await metadataViewPage.getPropertyText('name')).toEqual('newnameFolder'); - await metadataViewPage.clickEditPropertyIcons('name'); await metadataViewPage.enterPropertyText('name', folderName); - await metadataViewPage.clickUpdatePropertyIcon('name'); + await metadataViewPage.clickSaveMetadata(); await expect(await metadataViewPage.getPropertyText('name')).toEqual(folderName); }); - }); + }); it('[C279960] Should show the last username modifier when modify a File', async () => { await loginPage.loginToContentServices(browser.params.testConfig.adf.adminEmail, browser.params.testConfig.adf.adminPassword); @@ -300,9 +279,8 @@ describe('Metadata component', () => { await metadataViewPage.editIconClick(); - await metadataViewPage.clickEditPropertyIcons('properties.cm:description'); await metadataViewPage.enterDescriptionText('check author example description'); - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:description'); + await metadataViewPage.clickSaveMetadata(); await expect(await metadataViewPage.getPropertyText('properties.cm:description')).toEqual('check author example description'); await loginPage.loginToContentServicesUsingUserModel(acsUser); diff --git a/e2e/content-services/permissions/permissions-component.e2e.ts b/e2e/content-services/permissions/permissions-component.e2e.ts index ac1784a0ab..dec6cae197 100644 --- a/e2e/content-services/permissions/permissions-component.e2e.ts +++ b/e2e/content-services/permissions/permissions-component.e2e.ts @@ -359,9 +359,7 @@ describe('Permissions Component', () => { await metadataViewPage.editIconIsDisplayed(); await metadataViewPage.editIconClick(); await metadataViewPage.editPropertyIconIsDisplayed('properties.cm:title'); - await metadataViewPage.clickEditPropertyIcons('properties.cm:title'); await metadataViewPage.enterPropertyText('properties.cm:title', 'newTitle1'); - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:title'); await expect(await metadataViewPage.getPropertyText('properties.cm:title')).toEqual('newTitle1'); await metadataViewPage.clickCloseButton(); await contentServicesPage.uploadFile(fileLocation); @@ -383,9 +381,7 @@ describe('Permissions Component', () => { await metadataViewPage.editIconIsDisplayed(); await metadataViewPage.editIconClick(); await metadataViewPage.editPropertyIconIsDisplayed('properties.cm:title'); - await metadataViewPage.clickEditPropertyIcons('properties.cm:title'); await metadataViewPage.enterPropertyText('properties.cm:title', 'newTitle2'); - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:title'); await expect(await metadataViewPage.getPropertyText('properties.cm:title')).toEqual('newTitle2'); await metadataViewPage.clickCloseButton(); await contentServicesPage.uploadFile(testFileModel.location); @@ -407,9 +403,7 @@ describe('Permissions Component', () => { await metadataViewPage.editIconIsDisplayed(); await metadataViewPage.editIconClick(); await metadataViewPage.editPropertyIconIsDisplayed('properties.cm:title'); - await metadataViewPage.clickEditPropertyIcons('properties.cm:title'); await metadataViewPage.enterPropertyText('properties.cm:title', 'newTitle3'); - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:title'); await expect(await metadataViewPage.getPropertyText('properties.cm:title')).toEqual('newTitle3'); await metadataViewPage.clickCloseButton(); await contentServicesPage.uploadFile(pngFileModel.location); diff --git a/e2e/content-services/permissions/site-permissions.e2e.ts b/e2e/content-services/permissions/site-permissions.e2e.ts index 0659b9e932..53c35cc22e 100644 --- a/e2e/content-services/permissions/site-permissions.e2e.ts +++ b/e2e/content-services/permissions/site-permissions.e2e.ts @@ -287,10 +287,8 @@ describe('Permissions Component', () => { await metadataViewPage.editIconClick(); await metadataViewPage.editPropertyIconIsDisplayed('properties.cm:title'); - await metadataViewPage.clickEditPropertyIcons('properties.cm:title'); await metadataViewPage.enterPropertyText('properties.cm:title', 'newTitle'); - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:title'); await expect(await metadataViewPage.getPropertyText('properties.cm:title')).toEqual('newTitle'); await metadataViewPage.clickCloseButton(); @@ -321,10 +319,8 @@ describe('Permissions Component', () => { await metadataViewPage.editIconClick(); await metadataViewPage.editPropertyIconIsDisplayed('properties.cm:description'); - await metadataViewPage.clickEditPropertyIcons('properties.cm:description'); await metadataViewPage.enterDescriptionText('newDescription'); - - await metadataViewPage.clickUpdatePropertyIcon('properties.cm:description'); + await metadataViewPage.clickSaveMetadata(); await expect(await metadataViewPage.getPropertyText('properties.cm:description')).toEqual('newDescription'); diff --git a/e2e/pages/adf/card-view-component.page.ts b/e2e/pages/adf/card-view-component.page.ts index 88a8f480cd..e07cb9a72d 100644 --- a/e2e/pages/adf/card-view-component.page.ts +++ b/e2e/pages/adf/card-view-component.page.ts @@ -49,10 +49,6 @@ export class CardViewComponentPage { return this.nameCardTextItem.getFieldValue(); } - async clickOnNameTextField(): Promise { - await this.nameCardTextItem.clickOnToggleTextField(); - } - async enterNameTextField(text: string): Promise { await this.nameCardTextItem.enterTextField(text); } diff --git a/e2e/pages/adf/metadata-view.page.ts b/e2e/pages/adf/metadata-view.page.ts index 0d6514c0b9..316424c8f6 100644 --- a/e2e/pages/adf/metadata-view.page.ts +++ b/e2e/pages/adf/metadata-view.page.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { by, element, ElementFinder } from 'protractor'; +import { by, element, ElementFinder, Key, protractor } from 'protractor'; import { BrowserVisibility, BrowserActions } from '@alfresco/adf-testing'; export class MetadataViewPage { @@ -23,15 +23,15 @@ export class MetadataViewPage { title: ElementFinder = element(by.css(`div[info-drawer-title]`)); expandedAspect: ElementFinder = element(by.css(`mat-expansion-panel-header[aria-expanded='true']`)); aspectTitle = by.css(`mat-panel-title`); - name: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-name'] span`)); - creator: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-createdByUser.displayName'] span`)); + name: ElementFinder = element(by.css(`[data-automation-id='card-textitem-value-name']`)); + creator: ElementFinder = element(by.css(`[data-automation-id='card-textitem-value-createdByUser.displayName']`)); createdDate: ElementFinder = element(by.css(`span[data-automation-id='card-dateitem-createdAt'] span`)); - modifier: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-modifiedByUser.displayName'] span`)); + modifier: ElementFinder = element(by.css(`[data-automation-id='card-textitem-value-modifiedByUser.displayName']`)); modifiedDate: ElementFinder = element(by.css(`span[data-automation-id='card-dateitem-modifiedAt'] span`)); - mimetypeName: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-content.mimeTypeName']`)); - size: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-content.sizeInBytes']`)); - description: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-properties.cm:description'] span`)); - author: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-properties.cm:author'] span`)); + mimetypeName: ElementFinder = element(by.css(`[data-automation-id='card-textitem-value-content.mimeTypeName']`)); + size: ElementFinder = element(by.css(`[data-automation-id='card-textitem-value-content.sizeInBytes']`)); + description: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-properties.cm:description']`)); + author: ElementFinder = element(by.css(`[data-automation-id='card-textitem-value-properties.cm:author']`)); titleProperty: ElementFinder = element(by.css(`span[data-automation-id='card-textitem-value-properties.cm:title'] span`)); editIcon: ElementFinder = element(by.css(`button[data-automation-id='meta-data-card-toggle-edit']`)); informationButton: ElementFinder = element(by.css(`button[data-automation-id='meta-data-card-toggle-expand']`)); @@ -45,6 +45,8 @@ export class MetadataViewPage { closeButton: ElementFinder = element(by.cssContainingText('button.mat-button span', 'Close')); displayAspect: ElementFinder = element(by.css(`input[placeholder='Display Aspect']`)); applyAspect: ElementFinder = element(by.cssContainingText(`button span.mat-button-wrapper`, 'Apply Aspect')); + saveMetadataButton: ElementFinder = element(by.css(`[data-automation-id='save-metadata']`)); + resetMetadataButton: ElementFinder = element(by.css(`[data-automation-id='reset-metadata']`)); async getTitle(): Promise { return BrowserActions.getText(this.title); @@ -55,11 +57,11 @@ export class MetadataViewPage { } async getName(): Promise { - return BrowserActions.getText(this.name); + return BrowserActions.getInputValue(this.name); } async getCreator(): Promise { - return BrowserActions.getText(this.creator); + return BrowserActions.getInputValue(this.creator); } async getCreatedDate(): Promise { @@ -67,7 +69,7 @@ export class MetadataViewPage { } async getModifier(): Promise { - return BrowserActions.getText(this.modifier); + return BrowserActions.getInputValue(this.modifier); } async getModifiedDate(): Promise { @@ -75,19 +77,19 @@ export class MetadataViewPage { } async getMimetypeName(): Promise { - return BrowserActions.getText(this.mimetypeName); + return BrowserActions.getInputValue(this.mimetypeName); } async getSize(): Promise { - return BrowserActions.getText(this.size); + return BrowserActions.getInputValue(this.size); } async getDescription(): Promise { - return BrowserActions.getText(this.description); + return BrowserActions.getInputValue(this.description); } async getAuthor(): Promise { - return BrowserActions.getText(this.author); + return BrowserActions.getInputValue(this.author); } async getTitleProperty(): Promise { @@ -136,61 +138,44 @@ export class MetadataViewPage { } async editPropertyIconIsDisplayed(propertyName: string) { - const editPropertyIcon: ElementFinder = element(by.css('button[data-automation-id="card-textitem-edit-icon-' + propertyName + '"]')); + const editPropertyIcon: ElementFinder = element(by.css('[data-automation-id="header-' + propertyName + '"] .adf-textitem-edit-icon')); await BrowserVisibility.waitUntilElementIsPresent(editPropertyIcon); } - async updatePropertyIconIsDisplayed(propertyName: string) { - const updatePropertyIcon: ElementFinder = element(by.css('button[data-automation-id="card-textitem-update-' + propertyName + '"]')); - await BrowserVisibility.waitUntilElementIsVisible(updatePropertyIcon); - } - - async clickUpdatePropertyIcon(propertyName: string): Promise { - const updatePropertyIcon: ElementFinder = element(by.css('button[data-automation-id="card-textitem-update-' + propertyName + '"]')); - await BrowserActions.click(updatePropertyIcon); - } - - async clickClearPropertyIcon(propertyName: string): Promise { - const clearPropertyIcon: ElementFinder = element(by.css('button[data-automation-id="card-textitem-reset-' + propertyName + '"]')); + async clickResetButton(): Promise { + const clearPropertyIcon: ElementFinder = element(by.css('button[data-automation-id="reset-metadata"]')); await BrowserActions.click(clearPropertyIcon); } async enterPropertyText(propertyName: string, text: string | number): Promise { - const textField: ElementFinder = element(by.css('input[data-automation-id="card-textitem-editinput-' + propertyName + '"]')); + const textField: ElementFinder = element(by.css('input[data-automation-id="card-textitem-value-' + propertyName + '"]')); await BrowserActions.clearSendKeys(textField, text.toString()); + await textField.sendKeys(protractor.Key.ENTER); } async enterPresetText(text: string): Promise { const presetField: ElementFinder = element(by.css('input[data-automation-id="adf-text-custom-preset"]')); - await BrowserActions.clearSendKeys(presetField, text); + await BrowserActions.clearSendKeys(presetField, text.toString()); + await presetField.sendKeys(protractor.Key.ENTER); const applyButton: ElementFinder = element(by.css('button[id="adf-metadata-aplly"]')); await BrowserActions.click(applyButton); } async enterDescriptionText(text: string): Promise { - const textField: ElementFinder = element(by.css('textarea[data-automation-id="card-textitem-edittextarea-properties.cm:description"]')); + const textField: ElementFinder = element(by.css('textarea[data-automation-id="card-textitem-value-properties.cm:description"]')); await BrowserActions.clearSendKeys(textField, text); + await textField.sendKeys(Key.TAB); } async getPropertyText(propertyName: string, type?: string): Promise { const propertyType = type || 'textitem'; - const textField: ElementFinder = element(by.css('span[data-automation-id="card-' + propertyType + '-value-' + propertyName + '"]')); + const textField: ElementFinder = element(by.css('[data-automation-id="card-' + propertyType + '-value-' + propertyName + '"]')); - return BrowserActions.getText(textField); - } - - async clearPropertyIconIsDisplayed(propertyName: string): Promise { - const clearPropertyIcon: ElementFinder = element(by.css('button[data-automation-id="card-textitem-reset-' + propertyName + '"]')); - await BrowserVisibility.waitUntilElementIsVisible(clearPropertyIcon); - } - - async clickEditPropertyIcons(propertyName: string): Promise { - const editPropertyIcon: ElementFinder = element(by.css('button[data-automation-id="card-textitem-edit-icon-' + propertyName + '"]')); - await BrowserActions.click(editPropertyIcon); + return BrowserActions.getInputValue(textField); } async getPropertyIconTooltip(propertyName: string): Promise { - const editPropertyIcon: ElementFinder = element(by.css('button[data-automation-id="card-textitem-edit-icon-' + propertyName + '"]')); + const editPropertyIcon: ElementFinder = element(by.css('[data-automation-id="header-' + propertyName + '"] .adf-textitem-edit-icon')); return editPropertyIcon.getAttribute('title'); } @@ -247,4 +232,12 @@ export class MetadataViewPage { async clickApplyAspect(): Promise { await BrowserActions.click(this.applyAspect); } + + async clickSaveMetadata(): Promise { + await BrowserActions.click(this.saveMetadataButton); + } + + async clickResetMetadata(): Promise { + await BrowserActions.click(this.resetMetadataButton); + } } diff --git a/e2e/pages/adf/process-services/process-details.page.ts b/e2e/pages/adf/process-services/process-details.page.ts index a6417050d3..4c0561253b 100644 --- a/e2e/pages/adf/process-services/process-details.page.ts +++ b/e2e/pages/adf/process-services/process-details.page.ts @@ -21,14 +21,14 @@ import { BrowserVisibility, BrowserActions } from '@alfresco/adf-testing'; export class ProcessDetailsPage { processTitle: ElementFinder = element(by.css('mat-card-title[class="mat-card-title"]')); processDetailsMessage: ElementFinder = element(by.css('adf-process-instance-details div[class="ng-star-inserted"]')); - processStatusField: ElementFinder = element(by.css('span[data-automation-id="card-textitem-value-status"]')); + processStatusField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-status"]')); processEndDateField: ElementFinder = element(by.css('span[data-automation-id="card-dateitem-ended"]')); - processCategoryField: ElementFinder = element(by.css('span[data-automation-id="card-textitem-value-category"]')); - processBusinessKeyField: ElementFinder = element(by.css('span[data-automation-id="card-textitem-value-businessKey"]')); - processCreatedByField: ElementFinder = element(by.css('span[data-automation-id="card-textitem-value-assignee"]')); + processCategoryField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-category"]')); + processBusinessKeyField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-businessKey"]')); + processCreatedByField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-assignee"]')); processCreatedField: ElementFinder = element(by.css('span[data-automation-id="card-dateitem-created"]')); - processIdField: ElementFinder = element(by.css('span[data-automation-id="card-textitem-value-id"]')); - processDescription: ElementFinder = element(by.css('span[data-automation-id="card-textitem-value-description"]')); + processIdField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-id"]')); + processDescription: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-description"]')); showDiagramButtonDisabled: ElementFinder = element(by.css('button[id="show-diagram-button"][disabled]')); propertiesList: ElementFinder = element(by.css('div[class="adf-property-list"]')); showDiagramButton: ElementFinder = element(by.id('show-diagram-button')); @@ -67,7 +67,7 @@ export class ProcessDetailsPage { } getProcessStatus(): Promise { - return BrowserActions.getText(this.processStatusField); + return BrowserActions.getInputValue(this.processStatusField); } getEndDate(): Promise { @@ -75,15 +75,15 @@ export class ProcessDetailsPage { } getProcessCategory(): Promise { - return BrowserActions.getText(this.processCategoryField); + return BrowserActions.getInputValue(this.processCategoryField); } getBusinessKey(): Promise { - return BrowserActions.getText(this.processBusinessKeyField); + return BrowserActions.getInputValue(this.processBusinessKeyField); } getCreatedBy(): Promise { - return BrowserActions.getText(this.processCreatedByField); + return BrowserActions.getInputValue(this.processCreatedByField); } getCreated(): Promise { @@ -91,11 +91,11 @@ export class ProcessDetailsPage { } getId(): Promise { - return BrowserActions.getText(this.processIdField); + return BrowserActions.getInputValue(this.processIdField); } getProcessDescription(): Promise { - return BrowserActions.getText(this.processDescription); + return BrowserActions.getInputValue(this.processDescription); } async clickShowDiagram(): Promise { diff --git a/e2e/pages/adf/process-services/task-details.page.ts b/e2e/pages/adf/process-services/task-details.page.ts index 4f2947a8ad..61bf087e80 100644 --- a/e2e/pages/adf/process-services/task-details.page.ts +++ b/e2e/pages/adf/process-services/task-details.page.ts @@ -16,7 +16,7 @@ */ import { BrowserActions, BrowserVisibility, DropdownPage, TabsPage } from '@alfresco/adf-testing'; -import { browser, by, element, ElementFinder } from 'protractor'; +import { browser, by, element, ElementFinder, Key } from 'protractor'; import { AppSettingsTogglesPage } from './dialog/app-settings-toggles.page'; export class TaskDetailsPage { @@ -24,18 +24,20 @@ export class TaskDetailsPage { appSettingsTogglesClass = new AppSettingsTogglesPage(); formContent: ElementFinder = element(by.css('adf-form')); - formNameField: ElementFinder = element(by.css('span[data-automation-id*="formName"] span')); - assigneeField: ElementFinder = element(by.css('span[data-automation-id*="assignee"] span')); - statusField: ElementFinder = element(by.css('span[data-automation-id*="status"] span')); - categoryField: ElementFinder = element(by.css('span[data-automation-id*="category"] span')); + formNameField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-formName"]')); + formNameButton: ElementFinder = element(by.css('[data-automation-id="card-textitem-toggle-formName"]')); + assigneeField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-assignee"]')); + assigneeButton: ElementFinder = element(by.css('[data-automation-id="card-textitem-toggle-assignee"]')); + statusField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-status"]')); + categoryField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-category"] ')); parentNameField: ElementFinder = element(by.css('span[data-automation-id*="parentName"] span')); - parentTaskIdField: ElementFinder = element(by.css('span[data-automation-id*="parentTaskId"] span')); - durationField: ElementFinder = element(by.css('span[data-automation-id*="duration"] span')); + parentTaskIdField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-parentTaskId"] ')); + durationField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-duration"] ')); endDateField: ElementFinder = element.all(by.css('span[data-automation-id*="endDate"] span')).first(); createdField: ElementFinder = element(by.css('span[data-automation-id="card-dateitem-created"] span')); - idField: ElementFinder = element.all(by.css('span[data-automation-id*="id"] span')).first(); - descriptionField: ElementFinder = element(by.css('span[data-automation-id*="description"] span')); - dueDateField: ElementFinder = element(by.css('span[data-automation-id*="dueDate"] span')); + idField: ElementFinder = element.all(by.css('[data-automation-id="card-textitem-value-id"]')).first(); + descriptionField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-description"]')); + dueDateField: ElementFinder = element.all(by.css('span[data-automation-id*="dueDate"] span')).first(); activitiesTitle: ElementFinder = element(by.css('div[class*="adf-info-drawer-layout-header-title"] div')); commentField: ElementFinder = element(by.id('comment-input')); addCommentButton: ElementFinder = element(by.css('[data-automation-id="comments-input-add"]')); @@ -62,8 +64,8 @@ export class TaskDetailsPage { removeAttachForm: ElementFinder = element(by.id('adf-attach-form-remove-button')); attachFormName: ElementFinder = element(by.css('span[class="adf-form-title ng-star-inserted"]')); emptyTaskDetails: ElementFinder = element(by.css('adf-task-details > div > div')); - priority: ElementFinder = element(by.css('span[data-automation-id*="priority"] span')); - editableAssignee = element(by.css('span[data-automation-id="card-textitem-value-assignee"][class*="clickable"]')); + priority: ElementFinder = element(by.css('[data-automation-id*="card-textitem-value-priority"]')); + editableAssignee = element(by.css('[data-automation-id="card-textitem-value-assignee"][class*="clickable"]')); claimElement = element(by.css('[data-automation-id="header-claim-button"]')); releaseElement = element(by.css('[data-automation-id="header-unclaim-button"]')); saveFormButton = element(by.css('button[id="adf-form-save"]')); @@ -75,20 +77,10 @@ export class TaskDetailsPage { } async checkEditableFormIsNotDisplayed(): Promise { - const editableForm = element(by.css('span[data-automation-id="card-textitem-value-formName"][class*="clickable"]')); + const editableForm = element(by.css('[data-automation-id="card-textitem-value-formName"][class*="clickable"]')); await BrowserVisibility.waitUntilElementIsNotVisible(editableForm); } - async checkEditDescriptionButtonIsNotDisplayed(): Promise { - const editDescriptionButton = element(by.css('button[data-automation-id="card-textitem-edit-icon-description"]')); - await BrowserVisibility.waitUntilElementIsNotVisible(editDescriptionButton); - } - - async checkEditPriorityButtonIsNotDisplayed(): Promise { - const editPriorityButton = element(by.css('button[data-automation-id="card-textitem-edit-icon-priority"]')); - await BrowserVisibility.waitUntilElementIsNotVisible(editPriorityButton); - } - async checkDueDatePickerButtonIsNotDisplayed(): Promise { const dueDatePickerButton = element(by.css('mat-datetimepicker-toggle[data-automation-id="datepickertoggle-dueDate"]')); await BrowserVisibility.waitUntilElementIsNotVisible(dueDatePickerButton); @@ -151,17 +143,17 @@ export class TaskDetailsPage { } async checkFormIsAttached(formName): Promise { - const attachedFormName = await BrowserActions.getText(this.formNameField); + const attachedFormName = await BrowserActions.getInputValue(this.formNameField); await expect(attachedFormName).toEqual(formName); } getFormName(): Promise { - return BrowserActions.getText(this.formNameField); + return BrowserActions.getInputValue(this.formNameField); } async clickForm(): Promise { await BrowserActions.closeMenuAndDialogs(); - await BrowserActions.click(this.formNameField); + await BrowserActions.click(this.formNameButton); } async checkStandaloneNoFormMessageIsDisplayed(): Promise { @@ -173,7 +165,7 @@ export class TaskDetailsPage { } getAssignee(): Promise { - return BrowserActions.getText(this.assigneeField); + return BrowserActions.getInputValue(this.assigneeField); } isAssigneeClickable(): Promise { @@ -181,11 +173,11 @@ export class TaskDetailsPage { } getStatus(): Promise { - return BrowserActions.getText(this.statusField); + return BrowserActions.getInputValue(this.statusField); } getCategory(): Promise { - return BrowserActions.getText(this.categoryField); + return BrowserActions.getInputValue(this.categoryField); } getParentName(): Promise { @@ -193,11 +185,11 @@ export class TaskDetailsPage { } getParentTaskId(): Promise { - return BrowserActions.getText(this.parentTaskIdField); + return BrowserActions.getInputValue(this.parentTaskIdField); } getDuration(): Promise { - return BrowserActions.getText(this.durationField); + return BrowserActions.getInputValue(this.durationField); } getEndDate(): Promise { @@ -209,11 +201,16 @@ export class TaskDetailsPage { } getId(): Promise { - return BrowserActions.getText(this.idField); + return BrowserActions.getInputValue(this.idField); } getDescription(): Promise { - return BrowserActions.getText(this.descriptionField); + return BrowserActions.getInputValue(this.descriptionField); + } + + async getDescriptionPlaceholder(): Promise { + await BrowserVisibility.waitUntilElementIsPresent(this.descriptionField); + return this.descriptionField.getAttribute('placeholder'); } getDueDate(): Promise { @@ -221,32 +218,30 @@ export class TaskDetailsPage { } getPriority(): Promise { - return BrowserActions.getText(this.priority); + return BrowserActions.getInputValue(this.priority); } async updatePriority(priority?: string): Promise { await BrowserActions.click(this.priority); - await BrowserActions.clearSendKeys(element(by.css('input[data-automation-id="card-textitem-editinput-priority"]')), priority ? priority : ' '); - await BrowserActions.click(element(by.css('button[data-automation-id="card-textitem-update-priority"]'))); + await BrowserActions.clearWithBackSpace(this.priority); + await BrowserActions.clearSendKeys(element(by.css('input[data-automation-id="card-textitem-value-priority"]')), priority ? priority : ' '); + await this.priority.sendKeys(Key.TAB); } async updateDueDate(): Promise { await BrowserActions.click(this.dueDateField); - await BrowserActions.click(element(by.css('.mat-datetimepicker-calendar-body-cell'))); + await BrowserActions.click(element.all(by.css('.mat-datetimepicker-calendar-body-cell')).first()); } async updateDescription(description?: string): Promise { await BrowserActions.click(this.descriptionField); - const input = 'textarea[data-automation-id="card-textitem-edittextarea-description"]'; - await BrowserActions.clearSendKeys(element(by.css(input)), description ? description : ''); - if (!description) { - await browser.executeScript(`document.querySelector('${input}').dispatchEvent(new Event('input'))`); - } - await BrowserActions.click(element(by.css('button[data-automation-id="card-textitem-update-description"]'))); + await BrowserActions.clearWithBackSpace(this.descriptionField); + await BrowserActions.clearSendKeys(element(by.css('[data-automation-id="card-textitem-value-description"]')), description ? description : ''); + await this.descriptionField.sendKeys(Key.TAB); } async updateAssignee(fullName: string): Promise { - await BrowserActions.click(this.assigneeField); + await BrowserActions.click(this.assigneeButton); await BrowserActions.clearSendKeys(element(by.css('[id="userSearchText"]')), fullName); await BrowserActions.click(element(by.cssContainingText('.adf-people-full-name', fullName))); await BrowserActions.click(element(by.css('button[id="add-people"]'))); diff --git a/e2e/process-services-cloud/edit-task-filters-component.e2e.ts b/e2e/process-services-cloud/edit-task-filters-component.e2e.ts index d2c6ae562d..53ce515876 100644 --- a/e2e/process-services-cloud/edit-task-filters-component.e2e.ts +++ b/e2e/process-services-cloud/edit-task-filters-component.e2e.ts @@ -74,12 +74,12 @@ describe('Edit task filters cloud', () => { }); afterEach(async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); }); it('[C291785] All the filters property should be set up accordingly with the Query Param', async () => { await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getStatusFilterDropDownValue()).toEqual('ASSIGNED'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getSortFilterDropDownValue()).toEqual('CreatedDate'); @@ -87,7 +87,7 @@ describe('Edit task filters cloud', () => { await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(assignedTaskName); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(completedTaskName); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('Completed Tasks'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getStatusFilterDropDownValue()).toEqual('COMPLETED'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getSortFilterDropDownValue()).toEqual('CreatedDate'); @@ -98,9 +98,9 @@ describe('Edit task filters cloud', () => { }); it('[C306896] Delete Save and Save as actions should be displayed when clicking on custom filter header', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); const editTaskFilterCloudComponent = tasksCloudDemoPage.editTaskFilterCloudComponent(); @@ -115,13 +115,13 @@ describe('Edit task filters cloud', () => { }); it('[C291795] New filter is added when clicking Save As button', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); const editTaskFilterCloudComponent = tasksCloudDemoPage.editTaskFilterCloudComponent(); await editTaskFilterCloudComponent.openFilter(); await editTaskFilterCloudComponent.setSortFilterDropDown('Id'); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().clickSaveAsButton(); @@ -135,7 +135,7 @@ describe('Edit task filters cloud', () => { await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getSortFilterDropDownValue()).toEqual('Id'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().checkSaveAsButtonIsEnabled()).toEqual(false); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().checkDeleteButtonIsEnabled()).toEqual(true); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getSortFilterDropDownValue()).toEqual('CreatedDate'); await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('custom-new'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getSortFilterDropDownValue()).toEqual('Id'); @@ -143,13 +143,13 @@ describe('Edit task filters cloud', () => { }); it('[C291796] Two filters with same name can be created when clicking the Save As button', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); const editTaskFilterCloudComponent = tasksCloudDemoPage.editTaskFilterCloudComponent(); await editTaskFilterCloudComponent.openFilter(); await editTaskFilterCloudComponent.setSortFilterDropDown('Id'); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().clickSaveAsButton(); @@ -178,13 +178,13 @@ describe('Edit task filters cloud', () => { }); it('[C291797] A filter is overrided when clicking on save button', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); const editTaskFilterCloudComponent = tasksCloudDemoPage.editTaskFilterCloudComponent(); await editTaskFilterCloudComponent.openFilter(); await editTaskFilterCloudComponent.setSortFilterDropDown('Id'); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().clickSaveAsButton(); const editTaskFilterDialog = await tasksCloudDemoPage.editTaskFilterCloudComponent().editTaskFilterDialog(); @@ -204,13 +204,13 @@ describe('Edit task filters cloud', () => { }); it('[C291798] A filter is deleted when clicking on delete button', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); const editTaskFilterCloudComponent = tasksCloudDemoPage.editTaskFilterCloudComponent(); await editTaskFilterCloudComponent.openFilter(); await editTaskFilterCloudComponent.setSortFilterDropDown('Id'); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().clickSaveAsButton(); const editTaskFilterDialog = await tasksCloudDemoPage.editTaskFilterCloudComponent().editTaskFilterDialog(); @@ -227,7 +227,7 @@ describe('Edit task filters cloud', () => { }); it('[C291800] Task filter should not be created when task filter dialog is closed', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); const editTaskFilterCloudComponent = tasksCloudDemoPage.editTaskFilterCloudComponent(); await editTaskFilterCloudComponent.openFilter(); @@ -241,8 +241,8 @@ describe('Edit task filters cloud', () => { await tasksCloudDemoPage.editTaskFilterCloudComponent().editTaskFilterDialog().clickOnCancelButton(); await tasksCloudDemoPage.taskFilterCloudComponent.checkTaskFilterNotDisplayed('Cancel'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toEqual('My Tasks'); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getSortFilterDropDownValue()).toEqual('CreatedDate'); @@ -250,7 +250,7 @@ describe('Edit task filters cloud', () => { }); it('[C291801] Save button of task filter dialog should be disabled when task name is empty', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); const editTaskFilterCloudComponent = tasksCloudDemoPage.editTaskFilterCloudComponent(); await editTaskFilterCloudComponent.openFilter(); @@ -272,7 +272,7 @@ describe('Edit task filters cloud', () => { }); it('[C291799] Task filter dialog is displayed when clicking on Save As button', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); const tasksCloud = tasksCloudDemoPage.editTaskFilterCloudComponent(); await tasksCloud.openFilter(); await tasksCloud.setSortFilterDropDown('Id'); diff --git a/e2e/process-services-cloud/form-field/dropdown-widget.e2e.ts b/e2e/process-services-cloud/form-field/dropdown-widget.e2e.ts index f53982de41..e09446ae70 100644 --- a/e2e/process-services-cloud/form-field/dropdown-widget.e2e.ts +++ b/e2e/process-services-cloud/form-field/dropdown-widget.e2e.ts @@ -91,7 +91,7 @@ describe('Form Field Component - Dropdown Widget', () => { }); it('[C290069] Should be able to read rest service dropdown options, save and complete the task form', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(task.entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(task.entry.name); await taskHeaderCloudPage.checkTaskPropertyListIsDisplayed(); @@ -108,7 +108,7 @@ describe('Form Field Component - Dropdown Widget', () => { await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(task.entry.name); await notificationHistoryPage.checkNotifyContains('Task has been saved successfully'); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(task.entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(task.entry.name); await taskFormCloudComponent.formFields().checkFormIsDisplayed(); diff --git a/e2e/process-services-cloud/process-task-attach-content-file-cloud.e2e.ts b/e2e/process-services-cloud/process-task-attach-content-file-cloud.e2e.ts index 0a86dccd84..b643a191d1 100644 --- a/e2e/process-services-cloud/process-task-attach-content-file-cloud.e2e.ts +++ b/e2e/process-services-cloud/process-task-attach-content-file-cloud.e2e.ts @@ -127,7 +127,7 @@ describe('Process Task - Attach content file', () => { await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(taskName); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(taskName); await processCloudDemoPage.processFilterCloudComponent.clickOnProcessFilters(); diff --git a/e2e/process-services-cloud/start-task-form-cloud.e2e.ts b/e2e/process-services-cloud/start-task-form-cloud.e2e.ts index 085ffcd818..d92fa3895c 100644 --- a/e2e/process-services-cloud/start-task-form-cloud.e2e.ts +++ b/e2e/process-services-cloud/start-task-form-cloud.e2e.ts @@ -300,7 +300,7 @@ describe('Start Task Form', () => { await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedById(taskId); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedById(taskId); await processCloudDemoPage.processFilterCloudComponent.clickOnProcessFilters(); @@ -511,7 +511,7 @@ describe('Start Task Form', () => { await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedById(taskId); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedById(taskId); await tasksCloudDemoPage.taskListCloudComponent().selectRowByTaskId(taskId); await contentFileWidget.checkFileIsAttached(testFileModel.name); @@ -546,7 +546,7 @@ describe('Start Task Form', () => { await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedById(taskId); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedById(taskId); await tasksCloudDemoPage.taskListCloudComponent().selectRowByTaskId(taskId); await contentFileWidget.checkFileIsAttached(testFileModel.name); diff --git a/e2e/process-services-cloud/start-task/start-task-custom-app-cloud.e2e.ts b/e2e/process-services-cloud/start-task/start-task-custom-app-cloud.e2e.ts index dfe589bfa5..cc953c05b1 100644 --- a/e2e/process-services-cloud/start-task/start-task-custom-app-cloud.e2e.ts +++ b/e2e/process-services-cloud/start-task/start-task-custom-app-cloud.e2e.ts @@ -194,7 +194,7 @@ describe('Start Task', () => { await browser.driver.sleep(1000); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); }); diff --git a/e2e/process-services-cloud/task-filters-cloud.e2e.ts b/e2e/process-services-cloud/task-filters-cloud.e2e.ts index bcfa681a92..0ac8721fbc 100644 --- a/e2e/process-services-cloud/task-filters-cloud.e2e.ts +++ b/e2e/process-services-cloud/task-filters-cloud.e2e.ts @@ -69,11 +69,11 @@ describe('Task filters cloud', () => { const task = await tasksService.createStandaloneTask(newTask, simpleApp); await tasksService.claimTask(task.entry.id, simpleApp); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('Completed Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(newTask); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(newTask); @@ -86,11 +86,11 @@ describe('Task filters cloud', () => { await tasksService.claimTask(toBeCompletedTask.entry.id, simpleApp); await tasksService.completeTask(toBeCompletedTask.entry.id, simpleApp); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(completedTask); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('Completed Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(completedTask); diff --git a/e2e/process-services-cloud/task-form-cloud-component-tab.e2e.ts b/e2e/process-services-cloud/task-form-cloud-component-tab.e2e.ts index ef87cb9cbc..ac689460dc 100644 --- a/e2e/process-services-cloud/task-form-cloud-component-tab.e2e.ts +++ b/e2e/process-services-cloud/task-form-cloud-component-tab.e2e.ts @@ -158,7 +158,7 @@ describe('Task form cloud component', () => { describe('Complete task with form - cloud directive', () => { it('[C315174] Should be able to complete a standalone task with visible tab with empty value for field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[0].entry.name); @@ -174,13 +174,11 @@ describe('Task form cloud component', () => { await widget.tab().checkTabIsDisplayedByLabel(tab.tabFieldValue); await taskFormCloudComponent.clickCompleteButton(); - await browser.sleep(1000); - await browser.refresh(); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(visibilityConditionTasks[0].entry.name); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[0].entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(visibilityConditionTasks[0].entry.name); await widget.tab().checkTabIsDisplayedByLabel(tab.tabWithFields); @@ -188,7 +186,7 @@ describe('Task form cloud component', () => { }); it('[C315177] Should be able to complete a standalone task with invisible tab with invalid value for field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[1].entry.name); @@ -213,13 +211,11 @@ describe('Task form cloud component', () => { await widget.tab().checkTabIsNotDisplayedByLabel(tab.tabFieldField); await taskFormCloudComponent.clickCompleteButton(); - await browser.sleep(1000); - await browser.refresh(); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(visibilityConditionTasks[1].entry.name); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[1].entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(visibilityConditionTasks[1].entry.name); await widget.tab().checkTabIsDisplayedByLabel(tab.tabWithFields); @@ -227,7 +223,7 @@ describe('Task form cloud component', () => { }); it('[C315178] Should be able to complete a standalone task with invisible tab with valid value', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[2].entry.name); @@ -251,14 +247,12 @@ describe('Task form cloud component', () => { await widget.textWidget().setValue(widgets.textOneId, value.notDisplayTab); await widget.tab().checkTabIsNotDisplayedByLabel(tab.tabFieldVar); await taskFormCloudComponent.clickCompleteButton(); - await browser.sleep(1000); - await browser.refresh(); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(visibilityConditionTasks[2].entry.name); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[2].entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(visibilityConditionTasks[2].entry.name); @@ -267,7 +261,7 @@ describe('Task form cloud component', () => { }); it('[C315175] Should be able to complete a standalone task with invisible tab with empty value for field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[3].entry.name); @@ -280,13 +274,11 @@ describe('Task form cloud component', () => { await widget.textWidget().isWidgetNotVisible(widgets.textTwoId); await taskFormCloudComponent.clickCompleteButton(); - await browser.sleep(1000); - await browser.refresh(); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(visibilityConditionTasks[3].entry.name); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[3].entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(visibilityConditionTasks[3].entry.name); await widget.tab().checkTabIsDisplayedByLabel(tab.tabWithFields); @@ -294,7 +286,7 @@ describe('Task form cloud component', () => { }); it('[C315176] Should not be able to complete a standalone task with visible tab with invalid value for field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[4].entry.name); @@ -316,7 +308,7 @@ describe('Task form cloud component', () => { }); it('[C315179] Should be able to complete a standalone task with visible tab with valid value for field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[5].entry.name); @@ -331,13 +323,11 @@ describe('Task form cloud component', () => { await widget.textWidget().setValue(widgets.textThreeId, value.displayTab); await taskFormCloudComponent.clickCompleteButton(); - await browser.sleep(1000); - await browser.refresh(); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(visibilityConditionTasks[5].entry.name); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(visibilityConditionTasks[5].entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(visibilityConditionTasks[5].entry.name); await widget.tab().checkTabIsDisplayedByLabel(tab.tabWithFields); diff --git a/e2e/process-services-cloud/task-form-cloud-component.e2e.ts b/e2e/process-services-cloud/task-form-cloud-component.e2e.ts index 2c7241412c..4f95c64003 100644 --- a/e2e/process-services-cloud/task-form-cloud-component.e2e.ts +++ b/e2e/process-services-cloud/task-form-cloud-component.e2e.ts @@ -119,7 +119,7 @@ describe('Task form cloud component', () => { it('[C310366] Should refresh buttons and form after an action is complete', async () => { await appListCloudComponent.goToApp(simpleApp); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); await tasksCloudDemoPage.editTaskFilterCloudComponent().clearAssignee(); @@ -142,7 +142,7 @@ describe('Task form cloud component', () => { await taskFormCloudComponent.checkReleaseButtonIsDisplayed(); await taskFormCloudComponent.clickCompleteButton(); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedById(formTaskId); await tasksCloudDemoPage.taskListCloudComponent().selectRowByTaskId(formTaskId); @@ -155,7 +155,7 @@ describe('Task form cloud component', () => { it('[C306872] Should not be able to Release a process task which has only assignee', async () => { await appListCloudComponent.goToApp(simpleApp); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedById(assigneeTaskId); await tasksCloudDemoPage.taskListCloudComponent().selectRowByTaskId(assigneeTaskId); @@ -171,14 +171,14 @@ describe('Task form cloud component', () => { }); it('[C307032] Should display the appropriate title for the unclaim option of a Task', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedById(candidateUsersTask.entry.id); await tasksCloudDemoPage.taskListCloudComponent().selectRowByTaskId(candidateUsersTask.entry.id); await expect(await taskFormCloudComponent.getReleaseButtonText()).toBe('RELEASE'); }); it('[C310142] Empty content is displayed when having a task without form', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(assigneeTask.entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(assigneeTask.entry.name); await taskFormCloudComponent.checkFormIsNotDisplayed(); @@ -189,7 +189,7 @@ describe('Task form cloud component', () => { }); it('[C310199] Should not be able to complete a task when required field is empty or invalid data is added to a field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(formValidationsTask.entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(formValidationsTask.entry.name); await taskFormCloudComponent.checkFormIsDisplayed(); @@ -225,7 +225,7 @@ describe('Task form cloud component', () => { }); it('[C307093] Complete button is not displayed when the task is already completed', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('Completed Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(completedTaskName); await tasksCloudDemoPage.taskListCloudComponent().selectRow(completedTaskName); @@ -234,7 +234,7 @@ describe('Task form cloud component', () => { }); it('[C307095] Task can not be completed by owner user', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); @@ -250,7 +250,7 @@ describe('Task form cloud component', () => { }); it('[C307110] Task list is displayed after clicking on Cancel button', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(assigneeTask.entry.name); @@ -263,7 +263,7 @@ describe('Task form cloud component', () => { }); it('[C307094] Standalone Task can be completed by a user that is owner and assignee', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(toBeCompletedTask.entry.name); @@ -273,13 +273,13 @@ describe('Task form cloud component', () => { await taskFormCloudComponent.clickCompleteButton(); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(toBeCompletedTask.entry.name); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(toBeCompletedTask.entry.name); await taskFormCloudComponent.checkCompleteButtonIsNotDisplayed(); }); it('[C307111] Task of a process can be completed by a user that is owner and assignee', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(completedTask.entry.name); @@ -289,7 +289,7 @@ describe('Task form cloud component', () => { await taskFormCloudComponent.clickCompleteButton(); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(completedTask.entry.name); - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(completedTask.entry.name); await taskFormCloudComponent.checkCompleteButtonIsNotDisplayed(); }); diff --git a/e2e/process-services-cloud/task-header-cloud.e2e.ts b/e2e/process-services-cloud/task-header-cloud.e2e.ts index 5718aa48d4..8fa71d4ea1 100644 --- a/e2e/process-services-cloud/task-header-cloud.e2e.ts +++ b/e2e/process-services-cloud/task-header-cloud.e2e.ts @@ -138,7 +138,7 @@ describe('Task Header cloud component', () => { }); it('[C291943] Should display task details for assigned task', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(basicCreatedTaskName); await tasksCloudDemoPage.taskListCloudComponent().selectRow(basicCreatedTaskName); @@ -158,7 +158,7 @@ describe('Task Header cloud component', () => { }); it('[C291944] Should display task details for completed task', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(completedTaskName); await tasksCloudDemoPage.taskListCloudComponent().selectRow(completedTaskName); @@ -178,7 +178,7 @@ describe('Task Header cloud component', () => { }); it('[C291945] Should Parent Name and Parent Id not be empty in task details for sub task', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(subTask.entry.name); await tasksCloudDemoPage.taskListCloudComponent().selectRow(subTask.entry.name); @@ -204,19 +204,16 @@ describe('Task Header cloud component', () => { await startTaskCloudPage.addName(myTaskName); await startTaskCloudPage.typePriorityOf('50'); await startTaskCloudPage.clickStartButton(); - await tasksCloudDemoPage.taskFilterCloudComponent.clickMyTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('my-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(myTaskName); await tasksCloudDemoPage.taskListCloudComponent().selectRow(myTaskName); await taskHeaderCloudPage.checkTaskPropertyListIsDisplayed(); - await taskHeaderCloudPage.priorityCardTextItem.clickOnEditButton(); await taskHeaderCloudPage.priorityCardTextItem.enterTextField('$$%£W21'); - await taskHeaderCloudPage.priorityCardTextItem.clickOnSaveButton(); const errorMessage = await taskHeaderCloudPage.priorityCardTextItem.getErrorMessage(); await expect(errorMessage).toBe('Enter a different value'); await taskHeaderCloudPage.priorityCardTextItem.enterTextField('600'); - await taskHeaderCloudPage.priorityCardTextItem.clickOnSaveButton(); const currentValue = await taskHeaderCloudPage.priorityCardTextItem.getFieldValue(); await expect(currentValue).toBe('600'); }); @@ -263,7 +260,7 @@ describe('Task Header cloud component', () => { }); it('[C311280] Should pick up the default date format from the app configuration', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.clickCompletedTasksFilter(); + await tasksCloudDemoPage.taskFilterCloudComponent.clickTaskFilter('completed-tasks'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(completedTaskName); await tasksCloudDemoPage.taskListCloudComponent().selectRow(completedTaskName); await taskHeaderCloudPage.checkTaskPropertyListIsDisplayed(); diff --git a/e2e/process-services-cloud/task-list-cloud-action-menu.e2e.ts b/e2e/process-services-cloud/task-list-cloud-action-menu.e2e.ts index 9a6db14afe..98d03f2bd2 100644 --- a/e2e/process-services-cloud/task-list-cloud-action-menu.e2e.ts +++ b/e2e/process-services-cloud/task-list-cloud-action-menu.e2e.ts @@ -93,7 +93,7 @@ describe('Process list cloud', () => { await tasksCloudDemoPage.actionAdded('invisibleaction'); await tasksCloudDemoPage.clickAppButton(); await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); + await tasksCloudDemoPage.taskFilterCloudComponent.checkTaskFilterIsDisplayed('my-tasks'); }); it('[C315723] Should be able to see and execute custom action menu', async () => { diff --git a/e2e/process-services-cloud/task-list-properties-sort.e2e.ts b/e2e/process-services-cloud/task-list-properties-sort.e2e.ts index ce5bdffba6..c29c94c2c1 100644 --- a/e2e/process-services-cloud/task-list-properties-sort.e2e.ts +++ b/e2e/process-services-cloud/task-list-properties-sort.e2e.ts @@ -128,7 +128,7 @@ describe('Edit task filters and task list properties', () => { await appListCloudComponent.checkApsContainer(); await appListCloudComponent.goToApp(simpleApp); await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); + await tasksCloudDemoPage.taskFilterCloudComponent.checkTaskFilterIsDisplayed('my-tasks'); }); it('[C306901] Should display tasks sorted by task name when taskName is selected from sort dropdown', async () => { diff --git a/e2e/process-services-cloud/task-list-properties.e2e.ts b/e2e/process-services-cloud/task-list-properties.e2e.ts index b09da20ad9..240d2c6dd5 100644 --- a/e2e/process-services-cloud/task-list-properties.e2e.ts +++ b/e2e/process-services-cloud/task-list-properties.e2e.ts @@ -111,13 +111,10 @@ describe('Edit task filters and task list properties', () => { await appListCloudComponent.checkApsContainer(); await appListCloudComponent.goToApp(simpleApp); await tasksCloudDemoPage.editTaskFilterCloudComponent().openFilter(); - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); + await tasksCloudDemoPage.taskFilterCloudComponent.checkTaskFilterIsDisplayed('my-tasks'); }); it('[C292004] Filter by appName', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getAppNameDropDownValue()).toEqual(simpleApp); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(createdTask.entry.name); @@ -131,9 +128,6 @@ describe('Edit task filters and task list properties', () => { }); it('[C291906] Should be able to see only the task with specific taskId when typing it in the task Id field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setId(createdTask.entry.id); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getId()).toEqual(createdTask.entry.id); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedById(createdTask.entry.id); @@ -143,9 +137,6 @@ describe('Edit task filters and task list properties', () => { }); it('[C291907] Should be able to see No tasks found when typing an invalid task id', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setId('invalidId'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getId()).toEqual('invalidId'); @@ -153,9 +144,6 @@ describe('Edit task filters and task list properties', () => { }); it('[C297476] Filter by taskName', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setTaskName(createdTask.entry.name); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getTaskName()).toEqual(createdTask.entry.name); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(createdTask.entry.name); @@ -165,9 +153,6 @@ describe('Edit task filters and task list properties', () => { }); it('[C297613] Should be able to see No tasks found when typing a task name that does not exist', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setTaskName('invalidName'); await expect(await tasksCloudDemoPage.editTaskFilterCloudComponent().getTaskName()).toEqual('invalidName'); @@ -175,30 +160,23 @@ describe('Edit task filters and task list properties', () => { }); it('[C297480] Should be able to see only tasks that are part of a specific process when processInstanceId is set', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setProcessInstanceId(processInstance.entry.id); await tasksCloudDemoPage.editTaskFilterCloudComponent().setStatusFilterDropDown('ALL'); + await tasksCloudDemoPage.editTaskFilterCloudComponent().clearAssignee(); await expect(await tasksCloudDemoPage.taskListCloudComponent().getDataTable().getNumberOfRows()).toBe(1); + await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByProcessInstanceId(processInstance.entry.id); }); it('[C297684] Should be able to see No tasks found when typing an invalid processInstanceId', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setProcessInstanceId('invalidTaskId'); await expect(await tasksCloudDemoPage.taskListCloudComponent().getNoTasksFoundMessage()).toEqual(noTasksFoundMessage); }); it('[C297478] Should be able to see only tasks that are assigned to a specific user when assignee is set', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setAssignee('admin.adf'); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(createdTask.entry.name); @@ -206,18 +184,12 @@ describe('Edit task filters and task list properties', () => { }); it('[C297686] Should be able to see No tasks found when typing an invalid user to assignee field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setAssignee('invalid'); await expect(await tasksCloudDemoPage.taskListCloudComponent().getNoTasksFoundMessage()).toEqual(noTasksFoundMessage); }); it('[C297482] Should be able to see only tasks with specific priority when priority is set', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setPriority(priority); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(priorityTask.entry.name); @@ -225,17 +197,12 @@ describe('Edit task filters and task list properties', () => { }); it('[C297687] Should be able to see No tasks found when typing unused value for priority field', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); await tasksCloudDemoPage.editTaskFilterCloudComponent().setPriority('87650'); await expect(await tasksCloudDemoPage.taskListCloudComponent().getNoTasksFoundMessage()).toEqual(noTasksFoundMessage); }); it('[C297481] Should be able to see only tasks with specific parentTaskId when parentTaskId is set', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setParentTaskId(subTask.entry.parentTaskId); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(subTask.entry.name); @@ -243,9 +210,6 @@ describe('Edit task filters and task list properties', () => { }); it('[C297486] Filter by Owner', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setStatusFilterDropDown('ALL'); await tasksCloudDemoPage.editTaskFilterCloudComponent().clearAssignee(); await tasksCloudDemoPage.editTaskFilterCloudComponent().setOwner(testUser.username); @@ -259,9 +223,6 @@ describe('Edit task filters and task list properties', () => { }); it('[C297484] Task is displayed when typing into lastModifiedFrom field a date before the task CreatedDate', async() => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedFrom(beforeDate); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(createdTask.entry.name); @@ -270,17 +231,11 @@ describe('Edit task filters and task list properties', () => { }); it('[C297689] Task is not displayed when typing into lastModifiedFrom field the same date as tasks CreatedDate', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedFrom(currentDate); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(createdTask.entry.name); }); it('[C297485] Task is displayed when typing into lastModifiedTo field a date after the task CreatedDate', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedFrom(afterDate); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsDisplayedByName(createdTask.entry.name); @@ -289,19 +244,12 @@ describe('Edit task filters and task list properties', () => { }); it('[C297690] Task is not displayed when typing into lastModifiedTo field the same date as tasks CreatedDate', async () => { - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedTo(currentDate); await tasksCloudDemoPage.taskListCloudComponent().checkContentIsNotDisplayedByName(createdTask.entry.name); }); it('[C297691] Task is not displayed when typing into lastModifiedFrom field a date before the task due date ' + 'and into lastModifiedTo a date before task due date', async () => { - - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedFrom(beforeDate); await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedTo(beforeDate); await tasksCloudDemoPage.editTaskFilterCloudComponent().setTaskName(createdTask.entry.name); @@ -310,10 +258,6 @@ describe('Edit task filters and task list properties', () => { it('[C297692] Task is displayed when typing into lastModifiedFrom field a date before the tasks due date ' + 'and into lastModifiedTo a date after', async () => { - - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedFrom(beforeDate); await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedTo(afterDate); await tasksCloudDemoPage.editTaskFilterCloudComponent().setTaskName(createdTask.entry.name); @@ -322,10 +266,6 @@ describe('Edit task filters and task list properties', () => { it('[C297693] Task is not displayed when typing into lastModifiedFrom field a date after the tasks due date ' + 'and into lastModifiedTo a date after', async () => { - - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); - await expect(await tasksCloudDemoPage.taskFilterCloudComponent.getActiveFilterName()).toBe('My Tasks'); - await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedFrom(afterDate); await tasksCloudDemoPage.editTaskFilterCloudComponent().setLastModifiedTo(afterDate); await expect(await tasksCloudDemoPage.taskListCloudComponent().getNoTasksFoundMessage()).toEqual(noTasksFoundMessage); diff --git a/e2e/process-services-cloud/task-list-selection.e2e.ts b/e2e/process-services-cloud/task-list-selection.e2e.ts index 9a1faebf48..df6993336e 100644 --- a/e2e/process-services-cloud/task-list-selection.e2e.ts +++ b/e2e/process-services-cloud/task-list-selection.e2e.ts @@ -73,7 +73,7 @@ describe('Task list cloud - selection', () => { await navigationBarPage.navigateToProcessServicesCloudPage(); await appListCloudComponent.checkApsContainer(); await appListCloudComponent.goToApp(simpleApp); - await tasksCloudDemoPage.taskFilterCloudComponent.checkMyTasksFilterIsDisplayed(); + await tasksCloudDemoPage.taskFilterCloudComponent.checkTaskFilterIsDisplayed('my-tasks'); await tasksCloudDemoPage.clickSettingsButton(); await tasksCloudDemoPage.disableDisplayTaskDetails(); await tasksCloudDemoPage.clickAppButton(); diff --git a/e2e/process-services/info-drawer.e2e.ts b/e2e/process-services/info-drawer.e2e.ts index 466be367e5..1654dcfc2c 100644 --- a/e2e/process-services/info-drawer.e2e.ts +++ b/e2e/process-services/info-drawer.e2e.ts @@ -45,7 +45,8 @@ describe('Info Drawer', () => { const date = { form: '12/08/2017', - header: 'Aug 12, 2017' + header: 'Aug 12, 2017', + dateFormat: 'll' }; const taskDetails = { @@ -65,19 +66,19 @@ describe('Info Drawer', () => { beforeAll(async () => { const users = new UsersActions(); - this.alfrescoJsApi = new AlfrescoApi({ + this.alfrescoApi = new AlfrescoApi({ provider: 'BPM', hostBpm: browser.params.testConfig.adf_aps.host }); - await this.alfrescoJsApi.login(browser.params.testConfig.adf.adminEmail, browser.params.testConfig.adf.adminPassword); - newTenant = await this.alfrescoJsApi.activiti.adminTenantsApi.createTenant(new Tenant()); - const assigneeUserModel = await users.createApsUser(this.alfrescoJsApi, newTenant.id); + await this.alfrescoApi.login(browser.params.testConfig.adf.adminEmail, browser.params.testConfig.adf.adminPassword); + newTenant = await this.alfrescoApi.activiti.adminTenantsApi.createTenant(new Tenant()); + const assigneeUserModel = await users.createApsUser(this.alfrescoApi, newTenant.id); assigneeUserModelFullName = assigneeUserModel.firstName + ' ' + assigneeUserModel.lastName; - const processUserModel = await users.createApsUser(this.alfrescoJsApi, newTenant.id); + const processUserModel = await users.createApsUser(this.alfrescoApi, newTenant.id); processUserModelFullName = processUserModel.firstName + ' ' + processUserModel.lastName; - await this.alfrescoJsApi.login(processUserModel.email, processUserModel.password); - const applicationsService = new ApplicationsUtil(this.alfrescoJsApi); + await this.alfrescoApi.login(processUserModel.email, processUserModel.password); + const applicationsService = new ApplicationsUtil(this.alfrescoApi); appCreated = await applicationsService.importPublishDeployApp(app.file_path); await loginPage.loginToProcessServicesUsingUserModel(processUserModel); @@ -85,8 +86,8 @@ describe('Info Drawer', () => { afterAll(async () => { await this.alfrescoApi.activiti.modelsApi.deleteModel(appCreated.id); - await this.alfrescoJsApi.login(browser.params.testConfig.adf.adminEmail, browser.params.testConfig.adf.adminPassword); - await this.alfrescoJsApi.activiti.adminTenantsApi.deleteTenant(newTenant.id); + await this.alfrescoApi.login(browser.params.testConfig.adf.adminEmail, browser.params.testConfig.adf.adminPassword); + await this.alfrescoApi.activiti.adminTenantsApi.deleteTenant(newTenant.id); }); beforeEach(async () => { @@ -96,7 +97,7 @@ describe('Info Drawer', () => { it('[C260319] New Task - displayed details', async () => { const name = StringUtil.generateRandomString(5); - await taskPage.createTask({...taskDetails, formName: app.formName, name}); + await taskPage.createTask({ ...taskDetails, formName: app.formName, name }); await taskPage.tasksListPage().checkTaskListIsLoaded(); await taskPage.tasksListPage().getDataTable().waitForTableBody(); await taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.INV_TASKS); @@ -122,7 +123,7 @@ describe('Info Drawer', () => { it('[C260323] Priority - Editing field', async () => { const name = StringUtil.generateRandomString(5); - await taskPage.createTask({...taskDetails, formName: app.formName, name}); + await taskPage.createTask({ ...taskDetails, formName: app.formName, name }); await taskPage.tasksListPage().checkTaskListIsLoaded(); await taskPage.tasksListPage().getDataTable().waitForTableBody(); await taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.INV_TASKS); @@ -141,7 +142,7 @@ describe('Info Drawer', () => { it('[C260325] Due Date - Changing', async () => { const name = StringUtil.generateRandomString(5); - await taskPage.createTask({...taskDetails, formName: app.formName, name}); + await taskPage.createTask({ ...taskDetails, formName: app.formName, name }); await taskPage.tasksListPage().checkTaskListIsLoaded(); await taskPage.tasksListPage().getDataTable().waitForTableBody(); await taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.INV_TASKS); @@ -184,7 +185,7 @@ describe('Info Drawer', () => { it('[C260329] Task with no form', async () => { const name = StringUtil.generateRandomString(5); - await taskPage.createTask( {...taskDetails, formName: '', name}); + await taskPage.createTask( { ...taskDetails, formName: '', name }); await taskPage.tasksListPage().checkTaskListIsLoaded(); await taskPage.tasksListPage().getDataTable().waitForTableBody(); await taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.INV_TASKS); @@ -202,7 +203,7 @@ describe('Info Drawer', () => { it('[C260320] Assign user to the task', async () => { const name = StringUtil.generateRandomString(5); - await taskPage.createTask( {...taskDetails, formName: app.formName, name}); + await taskPage.createTask( { ...taskDetails, formName: app.formName, name }); await taskPage.tasksListPage().checkTaskListIsLoaded(); await taskPage.tasksListPage().getDataTable().waitForTableBody(); await taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.MY_TASKS); @@ -218,7 +219,7 @@ describe('Info Drawer', () => { }); await expect(await taskPage.taskDetails().isAssigneeClickable()).toBeTruthy(); - await BrowserActions.click(taskPage.taskDetails().assigneeField); + await BrowserActions.click(taskPage.taskDetails().assigneeButton); const cancelSearch = element(by.css('button[id="close-people-search"]')); await BrowserVisibility.waitUntilElementIsPresent(cancelSearch); await BrowserActions.click(cancelSearch); @@ -231,7 +232,7 @@ describe('Info Drawer', () => { }); await expect(await taskPage.taskDetails().isAssigneeClickable()).toBeTruthy(); - await BrowserActions.click(taskPage.taskDetails().assigneeField); + await BrowserActions.click(taskPage.taskDetails().assigneeButton); const addPeople = element(by.css('button[id="add-people"]')); await BrowserVisibility.waitUntilElementIsPresent(addPeople); await BrowserActions.click(addPeople); @@ -289,7 +290,7 @@ describe('Info Drawer', () => { it('[C260328] Description - Editing field', async () => { const name = StringUtil.generateRandomString(5); - await taskPage.createTask({...taskDetails, formName: app.formName, name}); + await taskPage.createTask({ ...taskDetails, formName: app.formName, name }); await taskPage.tasksListPage().checkTaskListIsLoaded(); await taskPage.tasksListPage().getDataTable().waitForTableBody(); await taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.INV_TASKS); @@ -305,10 +306,10 @@ describe('Info Drawer', () => { formName: app.formName }); + await taskPage.taskDetails().updateDescription(''); + await expect(await taskPage.taskDetails().getDescriptionPlaceholder()).toEqual('No description'); await taskPage.taskDetails().updateDescription('Good Bye'); await expect(await taskPage.taskDetails().getDescription()).toEqual('Good Bye'); - await taskPage.taskDetails().updateDescription(); - await expect(await taskPage.taskDetails().getDescription()).toEqual('No description'); await taskPage.taskDetails().clickCompleteFormTask(); }); @@ -317,7 +318,7 @@ describe('Info Drawer', () => { await LocalStorageUtil.setConfigField('adf-task-header', JSON.stringify(infoDrawerConfiguration)); const name = StringUtil.generateRandomString(5); - await taskPage.createTask({...taskDetails, formName: app.formName, name}); + await taskPage.createTask({ ...taskDetails, formName: app.formName, name }); await taskPage.tasksListPage().checkTaskListIsLoaded(); await taskPage.tasksListPage().getDataTable().waitForTableBody(); await taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.MY_TASKS); @@ -330,12 +331,11 @@ describe('Info Drawer', () => { await expect(await taskPage.taskDetails().getPriority()).toEqual(taskDetails.priority); await expect(await taskPage.taskDetails().getParentName()).toEqual(taskDetails.parentName); await taskPage.taskDetails().checkDueDatePickerButtonIsNotDisplayed(); - await taskPage.taskDetails().checkEditDescriptionButtonIsNotDisplayed(); await taskPage.taskDetails().clickCompleteFormTask(); }); - async function shouldHaveInfoDrawerDetails({description, status, priority, category, parentName, dateFormat, formName, fullName, dueDate}) { + async function shouldHaveInfoDrawerDetails({ description, status, priority, category, parentName, dateFormat, formName, fullName, dueDate }) { await expect(await taskPage.taskDetails().getAssignee()).toEqual(fullName); await expect(await taskPage.taskDetails().getDescription()).toEqual(description); await expect(await taskPage.taskDetails().getStatus()).toEqual(status); diff --git a/e2e/process-services/task-details.e2e.ts b/e2e/process-services/task-details.e2e.ts index 7e28a1684f..223eda713e 100644 --- a/e2e/process-services/task-details.e2e.ts +++ b/e2e/process-services/task-details.e2e.ts @@ -323,8 +323,6 @@ describe('Task Details component', () => { await taskPage.taskDetails().checkEditableAssigneeIsNotDisplayed(); await taskPage.taskDetails().checkEditableFormIsNotDisplayed(); - await taskPage.taskDetails().checkEditDescriptionButtonIsNotDisplayed(); - await taskPage.taskDetails().checkEditPriorityButtonIsNotDisplayed(); await taskPage.taskDetails().checkDueDatePickerButtonIsNotDisplayed(); }); }); diff --git a/e2e/process-services/widgets/people-group-widget.e2e.ts b/e2e/process-services/widgets/people-group-widget.e2e.ts index 69d0827b8b..bb601eb85e 100644 --- a/e2e/process-services/widgets/people-group-widget.e2e.ts +++ b/e2e/process-services/widgets/people-group-widget.e2e.ts @@ -74,7 +74,8 @@ describe('People and Group widget', () => { await widget.groupWidget().insertGroup(groupVisibilityForm.FIELD.widget_id, groupVisibilityForm.searchTerm); await widget.groupWidget().checkDropDownListIsDisplayed(); - await expect(await widget.groupWidget().getDropDownList()).toEqual([ 'Heros', 'Users' ]); + const suggestions = await widget.groupWidget().getDropDownList(); + await expect(suggestions.sort()).toEqual([ 'Heros', 'Users' ]); await widget.groupWidget().selectGroupFromDropDown('Users'); await taskPage.taskDetails().clickCompleteFormTask(); }); diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html index b813ba75b5..7b463bd9a5 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html @@ -1,9 +1,9 @@
- - + + {{ 'CORE.METADATA.BASIC.HEADER' | translate }} @@ -23,10 +23,11 @@ -
+
+ [attr.data-automation-id]="'adf-metadata-group-' + group.title" + [expanded]="canExpandTheCard(group) || !displayDefaultProperties && first"> {{ group.title | translate }} @@ -51,4 +52,18 @@ + +
+ + +
+
diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.scss b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.scss index a84f2cccc2..cd9273281e 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.scss +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.scss @@ -13,9 +13,15 @@ height: 64px; } - .mat-expansion-panel:not([class*=mat-elevation-z]) { + .mat-expansion-panel:not([class*='mat-elevation-z']) { box-shadow: none; } } + + &-metadata-action-buttons { + display: flex; + justify-content: space-evenly; + margin: 10px; + } } } diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts index 9025822b81..f8421e4247 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { async, ComponentFixture, TestBed, tick, fakeAsync } from '@angular/core/testing'; import { SimpleChange } from '@angular/core'; import { By } from '@angular/platform-browser'; import { Node } from '@alfresco/js-api'; @@ -108,49 +108,47 @@ describe('ContentMetadataComponent', () => { }); describe('Saving', () => { - it('should save the node on itemUpdate', () => { - const property = { key: 'property-key', value: 'original-value' }; - spyOn(nodesApiService, 'updateNode').and.callThrough(); - + it('itemUpdate', fakeAsync(() => { + spyOn(component, 'updateChanges').and.callThrough(); + const property = { key: 'properties.property-key', value: 'original-value' }; updateService.update(property, 'updated-value'); - expect(nodesApiService.updateNode).toHaveBeenCalledWith('node-id', { - 'property-key': 'updated-value' - }); - }); + tick(600); + expect(component.hasMetadataChanged).toEqual(true); + expect(component.updateChanges).toHaveBeenCalled(); + expect(component.changedProperties).toEqual({ properties: { 'property-key': 'updated-value' } }); + })); - it('should update the node on successful save', async(() => { - const property = { key: 'property-key', value: 'original-value' }; + it('should save changedProperties on save click', fakeAsync(async () => { + component.editable = true; + const property = { key: 'properties.property-key', value: 'original-value' }; const expectedNode = Object.assign({}, node, { name: 'some-modified-value' }); - spyOn(nodesApiService, 'updateNode').and.callFake(() => { return of(expectedNode); }); updateService.update(property, 'updated-value'); + tick(600); - fixture.whenStable().then(() => { - expect(component.node).toEqual(expectedNode); - }); + fixture.detectChanges(); + await fixture.whenStable(); + const saveButton = fixture.debugElement.query(By.css('[data-automation-id="save-metadata"]')); + saveButton.nativeElement.click(); + + await fixture.whenStable(); + expect(component.node).toEqual(expectedNode); + expect(nodesApiService.updateNode).toHaveBeenCalled(); })); - it('should throw error on unsuccessful save', () => { - const property = { key: 'property-key', value: 'original-value' }; + it('should throw error on unsuccessful save', fakeAsync(async (done) => { const logService: LogService = TestBed.get(LogService); - - spyOn(nodesApiService, 'updateNode').and.callFake(() => { - return throwError(new Error('My bad')); - }); - + component.editable = true; + const property = { key: 'properties.property-key', value: 'original-value' }; updateService.update(property, 'updated-value'); - - expect(logService.error).toHaveBeenCalledWith(new Error('My bad')); - }); - - it('should raise error message', (done) => { - const property = { key: 'property-key', value: 'original-value' }; + tick(600); const sub = contentMetadataService.error.subscribe((err) => { + expect(logService.error).toHaveBeenCalledWith(new Error('My bad')); expect(err.statusCode).toBe(0); expect(err.message).toBe('METADATA.ERRORS.GENERIC'); sub.unsubscribe(); @@ -161,8 +159,33 @@ describe('ContentMetadataComponent', () => { return throwError(new Error('My bad')); }); - updateService.update(property, 'updated-value'); - }); + fixture.detectChanges(); + await fixture.whenStable(); + const saveButton = fixture.debugElement.query(By.css('[data-automation-id="save-metadata"]')); + saveButton.nativeElement.click(); + fixture.detectChanges(); + })); + }); + + describe('Reseting', () => { + it('should reset changedProperties on reset click', async(async () => { + component.changedProperties = { properties: { 'property-key': 'updated-value' } }; + component.hasMetadataChanged = true; + component.editable = true; + const expectedNode = Object.assign({}, node, { name: 'some-modified-value' }); + spyOn(nodesApiService, 'updateNode').and.callFake(() => { + return of(expectedNode); + }); + + fixture.detectChanges(); + await fixture.whenStable(); + const resetButton = fixture.debugElement.query(By.css('[data-automation-id="reset-metadata"]')); + resetButton.nativeElement.click(); + + fixture.detectChanges(); + expect(component.changedProperties).toEqual({}); + expect(nodesApiService.updateNode).not.toHaveBeenCalled(); + })); }); describe('Properties loading', () => { @@ -271,14 +294,16 @@ describe('ContentMetadataComponent', () => { it('should display card views group when there is at least one property that is not empty', async(() => { component.expanded = true; fixture.detectChanges(); - const cardViewGroup = {title: 'Group 1', properties: [{ - data: null, - default: null, - displayValue: 'DefaultName', - icon: '', - key: 'properties.cm:default', - label: 'To' - }]}; + const cardViewGroup = { + title: 'Group 1', properties: [{ + data: null, + default: null, + displayValue: 'DefaultName', + icon: '', + key: 'properties.cm:default', + label: 'To' + }] + }; spyOn(contentMetadataService, 'getGroupedProperties').and.returnValue(of([{ properties: [cardViewGroup] }])); component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) }); @@ -317,9 +342,9 @@ describe('ContentMetadataComponent', () => { let expectedNode; beforeEach(() => { - expectedNode = Object.assign({}, node, {name: 'some-modified-value'}); + expectedNode = Object.assign({}, node, { name: 'some-modified-value' }); spyOn(contentMetadataService, 'getGroupedProperties').and.returnValue(of(mockGroupProperties)); - component.ngOnChanges({node: new SimpleChange(node, expectedNode, false)}); + component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) }); }); it('should open and update drawer with expand section dynamically', async(() => { @@ -373,7 +398,7 @@ describe('ContentMetadataComponent', () => { describe('events', () => { it('should not propagate the event on left arrows press', () => { fixture.detectChanges(); - const event = { keyCode: 37, stopPropagation: () => {} }; + const event = { keyCode: 37, stopPropagation: () => { } }; spyOn(event, 'stopPropagation').and.stub(); const element = fixture.debugElement.query(By.css('adf-card-view')); element.triggerEventHandler('keydown', event); @@ -382,7 +407,7 @@ describe('ContentMetadataComponent', () => { it('should not propagate the event on right arrows press', () => { fixture.detectChanges(); - const event = { keyCode: 39, stopPropagation: () => {} }; + const event = { keyCode: 39, stopPropagation: () => { } }; spyOn(event, 'stopPropagation').and.stub(); const element = fixture.debugElement.query(By.css('adf-card-view')); element.triggerEventHandler('keydown', event); @@ -391,7 +416,7 @@ describe('ContentMetadataComponent', () => { it('should propagate the event on other keys press', () => { fixture.detectChanges(); - const event = { keyCode: 40, stopPropagation: () => {} }; + const event = { keyCode: 40, stopPropagation: () => { } }; spyOn(event, 'stopPropagation').and.stub(); const element = fixture.debugElement.query(By.css('adf-card-view')); element.triggerEventHandler('keydown', event); @@ -401,5 +426,5 @@ describe('ContentMetadataComponent', () => { }); function queryDom(fixture: ComponentFixture, properties: string = 'properties') { - return fixture.debugElement.query(By.css(`[data-automation-id="adf-metadata-group-${properties}"]`)); + return fixture.debugElement.query(By.css(`[data-automation-id="adf-metadata-group-${properties}"]`)); } diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts index b518cdf5c1..989883e6eb 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts @@ -25,11 +25,12 @@ import { CardViewUpdateService, AlfrescoApiService, TranslationService, - AppConfigService + AppConfigService, + CardViewBaseItemModel } from '@alfresco/adf-core'; import { ContentMetadataService } from '../../services/content-metadata.service'; import { CardViewGroup } from '../../interfaces/content-metadata.interfaces'; -import { switchMap, takeUntil, catchError } from 'rxjs/operators'; +import { takeUntil, debounceTime, catchError } from 'rxjs/operators'; @Component({ selector: 'adf-content-metadata', @@ -90,6 +91,10 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy { basicProperties$: Observable; groupedProperties$: Observable; + changedProperties = {}; + hasMetadataChanged = false; + private targetProperty: CardViewBaseItemModel; + constructor( private contentMetadataService: ContentMetadataService, private cardViewUpdateService: CardViewUpdateService, @@ -107,23 +112,13 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy { ngOnInit() { this.cardViewUpdateService.itemUpdated$ .pipe( - switchMap((changes) => - this.saveNode(changes).pipe( - catchError((err) => { - this.cardViewUpdateService.updateElement(changes.target); - this.handleUpdateError(err); - return of(null); - }) - ) - ), - takeUntil(this.onDestroy$) - ) + debounceTime(500), + takeUntil(this.onDestroy$)) .subscribe( (updatedNode) => { - if (updatedNode) { - Object.assign(this.node, updatedNode); - this.alfrescoApiService.nodeUpdated.next(this.node); - } + this.hasMetadataChanged = true; + this.targetProperty = updatedNode.target; + this.updateChanges(updatedNode.changed); } ); @@ -165,8 +160,43 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy { } } - private saveNode({ changed: nodeBody }): Observable { - return this.nodesApiService.updateNode(this.node.id, nodeBody); + updateChanges(updatedNodeChanges) { + Object.keys(updatedNodeChanges).map((propertyGroup: string) => { + if (typeof updatedNodeChanges[propertyGroup] === 'object') { + this.changedProperties[propertyGroup] = { + ...this.changedProperties[propertyGroup], + ...updatedNodeChanges[propertyGroup] + }; + } else { + this.changedProperties[propertyGroup] = updatedNodeChanges[propertyGroup]; + } + }); + } + + saveChanges() { + this.nodesApiService.updateNode(this.node.id, this.changedProperties).pipe( + catchError((err) => { + this.cardViewUpdateService.updateElement(this.targetProperty); + this.handleUpdateError(err); + return of(null); + })) + .subscribe((updatedNode) => { + if (updatedNode) { + this.revertChanges(); + Object.assign(this.node, updatedNode); + this.alfrescoApiService.nodeUpdated.next(this.node); + } + }); + } + + revertChanges() { + this.changedProperties = {}; + this.hasMetadataChanged = false; + } + + cancelChanges() { + this.revertChanges(); + this.loadProperties(this.node); } showGroup(group: CardViewGroup): boolean { @@ -195,5 +225,4 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy { event.stopPropagation(); } } - } diff --git a/lib/core/card-view/card-view.module.scss b/lib/core/card-view/card-view.module.scss index 1aa461ff72..577c001802 100644 --- a/lib/core/card-view/card-view.module.scss +++ b/lib/core/card-view/card-view.module.scss @@ -1,12 +1,14 @@ @import './components/card-view-arrayitem/card-view-arrayitem.component'; @import './components/card-view-dateitem/card-view-dateitem.component'; @import './components/card-view-textitem/card-view-textitem.component'; +@import './components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component'; @import './components/card-view/card-view.component'; @import '~@mat-datetimepicker/core/datetimepicker/datetimepicker-theme.scss'; @mixin adf-card-view-module-theme($theme) { @include adf-card-view-dateitem-theme($theme); @include adf-card-view-textitem-theme($theme); + @include adf-card-view-keyvaluepairsitem-theme($theme); @include adf-card-view-theme($theme); @include mat-datetimepicker-theme($theme); @include adf-card-view-array-item-theme($theme); diff --git a/lib/core/card-view/card-view.module.ts b/lib/core/card-view/card-view.module.ts index c11b6cf14b..a0e4e4ac22 100644 --- a/lib/core/card-view/card-view.module.ts +++ b/lib/core/card-view/card-view.module.ts @@ -30,7 +30,8 @@ import { MatChipsModule, MatMenuModule, MatCardModule, - MatTooltipModule + MatTooltipModule, + MatSlideToggleModule } from '@angular/material'; import { MatDatetimepickerModule, MatNativeDatetimeModule } from '@mat-datetimepicker/core'; import { FlexLayoutModule } from '@angular/flex-layout'; @@ -66,6 +67,7 @@ import { CardViewArrayItemComponent } from './components/card-view-arrayitem/car MatCardModule, MatDatetimepickerModule, MatNativeDatetimeModule, + MatSlideToggleModule, MatTooltipModule ], declarations: [ diff --git a/lib/core/card-view/components/card-view-arrayitem/card-view-arrayitem.component.scss b/lib/core/card-view/components/card-view-arrayitem/card-view-arrayitem.component.scss index f665e2739a..f1198329d1 100644 --- a/lib/core/card-view/components/card-view-arrayitem/card-view-arrayitem.component.scss +++ b/lib/core/card-view/components/card-view-arrayitem/card-view-arrayitem.component.scss @@ -41,6 +41,8 @@ &-property-value { .mat-chip-list { + width: 100%; + padding-top: 6px; cursor: pointer; } .mat-chip { diff --git a/lib/core/card-view/components/card-view-boolitem/card-view-boolitem.component.html b/lib/core/card-view/components/card-view-boolitem/card-view-boolitem.component.html index e8443a6078..5fb76cda4c 100644 --- a/lib/core/card-view/components/card-view-boolitem/card-view-boolitem.component.html +++ b/lib/core/card-view/components/card-view-boolitem/card-view-boolitem.component.html @@ -1,12 +1,13 @@ -
{{ property.label | translate }}
- + +
{{ property.label | translate }}
diff --git a/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.html b/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.html index 0ef4b88a3b..1b4fe189ec 100644 --- a/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.html +++ b/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.html @@ -1,8 +1,10 @@ -
{{ property.label | translate }}
+ *ngIf="showProperty() || isEditable()"> + {{ property.label | translate }} +
-
+
diff --git a/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.scss b/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.scss index 3775aa660b..e9d3e17c52 100644 --- a/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.scss +++ b/lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.scss @@ -1,4 +1,6 @@ @mixin adf-card-view-dateitem-theme($theme) { + $foreground: map-get($theme, foreground); + .adf { &-invisible-date-input { height: 2px; @@ -13,6 +15,8 @@ &-dateitem-editable { cursor: pointer; + border-bottom: 1px solid mat-color($foreground, text, 0.42); + padding-bottom: 6px; &-controls { display: flex; diff --git a/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.html b/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.html index fabf74bbb7..2604530638 100644 --- a/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.html +++ b/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.html @@ -1,21 +1,20 @@ -
{{ property.label | translate }}
-
+
{{ property.label | translate }}
+
-
- {{ 'CORE.CARDVIEW.KEYVALUEPAIRS.ADD' | translate }} - -
- -
- +
+ - {{ 'CORE.CARDVIEW.KEYVALUEPAIRS.NAME' | translate }} + {{ 'CORE.CARDVIEW.KEYVALUEPAIRS.NAME' | translate }} + {{item.name}} - {{ 'CORE.CARDVIEW.KEYVALUEPAIRS.VALUE' | translate }} + {{ 'CORE.CARDVIEW.KEYVALUEPAIRS.VALUE' | translate }} + {{item.value}} @@ -25,15 +24,17 @@
-
+
{{ 'CORE.CARDVIEW.KEYVALUEPAIRS.NAME' | translate }}
{{ 'CORE.CARDVIEW.KEYVALUEPAIRS.VALUE' | translate }}
-
+
- +
- + +
-
+
+ +
diff --git a/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.scss b/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.scss index 8b849c92ee..7ea0c3628f 100644 --- a/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.scss +++ b/lib/core/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.scss @@ -1,21 +1,45 @@ -.adf-card-view { - &__key-value-pairs { - &__col { - display: inline-block; - width: 39%; +@mixin adf-card-view-keyvaluepairsitem-theme($theme) { + $foreground: map-get($theme, foreground); - .mat-form-field { + .adf-card-view { + &__key-value-pairs { + &__row { + display: flex; + justify-content: center; + } + + &__col { width: 100%; - } - } - &__read-only { - .mat-table { - box-shadow: none; + .mat-form-field { + width: 100%; + font-size: 14px; + } + + .mat-form-field-appearance-legacy .mat-form-field-label { + color: mat-color($foreground, text, 0.4) !important; + } } - .mat-header-row, .mat-row { - padding: 0; + &__add-btn-container { + display: flex; + justify-content: center; + } + + &__add-btn.mat-button { + margin-bottom: 20px; + } + + &__read-only { + padding-bottom: 20px; + + .mat-table { + box-shadow: none; + } + + .mat-header-row, .mat-row { + padding: 0; + } } } } diff --git a/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.html b/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.html index 1dc68d5da3..c3f9f10df1 100644 --- a/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.html +++ b/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.html @@ -1,16 +1,21 @@ -
{{ property.label | translate }}
-
+
{{ property.label | translate }}
+
- + {{ property.displayValue }} - - - {{ property.displayValue }} - -
- + + + {{ property.displayValue }} + + + {{ property.default | translate }}
diff --git a/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.scss b/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.scss index c431673932..9781dd47ee 100644 --- a/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.scss +++ b/lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.scss @@ -2,4 +2,8 @@ &-mapitem-clickable-value { cursor: pointer !important; } + + &-map-item-padding { + padding-top: 6px; + } } diff --git a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.html b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.html index 508135a440..3ccf1dc7bf 100644 --- a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.html +++ b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.html @@ -1,14 +1,20 @@ -
{{ property.label | translate }}
-
-
{{ property.displayValue | async }}
+
{{ property.label | translate }}
+
+
{{ property.displayValue | async }}
- - - {{ 'CORE.CARDVIEW.NONE' | translate }} - - {{ option.label | translate }} - + + + {{ 'CORE.CARDVIEW.NONE' | translate }} + + {{ option.label | translate }} + - +
diff --git a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.scss b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.scss index 1646827eea..c704ebee9e 100644 --- a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.scss +++ b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.scss @@ -1,3 +1,13 @@ .mat-form-field-type-mat-select { width: 100%; } + +.adf-select-item-padding { + padding-top: 6px; + padding-bottom: 20px; +} + +.adf-select-item-padding-editable { + padding-top: 6px; + padding-bottom: 6px; +} diff --git a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html index b8b69c5c69..0475c0f5a5 100644 --- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html +++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html @@ -1,151 +1,124 @@ -
{{ property.label | translate }}
-
- - - - - {{ property.displayValue }} - - - {{ property.displayValue }} - - - - -
- - {{ property.displayValue }} - - -
- - - -
- - {{ property.displayValue }} - +
+
+ {{ property.label | translate }} +
- -
-
-
- - - -
- - - {{ propertyValue }} - cancel - - - -
- - + mode_edit -
- clear - -
- -
    -
  • {{ errorMessage | translate }}
    • -
- -
- - - {{ property.default | translate }} - + +
    +
  • {{ errorMessage | translate }}
    • +
+ - - - +
+ + {{ propertyValue }} + cancel - + + + + mode_edit + +
+ +
+ + + + + +
+ +
+ {{ property.default | translate }} +
diff --git a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.scss b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.scss index dc76f7d329..0f20b95da3 100644 --- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.scss +++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.scss @@ -5,17 +5,22 @@ $outline: 1px solid mat-color($alfresco-ecm-blue, A200) !default; .adf { - &-textitem-icon { + &-textitem-edit-icon.mat-icon { font-size: 16px; width: 16px; height: 16px; - } - - &-textitem-action { color: mat-color($foreground, text, 0.25); } - &-textitem-action:hover, &-textitem-action:focus { + &-textitem-action.mat-icon-button { + width: 20px; + height: 20px; + line-height: 20px; + color: mat-color($foreground, text, 0.25); + } + + &-textitem-action:hover, + &-textitem-action:focus { color: mat-color($foreground, text); } @@ -32,8 +37,23 @@ } } + &-textitem-chip-list-container { + margin-bottom: 25px !important; + margin-top: 6px; + + .mat-form-field-label { + margin-top: 6px; + } + } + &-textitem-clickable { cursor: pointer !important; + padding-top: 3px; + + .adf-textitem-edit-icon.mat-icon { + line-height: 16px; + } + &:hover .adf-textitem-action { color: mat-color($foreground, text); } @@ -41,11 +61,10 @@ &-textitem-clickable-value { cursor: pointer !important; - color: mat-color($primary); + color: mat-color($primary) !important; } &-textitem-editable { - &-controls { display: flex; align-items: center; @@ -148,5 +167,22 @@ &-textitem-multiline { display: block; } + + &-property-field .adf-property-clear-value { + display: none; + } + + &-property-field.adf-card-textitem-field:hover { + .adf-textitem-edit-icon { + display: none; + } + .adf-property-clear-value { + color: mat-color($foreground, text, 0.25); + display: inline; + } + .adf-property-clear-value:hover { + color: mat-color($foreground, text, 1); + } + } } } diff --git a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts index 5a181a7ac0..98cf2ff252 100644 --- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts +++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts @@ -22,15 +22,15 @@ import { CardViewUpdateService } from '../../services/card-view-update.service'; import { CardViewTextItemComponent } from './card-view-textitem.component'; import { setupTestBed } from '../../../testing/setup-test-bed'; import { CoreTestingModule } from '../../../testing/core.testing.module'; -import { CardViewItemFloatValidator, CardViewItemIntValidator } from '@alfresco/adf-core'; +import { CardViewItemFloatValidator, CardViewItemIntValidator, CardViewIntItemModel, CardViewFloatItemModel } from '@alfresco/adf-core'; import { MatChipsModule } from '@angular/material'; import { ClipboardService } from '../../../clipboard/clipboard.service'; +import { DebugElement } from '@angular/core'; describe('CardViewTextItemComponent', () => { let fixture: ComponentFixture; let component: CardViewTextItemComponent; - const mouseEvent = new MouseEvent('click'); setupTestBed({ imports: [ @@ -42,13 +42,6 @@ describe('CardViewTextItemComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(CardViewTextItemComponent); component = fixture.componentInstance; - component.property = new CardViewTextItemModel({ - label: 'Text label', - value: 'Lorem ipsum', - key: 'textkey', - default: 'FAKE-DEFAULT-KEY', - editable: false - }); }); afterEach(() => { @@ -57,34 +50,44 @@ describe('CardViewTextItemComponent', () => { describe('Rendering', () => { - it('should render the label and value', () => { + beforeEach(() => { + component.property = new CardViewTextItemModel({ + label: 'Text label', + value: 'Lorem ipsum', + key: 'textkey', + default: 'FAKE-DEFAULT-KEY', + editable: false + }); + }); + + it('should render the label and value', async () => { + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const labelValue = fixture.debugElement.query(By.css('.adf-property-label')); expect(labelValue).not.toBeNull(); expect(labelValue.nativeElement.innerText).toBe('Text label'); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('Lorem ipsum'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('Lorem ipsum'); }); - it('should render the displayName as value when available', () => { - let componentWithDisplayName: CardViewTextItemComponent; - componentWithDisplayName = fixture.componentInstance; - componentWithDisplayName.property = new CardViewTextItemModel({ + it('should render the displayName as value when available', async () => { + component.property = new CardViewTextItemModel({ label: 'Name label', value: { id: 123, displayName: 'User Name' }, key: 'namekey' }); + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('User Name'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('User Name'); }); - it('should render the default as value if the value is empty, editable is false and displayEmpty is true', () => { + it('should render the default as value if the value is empty, editable is false and displayEmpty is true', async () => { component.property = new CardViewTextItemModel({ label: 'Text label', value: '', @@ -93,14 +96,15 @@ describe('CardViewTextItemComponent', () => { editable: false }); component.displayEmpty = true; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('FAKE-DEFAULT-KEY'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('FAKE-DEFAULT-KEY'); }); - it('should render the default as value if the value is empty and editable true', () => { + it('should render the default as value if the value is empty and editable true', async () => { component.property = new CardViewTextItemModel({ label: 'Text label', value: '', @@ -109,50 +113,57 @@ describe('CardViewTextItemComponent', () => { editable: true }); component.editable = true; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('FAKE-DEFAULT-KEY'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('FAKE-DEFAULT-KEY'); }); - it('should render value when editable:true', () => { + it('should render value when editable:true', async () => { component.editable = true; component.property.editable = true; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('Lorem ipsum'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('Lorem ipsum'); }); it('should render the edit icon in case of editable:true', () => { component.editable = true; component.property.editable = true; + component.ngOnChanges(); fixture.detectChanges(); - const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.key}"]`)); + const editIcon = fixture.debugElement.query(By.css('.adf-textitem-edit-icon')); expect(editIcon).not.toBeNull('Edit icon should be shown'); }); - it('should NOT render the edit icon in case of editable:false', () => { + it('should NOT render the edit icon in case of editable:false', async () => { component.editable = false; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.key}"]`)); + const editIcon = fixture.debugElement.query(By.css('.adf-textitem-edit-icon')); expect(editIcon).toBeNull('Edit icon should NOT be shown'); }); - it('should NOT render the picker and toggle in case of editable:true but (general) editable:false', () => { + it('should NOT render the picker and toggle in case of editable:true but (general) editable:false', async () => { component.editable = false; component.property.editable = true; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.key}"]`)); expect(editIcon).toBeNull('Edit icon should NOT be shown'); }); - it('should render chips for multivalue properties when chips are enabled', () => { + it('should render chips for multivalue properties when chips are enabled', async () => { component.property = new CardViewTextItemModel({ label: 'Text label', value: ['item1', 'item2', 'item3'], @@ -164,6 +175,7 @@ describe('CardViewTextItemComponent', () => { component.useChipsForMultiValueProperty = true; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`)); expect(valueChips).not.toBeNull(); @@ -173,7 +185,7 @@ describe('CardViewTextItemComponent', () => { expect(valueChips[2].nativeElement.innerText.trim()).toBe('item3'); }); - it('should render string for multivalue properties when chips are disabled', () => { + it('should render string for multivalue properties when chips are disabled', async () => { component.property = new CardViewTextItemModel({ label: 'Text label', value: ['item1', 'item2', 'item3'], @@ -186,11 +198,11 @@ describe('CardViewTextItemComponent', () => { component.useChipsForMultiValueProperty = false; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueChips = fixture.debugElement.query(By.css(`mat-chip-list`)); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('item1,item2,item3'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('item1,item2,item3'); expect(valueChips).toBeNull(); }); }); @@ -201,97 +213,123 @@ describe('CardViewTextItemComponent', () => { label: 'Text label', value: '', key: 'textkey', - default: 'FAKE-DEFAULT-KEY' + default: 'FAKE-DEFAULT-KEY', + editable: false }); }); - it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', () => { + it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', async () => { component.property.clickable = false; component.displayEmpty = true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('FAKE-DEFAULT-KEY'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('FAKE-DEFAULT-KEY'); }); - it('should render the default as value if the value is empty and clickable true', () => { + it('should render the default as value if the value is empty and clickable true', async () => { component.property.clickable = true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('FAKE-DEFAULT-KEY'); + const value = getTextFieldValue(component.property.key); + expect(value).toBe('FAKE-DEFAULT-KEY'); }); - it('should not render the edit icon in case of clickable true but edit false', () => { + it('should not render the edit icon in case of clickable true but edit false', async () => { component.property.clickable = true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.icon}"]`)); + const value = fixture.debugElement.query(By.css('.adf-textitem-edit-icon')); expect(value).toBeNull(); }); - it('should not render the clickable icon in case editable set to false', () => { + it('should not render the clickable icon in case editable set to false', async () => { component.property.clickable = true; component.property.icon = 'create'; component.editable = false; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-textkey"]`)); + const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-${component.property.key}"]`)); expect(value).toBeNull('icon should NOT be shown'); }); - it('should render the defined clickable icon in case of clickable true and editable input set to true', () => { + it('should render the defined clickable icon in case of clickable true and editable input set to true', async () => { component.property.clickable = true; component.property.icon = 'FAKE_ICON'; component.editable = true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-textkey"]`)); + const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-${component.property.key}"]`)); expect(value).not.toBeNull(); expect(value.nativeElement.innerText).toBe('FAKE_ICON'); }); - it('should not render clickable icon in case of clickable true and icon undefined', () => { + it('should not render clickable icon in case of clickable true and icon undefined', async () => { component.property.clickable = true; component.editable = true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-textkey"]`)); + const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-${component.property.key}"]`)); expect(value).toBeNull('icon should NOT be shown'); }); - it('should not render the edit icon in case of clickable false and icon defined', () => { + it('should not render the edit icon in case of clickable false and icon defined', async () => { component.property.clickable = false; component.property.icon = 'FAKE_ICON'; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.icon}"]`)); expect(value).toBeNull('Edit icon should NOT be shown'); }); - it('should call back function when clickable property enabled', () => { + it('should call back function when clickable property enabled', async () => { const callBackSpy = jasmine.createSpy('callBack'); component.property.clickable = true; component.property.icon = 'FAKE_ICON'; component.property.clickCallBack = callBackSpy; component.editable = true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-textkey"]`)); + const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-${component.property.key}"]`)); expect(value.nativeElement.innerText).toBe('FAKE_ICON'); value.nativeElement.click(); expect(callBackSpy).toHaveBeenCalled(); }); - it('should click event to the event stream when clickable property enabled', () => { + it('should click event to the event stream when clickable property enabled', async () => { const cardViewUpdateService = TestBed.get(CardViewUpdateService); spyOn(cardViewUpdateService, 'clicked').and.stub(); component.property.clickable = true; component.property.icon = 'FAKE_ICON'; component.editable = false; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-toggle-${component.property.key}"]`)); @@ -299,46 +337,49 @@ describe('CardViewTextItemComponent', () => { expect(cardViewUpdateService.clicked).toHaveBeenCalled(); }); - it('should update input the value on click of save', () => { - component.property.clickable = true; + it('should update input the value on input updated', async (done) => { + const cardViewUpdateService = TestBed.get(CardViewUpdateService); + component.property.clickable = true; component.property.editable = true; component.editable = true; - component.editedValue = 'updated-value'; component.property.isValid = () => true; const expectedText = 'changed text'; - spyOn(component, 'update').and.callThrough(); - const cardViewUpdateService = TestBed.get(CardViewUpdateService); + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { expect(updateNotification.target).toEqual({ ...component.property }); expect(updateNotification.changed).toEqual({ textkey: expectedText }); disposableUpdate.unsubscribe(); + done(); }); updateTextField(component.property.key, expectedText); - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - - expect(component.update).toHaveBeenCalled(); + component.ngOnChanges(); fixture.detectChanges(); - expect(getFieldValue(component.property.key)).toEqual(expectedText); + expect(getTextFieldValue(component.property.key)).toEqual(expectedText); expect(component.property.value).toBe(expectedText); }); - it('should copy value to clipboard on double click', () => { + it('should copy value to clipboard on double click', async () => { const clipboardService = TestBed.get(ClipboardService); spyOn(clipboardService, 'copyContentToClipboard'); component.property.value = 'myValueToCopy'; component.property.icon = 'FAKE_ICON'; component.editable = false; + component.copyToClipboardAction = true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); fixture.detectChanges(); - const doubleClickEl = fixture.debugElement.query(By.css('span[class*="adf-textitem-value"]')); + const doubleClickEl = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); doubleClickEl.triggerEventHandler('dblclick', new MouseEvent('dblclick')); fixture.detectChanges(); @@ -348,79 +389,79 @@ describe('CardViewTextItemComponent', () => { }); describe('Update', () => { - const event = new MouseEvent('click'); beforeEach(() => { - component.editable = true; - component.property.editable = true; - component.inEdit = true; - component.editedValue = 'updated-value'; - fixture.detectChanges(); + component.property = new CardViewTextItemModel({ + label: 'Text label', + value: 'Lorem ipsum', + key: 'textkey', + default: 'FAKE-DEFAULT-KEY', + editable: true + }); }); - it('should call the isValid method with the edited value', () => { + it('should call the isValid method with the edited value', async () => { + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); + fixture.detectChanges(); + spyOn(component.property, 'isValid'); - component.editedValue = 'updated-value'; - - component.update(event); - + updateTextField(component.property.key, 'updated-value'); expect(component.property.isValid).toHaveBeenCalledWith('updated-value'); }); - it('should trigger the update event if the editedValue is valid', () => { + it('should trigger the update event if the editedValue is valid', async () => { component.property.isValid = () => true; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); + fixture.detectChanges(); const cardViewUpdateService = TestBed.get(CardViewUpdateService); - spyOn(cardViewUpdateService, 'update'); - component.editedValue = 'updated-value'; const property = { ...component.property }; - component.update(event); - + spyOn(cardViewUpdateService, 'update'); + updateTextField(component.property.key, 'updated-value'); expect(cardViewUpdateService.update).toHaveBeenCalledWith(property, 'updated-value'); }); - it('should NOT trigger the update event if the editedValue is invalid', () => { + it('should NOT trigger the update event if the editedValue is invalid', async () => { component.property.isValid = () => false; + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); + fixture.detectChanges(); const cardViewUpdateService = TestBed.get(CardViewUpdateService); + spyOn(cardViewUpdateService, 'update'); - - component.update(event); - + updateTextField(component.property.key, 'updated-value'); expect(cardViewUpdateService.update).not.toHaveBeenCalled(); }); - it('should set the errorMessages properly if the editedValue is invalid', () => { + it('should set the errorMessages properly if the editedValue is invalid', async () => { const expectedErrorMessages = ['Something went wrong']; component.property.isValid = () => false; component.property.getValidationErrors = () => expectedErrorMessages; - component.update(event); + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); + updateTextField(component.property.key, 'updated-value'); expect(component.errorMessages).toBe(expectedErrorMessages); }); - it('should update the property value after a successful update attempt', async(() => { + it('should update the property value after a successful update attempt', async () => { component.property.isValid = () => true; - component.update(event); + component.update(); + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); + expect(component.property.value).toBe(component.editedValue); + }); - fixture.whenStable().then(() => { - expect(component.property.value).toBe(component.editedValue); - }); - })); - - it('should switch back to readonly mode after an update attempt', async(() => { - component.property.isValid = () => true; - component.update(event); - - fixture.whenStable().then(() => { - expect(component.inEdit).toBeFalsy(); - }); - })); - - it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', (done) => { - const functionTestClick = () => { - done(); - }; + it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', async(async (done) => { + const functionTestClick = () => done(); component.property = new CardViewTextItemModel({ label: 'Text label', @@ -433,18 +474,21 @@ describe('CardViewTextItemComponent', () => { } }); component.displayEmpty = true; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - value.nativeElement.click(); - }); + const inputField = getTextField(component.property.key); + inputField.nativeElement.click(); + })); - it('should trigger an update event on the CardViewUpdateService [integration]', (done) => { - component.inEdit = false; + it('should trigger an update event on the CardViewUpdateService [integration]', async (done) => { component.property.isValid = () => true; const cardViewUpdateService = TestBed.get(CardViewUpdateService); const expectedText = 'changed text'; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe( (updateNotification) => { @@ -455,135 +499,54 @@ describe('CardViewTextItemComponent', () => { } ); - const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-toggle-${component.property.key}"]`)); - editIcon.nativeElement.dispatchEvent(new MouseEvent('click')); - fixture.detectChanges(); - - const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-editinput-${component.property.key}"]`)); - editInput.nativeElement.value = expectedText; - editInput.nativeElement.dispatchEvent(new Event('input')); - fixture.detectChanges(); - - const updateInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - updateInput.nativeElement.dispatchEvent(new MouseEvent('click')); + updateTextField(component.property.key, expectedText); }); - it('should update the value using the enter key', async(() => { - component.inEdit = false; + it('should update the value using the updateItem$ subject', async(async () => { component.property.isValid = () => true; const cardViewUpdateService = TestBed.get(CardViewUpdateService); const expectedText = 'changed text'; + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe( - (updateNotification) => { - expect(updateNotification.target).toEqual({ ...component.property }); - expect(updateNotification.changed).toEqual({ textkey: expectedText }); - disposableUpdate.unsubscribe(); - } - ); - - const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-toggle-${component.property.key}"]`)); - editIcon.nativeElement.dispatchEvent(new MouseEvent('click')); - fixture.detectChanges(); - - const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-editinput-${component.property.key}"]`)); - editInput.nativeElement.value = expectedText; - editInput.nativeElement.dispatchEvent(new Event('input')); - fixture.detectChanges(); - - const enterKeyboardEvent = new KeyboardEvent('keydown', { 'key': 'Enter' }); - editInput.nativeElement.dispatchEvent(enterKeyboardEvent); - fixture.detectChanges(); - - const textItemReadOnly = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(textItemReadOnly.nativeElement.textContent).toEqual(expectedText); - expect(component.property.value).toBe(expectedText); - })); - - it('should update the value using the updateItem$ subject', async(() => { - component.inEdit = false; - component.property.isValid = () => true; - const cardViewUpdateService = TestBed.get(CardViewUpdateService); - const expectedText = 'changed text'; - fixture.detectChanges(); - - const textItemReadOnly = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(textItemReadOnly.nativeElement.textContent).toEqual('Lorem ipsum'); + let value = getTextFieldValue(component.property.key); + expect(value).toEqual('Lorem ipsum'); expect(component.property.value).toBe('Lorem ipsum'); cardViewUpdateService.updateElement({ key: component.property.key, value: expectedText }); + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); - expect(textItemReadOnly.nativeElement.textContent).toEqual(expectedText); + value = getTextFieldValue(component.property.key); + expect(value).toEqual(expectedText); expect(component.property.value).toBe(expectedText); })); - it('should reset the value using the escape key', async(() => { - component.inEdit = false; - component.property.isValid = () => true; - fixture.detectChanges(); - - const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-toggle-${component.property.key}"]`)); - editIcon.nativeElement.dispatchEvent(new MouseEvent('click')); - fixture.detectChanges(); - - const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-editinput-${component.property.key}"]`)); - editInput.nativeElement.value = 'changed text'; - editInput.nativeElement.dispatchEvent(new Event('input')); - fixture.detectChanges(); - - const enterKeyboardEvent = new KeyboardEvent('keydown', { 'key': 'Escape' }); - editInput.nativeElement.dispatchEvent(enterKeyboardEvent); - fixture.detectChanges(); - - const textItemReadOnly = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`)); - expect(textItemReadOnly.nativeElement.textContent).toEqual('Lorem ipsum'); - expect(component.property.value).toBe('Lorem ipsum'); - })); - - it('should reset the value onclick of clear button', () => { - component.inEdit = false; - component.property.isValid = () => true; - spyOn(component, 'reset').and.callThrough(); - fixture.detectChanges(); - - updateTextField(component.property.key, 'changed text'); - - const clearButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-reset-${component.property.key}"]`)); - clearButton.nativeElement.click(); - expect(component.reset).toHaveBeenCalled(); - - fixture.detectChanges(); - - expect(getFieldValue(component.property.key)).toEqual('Lorem ipsum'); - expect(component.property.value).toBe('Lorem ipsum'); - }); - - it('should update multiline input the value on click of save', () => { - component.inEdit = false; + it('should update multiline input the value on input updated', async (done) => { component.property.isValid = () => true; component.property.multiline = true; const expectedText = 'changed text'; spyOn(component, 'update').and.callThrough(); const cardViewUpdateService = TestBed.get(CardViewUpdateService); + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { expect(updateNotification.target).toEqual({ ...component.property }); expect(updateNotification.changed).toEqual({ textkey: expectedText }); disposableUpdate.unsubscribe(); + done(); }); - updateTextArea(component.property.key, expectedText); - - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); + updateTextField(component.property.key, expectedText); expect(component.update).toHaveBeenCalled(); fixture.detectChanges(); - expect(getFieldValue(component.property.key)).toEqual(expectedText); + expect(getTextFieldValue(component.property.key)).toEqual(expectedText); expect(component.property.value).toBe(expectedText); }); }); @@ -592,88 +555,81 @@ describe('CardViewTextItemComponent', () => { let cardViewUpdateService: CardViewUpdateService; beforeEach(() => { - component.property.editable = true; - component.editable = true; - component.inEdit = false; - component.property.value = 10; - component.property.validators.push(new CardViewItemIntValidator()); - component.ngOnChanges(); - fixture.detectChanges(); cardViewUpdateService = TestBed.get(CardViewUpdateService); + component.property = new CardViewIntItemModel({ + label: 'Text label', + value: 10, + key: 'textkey', + default: 1, + editable: true + }); + component.editable = true; + component.property.validators.push(new CardViewItemIntValidator()); + }); - it('should show validation error when string passed', () => { - spyOn(component, 'update').and.callThrough(); + it('should show validation error when string passed', async () => { + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); updateTextField(component.property.key, 'update number'); - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); fixture.detectChanges(); - expect(component.update).toHaveBeenCalled(); - - const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); - expect(error.nativeElement.innerText).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); + const error = getTextFieldError(component.property.key); + expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); expect(component.property.value).toBe(10); }); - it('should show validation error for empty string', () => { - spyOn(component, 'update').and.callThrough(); + it('should show validation error for empty string', async () => { + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); updateTextField(component.property.key, ' '); - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); - fixture.detectChanges(); - const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); - expect(error.nativeElement.innerText).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); - + const error = getTextFieldError(component.property.key); + expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); + expect(component.property.value).toBe(10); expect(component.property.value).toBe(10); }); - it('should show validation error for float number', () => { - spyOn(component, 'update').and.callThrough(); + it('should show validation error for float number', async () => { + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); - updateTextField(component.property.key, 0.024); - - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); + updateTextField(component.property.key, 123.456); fixture.detectChanges(); - const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); - expect(error.nativeElement.innerText).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); - + const error = getTextFieldError(component.property.key); + expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); + expect(component.property.value).toBe(10); expect(component.property.value).toBe(10); }); - it('should show validation error for exceed the number limit (2147483648)', () => { - spyOn(component, 'update').and.callThrough(); + it('should show validation error for exceed the number limit (2147483648)', async () => { + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); updateTextField(component.property.key, 2147483648); - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); - fixture.detectChanges(); - const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); - expect(error.nativeElement.innerText).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); - + const error = getTextFieldError(component.property.key); + expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); + expect(component.property.value).toBe(10); expect(component.property.value).toBe(10); }); - it('should not show validation error for below the number limit (2147483647)', () => { - spyOn(component, 'update').and.callThrough(); + it('should not show validation error for below the number limit (2147483647)', async () => { + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); updateTextField(component.property.key, 2147483647); - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); - fixture.detectChanges(); const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); expect(error).toBeFalsy(); @@ -681,48 +637,27 @@ describe('CardViewTextItemComponent', () => { expect(component.property.value).toBe('2147483647'); }); - it('should reset the value onclick of clear button', () => { - spyOn(component, 'reset').and.callThrough(); - fixture.detectChanges(); - - updateTextField(component.property.key, 20); - - const clearButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-reset-${component.property.key}"]`)); - clearButton.nativeElement.click(); - expect(component.reset).toHaveBeenCalled(); - - fixture.detectChanges(); - const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); - expect(error).toBeFalsy(); - - expect(getFieldValue(component.property.key)).toEqual('10'); - expect(component.property.value).toBe(10); - }); - - it('should update input the value on click of save', () => { - component.property.multiline = true; + it('should update input the value on input updated', async (done) => { const expectedNumber = 2020; spyOn(component, 'update').and.callThrough(); + component.ngOnChanges(); fixture.detectChanges(); - expect(component.property.value).not.toEqual(expectedNumber); + await fixture.whenStable(); const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { expect(updateNotification.target).toEqual({ ...component.property }); expect(updateNotification.changed).toEqual({ textkey: expectedNumber.toString() }); disposableUpdate.unsubscribe(); + done(); }); - updateTextArea(component.property.key, expectedNumber); - - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); + updateTextField(component.property.key, expectedNumber); fixture.detectChanges(); const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); expect(error).toBeFalsy(); - expect(getFieldValue(component.property.key)).toEqual(expectedNumber.toString()); + expect(getTextFieldValue(component.property.key)).toEqual(expectedNumber.toString()); expect(component.property.value).toBe(expectedNumber.toString()); }); }); @@ -732,99 +667,92 @@ describe('CardViewTextItemComponent', () => { const floatValue = 77.33; beforeEach(() => { - component.property.editable = true; + cardViewUpdateService = TestBed.get(CardViewUpdateService); + component.property = new CardViewFloatItemModel({ + label: 'Text label', + value: floatValue, + key: 'textkey', + default: 'FAKE-DEFAULT-KEY', + editable: true + }); component.editable = true; - component.inEdit = false; - component.property.value = floatValue; component.property.validators.push(new CardViewItemFloatValidator()); + }); + + it('should show validation error when string passed', async () => { component.ngOnChanges(); fixture.detectChanges(); - cardViewUpdateService = TestBed.get(CardViewUpdateService); - }); + await fixture.whenStable(); - it('should show validation error when string passed', () => { - spyOn(component, 'update').and.callThrough(); - - updateTextField(component.property.key, ' '); - - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); + updateTextField(component.property.key, 'hello there'); fixture.detectChanges(); - const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); - expect(error.nativeElement.innerText).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR'); - + const error = getTextFieldError(component.property.key); + expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR'); expect(component.property.value).toBe(floatValue); }); - it('should show validation error for empty string', () => { - spyOn(component, 'update').and.callThrough(); + it('should show validation error for empty string', async () => { + component.ngOnChanges(); + fixture.detectChanges(); + await fixture.whenStable(); updateTextField(component.property.key, ' '); - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); - fixture.detectChanges(); - const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); - expect(error.nativeElement.innerText).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR'); - + const error = getTextFieldError(component.property.key); + expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR'); expect(component.property.value).toBe(floatValue); }); - it('should update input the value on click of save', () => { - component.property.multiline = true; - const expectedFloat = 88.44; + it('should update input the value on input updated', async (done) => { + const expectedNumber = 88.44; spyOn(component, 'update').and.callThrough(); + component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { expect(updateNotification.target).toEqual({ ...component.property }); - expect(updateNotification.changed).toEqual({ textkey: expectedFloat.toString() }); + expect(updateNotification.changed).toEqual({ textkey: expectedNumber.toString() }); disposableUpdate.unsubscribe(); + done(); }); - updateTextArea(component.property.key, expectedFloat); - - const saveButton = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-update-${component.property.key}"]`)); - saveButton.nativeElement.click(); - expect(component.update).toHaveBeenCalled(); + updateTextField(component.property.key, expectedNumber); fixture.detectChanges(); const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); expect(error).toBeFalsy(); - expect(getFieldValue(component.property.key)).toEqual(expectedFloat.toString()); - expect(component.property.value).toBe(expectedFloat.toString()); + expect(getTextFieldValue(component.property.key)).toEqual(expectedNumber.toString()); + expect(component.property.value).toBe(expectedNumber.toString()); }); }); function updateTextField(key, value) { - const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-toggle-${key}"]`)); - editIcon.nativeElement.dispatchEvent(new MouseEvent('click')); - fixture.detectChanges(); - - const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-editinput-${key}"]`)); + const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`)); editInput.nativeElement.value = value; editInput.nativeElement.dispatchEvent(new Event('input')); + editInput.nativeElement.dispatchEvent(new Event('blur')); fixture.detectChanges(); } - function updateTextArea(key, value) { - const editIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-toggle-${key}"]`)); - editIcon.nativeElement.dispatchEvent(mouseEvent); - fixture.detectChanges(); - - const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edittextarea-${key}"]`)); - editInput.nativeElement.value = value; - editInput.nativeElement.dispatchEvent(new Event('input')); - fixture.detectChanges(); + function getTextFieldValue(key): string { + const textItemInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`)); + expect(textItemInput).not.toBeNull(); + return textItemInput.nativeElement.value; } - function getFieldValue(key): string { - const textItemReadOnly = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`)); - return textItemReadOnly.nativeElement.textContent; + function getTextField(key): DebugElement { + const textItemInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`)); + expect(textItemInput).not.toBeNull(); + return textItemInput; + } + + function getTextFieldError(key): string { + const textItemInputError = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${key}"] li`)); + expect(textItemInputError).not.toBeNull(); + return textItemInputError.nativeElement.innerText; } }); diff --git a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts index 6c94935786..2eedbac717 100644 --- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts +++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { Component, Input, OnChanges, ViewChild } from '@angular/core'; +import { Component, Input, OnChanges } from '@angular/core'; import { CardViewTextItemModel } from '../../models/card-view-textitem.model'; import { CardViewUpdateService } from '../../services/card-view-update.service'; import { BaseCardView } from '../base-card-view'; @@ -24,6 +24,13 @@ import { ClipboardService } from '../../../clipboard/clipboard.service'; import { TranslationService } from '../../../services/translation.service'; export const DEFAULT_SEPARATOR = ', '; +const templateTypes = { + clickableTemplate: 'clickableTemplate', + multilineTemplate: 'multilineTemplate', + chipsTemplate: 'chipsTemplate', + emptyTemplate: 'emptyTemplate', + defaultTemplate: 'defaultTemplate' +}; @Component({ selector: 'adf-card-view-textitem', @@ -47,12 +54,9 @@ export class CardViewTextItemComponent extends BaseCardView 0; - } - - setEditMode(editStatus: boolean): void { - this.inEdit = editStatus; - setTimeout(() => { - if (this.editorInput) { - this.editorInput.nativeElement.click(); + private setTemplateType() { + if (this.showProperty || this.isEditable) { + if (this.isClickable) { + this.templateType = templateTypes.clickableTemplate; + } else if (this.isChipViewEnabled) { + this.templateType = templateTypes.chipsTemplate; + } else { + this.templateType = templateTypes.defaultTemplate; } - }, 0); - } - - reset(event: Event): void { - event.stopPropagation(); - - this.resetValue(); - this.setEditMode(false); - this.resetErrorMessages(); + } else { + this.templateType = templateTypes.emptyTemplate; + } } resetValue() { if (this.isChipViewEnabled) { this.editedValue = this.property.value ? Array.from(this.property.value) : []; } else { - this.editedValue = this.property.multiline ? this.property.displayValue : this.property.value; + this.editedValue = this.property.displayValue; } } @@ -117,14 +95,11 @@ export class CardViewTextItemComponent extends BaseCardView { ...this.property }, updatedValue); this.property.value = updatedValue; - this.setEditMode(false); this.resetErrorMessages(); } else { this.errorMessages = this.property.getValidationErrors(this.editedValue); @@ -142,6 +117,7 @@ export class CardViewTextItemComponent extends BaseCardView 0; } get isChipViewEnabled(): boolean { diff --git a/lib/core/card-view/components/card-view/card-view.component.scss b/lib/core/card-view/components/card-view/card-view.component.scss index 231dff5f05..7719ba4bf3 100644 --- a/lib/core/card-view/components/card-view/card-view.component.scss +++ b/lib/core/card-view/components/card-view/card-view.component.scss @@ -8,13 +8,43 @@ .adf-property { margin-bottom: 20px; + .adf-property-value-padding-top { + margin-top: 6px; + } + + .adf-property-field { + width: 100%; + margin-bottom: -25px; + + .mat-form-field-infix { + border-top-width: 0; + } + + .mat-form-field-label { + margin-top: 6px; + } + + .adf-property-read-only { + .mat-form-field-underline { + display: none; + } + } + } + + .adf-property-read-only { + .mat-form-field-underline { + display: none; + } + } + .adf-property-label { font-size: 12px; color: mat-color($foreground, text, 0.54); word-wrap: break-word; } - .adf-property-value { + .adf-property-value, + .mat-form-field-label { font-size: 14px; color: mat-color($foreground, text, 0.87); } diff --git a/lib/core/card-view/components/card-view/card-view.component.spec.ts b/lib/core/card-view/components/card-view/card-view.component.spec.ts index 2fb954c206..c313189efd 100644 --- a/lib/core/card-view/components/card-view/card-view.component.spec.ts +++ b/lib/core/card-view/components/card-view/card-view.component.spec.ts @@ -53,7 +53,7 @@ describe('CardViewComponent', () => { const value = fixture.debugElement.query(By.css('.adf-property-value')); expect(value).not.toBeNull(); - expect(value.nativeElement.innerText).toBe('My value'); + expect(value.nativeElement.value).toBe('My value'); }); })); @@ -112,9 +112,9 @@ describe('CardViewComponent', () => { expect(labelValue).not.toBeNull(); expect(labelValue.nativeElement.innerText).toBe('My default label'); - const value = fixture.debugElement.query(By.css('.adf-property-value [data-automation-id="card-textitem-value-some-key"]')); + const value = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-some-key"]')); expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('default value'); + expect(value.nativeElement.value).toBe('default value'); }); })); @@ -137,9 +137,9 @@ describe('CardViewComponent', () => { expect(labelValue).not.toBeNull(); expect(labelValue.nativeElement.innerText).toBe('My default label'); - const value = fixture.debugElement.query(By.css('.adf-property-value [data-automation-id="card-textitem-value-some-key"]')); + const value = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-some-key"]')); expect(value).not.toBeNull(); - expect(value.nativeElement.innerText.trim()).toBe('default value'); + expect(value.nativeElement.value).toBe('default value'); }); })); }); diff --git a/lib/core/card-view/models/card-view-floatitem.model.ts b/lib/core/card-view/models/card-view-floatitem.model.ts index 0a99f61f23..a7ce4d6770 100644 --- a/lib/core/card-view/models/card-view-floatitem.model.ts +++ b/lib/core/card-view/models/card-view-floatitem.model.ts @@ -23,6 +23,7 @@ import { CardViewItemFloatValidator } from '../validators/card-view.validators'; export class CardViewFloatItemModel extends CardViewTextItemModel implements CardViewItem, DynamicComponentModel { type: string = 'float'; + inputType: string = 'number'; constructor(cardViewTextItemProperties: CardViewTextItemProperties) { super(cardViewTextItemProperties); diff --git a/lib/core/card-view/models/card-view-intitem.model.ts b/lib/core/card-view/models/card-view-intitem.model.ts index 35c9fdb8a5..17cd0cbb8a 100644 --- a/lib/core/card-view/models/card-view-intitem.model.ts +++ b/lib/core/card-view/models/card-view-intitem.model.ts @@ -23,6 +23,7 @@ import { CardViewItemIntValidator } from '../validators/card-view.validators'; export class CardViewIntItemModel extends CardViewTextItemModel implements CardViewItem, DynamicComponentModel { type: string = 'int'; + inputType: string = 'number'; constructor(cardViewTextItemProperties: CardViewTextItemProperties) { super(cardViewTextItemProperties); diff --git a/lib/core/card-view/models/card-view-textitem.model.ts b/lib/core/card-view/models/card-view-textitem.model.ts index 20eef6bd95..0525594e23 100644 --- a/lib/core/card-view/models/card-view-textitem.model.ts +++ b/lib/core/card-view/models/card-view-textitem.model.ts @@ -22,6 +22,7 @@ import { CardViewTextItemPipeProperty, CardViewTextItemProperties } from '../int export class CardViewTextItemModel extends CardViewBaseItemModel implements CardViewItem, DynamicComponentModel { type: string = 'text'; + inputType: string = 'text'; multiline?: boolean; multivalued?: boolean; pipes?: CardViewTextItemPipeProperty[]; diff --git a/lib/process-services-cloud/src/lib/process/process-header/components/process-header-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/process/process-header/components/process-header-cloud.component.spec.ts index c507aa9e96..d719efab07 100644 --- a/lib/process-services-cloud/src/lib/process/process-header/components/process-header-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/process/process-header/components/process-header-cloud.component.spec.ts @@ -75,8 +75,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-id"] span')); - expect(formNameEl.nativeElement.innerText).toBe('00fcc4ab-4290-11e9-b133-0a586460016a'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-id"]')); + expect(formNameEl.nativeElement.value).toBe('00fcc4ab-4290-11e9-b133-0a586460016a'); }); })); @@ -85,8 +85,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-name"] span')); - expect(formNameEl.nativeElement.innerText).toBe('new name'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-name"]')); + expect(formNameEl.nativeElement.value).toBe('new name'); }); })); @@ -96,8 +96,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const valueEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-name"] span')); - expect(valueEl.nativeElement.innerText).toBe('ADF_CLOUD_PROCESS_HEADER.PROPERTIES.NAME_DEFAULT'); + const valueEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-name"]')); + expect(valueEl.nativeElement.value).toBe('ADF_CLOUD_PROCESS_HEADER.PROPERTIES.NAME_DEFAULT'); }); })); @@ -107,8 +107,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"] span')); - expect(formNameEl.nativeElement.innerText).toBe('RUNNING'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"]')); + expect(formNameEl.nativeElement.value).toBe('RUNNING'); }); })); @@ -117,8 +117,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-initiator"] span')); - expect(formNameEl.nativeElement.innerText).toBe('devopsuser'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-initiator"]')); + expect(formNameEl.nativeElement.value).toBe('devopsuser'); }); })); @@ -147,8 +147,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentId"] span')); - expect(formNameEl.nativeElement.innerText).toBe('00fcc4ab-4290-11e9-b133-0a586460016b'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentId"]')); + expect(formNameEl.nativeElement.value).toBe('00fcc4ab-4290-11e9-b133-0a586460016b'); }); })); @@ -158,8 +158,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentId"] span')); - expect(formNameEl.nativeElement.innerText).toBe('ADF_CLOUD_PROCESS_HEADER.PROPERTIES.NONE'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentId"]')); + expect(formNameEl.nativeElement.value).toBe('ADF_CLOUD_PROCESS_HEADER.PROPERTIES.NONE'); }); })); @@ -168,8 +168,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-businessKey"] span')); - expect(formNameEl.nativeElement.innerText).toBe('MyBusinessKey'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-businessKey"]')); + expect(formNameEl.nativeElement.value).toBe('MyBusinessKey'); }); })); @@ -179,8 +179,8 @@ describe('ProcessHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-businessKey"] span')); - expect(formNameEl.nativeElement.innerText).toBe('ADF_CLOUD_PROCESS_HEADER.PROPERTIES.NONE'); + const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-businessKey"]')); + expect(formNameEl.nativeElement.value).toBe('ADF_CLOUD_PROCESS_HEADER.PROPERTIES.NONE'); }); })); diff --git a/lib/process-services-cloud/src/lib/task/task-header/components/task-header-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/task/task-header/components/task-header-cloud.component.spec.ts index f69883a6f6..daa85db4ca 100644 --- a/lib/process-services-cloud/src/lib/task/task-header/components/task-header-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/task/task-header/components/task-header-cloud.component.spec.ts @@ -85,16 +85,16 @@ describe('TaskHeaderCloudComponent', () => { it('should display assignee', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-assignee"] span')); - expect(assigneeEl.nativeElement.innerText).toBe('AssignedTaskUser'); + const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-assignee"]')); + expect(assigneeEl.nativeElement.value).toBe('AssignedTaskUser'); }); })); it('should display status', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"] span')); - expect(statusEl.nativeElement.innerText).toBe('ASSIGNED'); + const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"]')); + expect(statusEl.nativeElement.value).toBe('ASSIGNED'); }); })); @@ -103,7 +103,7 @@ describe('TaskHeaderCloudComponent', () => { fixture.whenStable().then(() => { const priorityEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-priority"]')); - expect(priorityEl.nativeElement.innerText).toBe('5'); + expect(priorityEl.nativeElement.value).toBe('5'); }); })); @@ -111,17 +111,11 @@ describe('TaskHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const edit = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-edit-icon-priority"]')); - edit.nativeElement.click(); - fixture.detectChanges(); - const formPriorityEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-editinput-priority"]')); + const formPriorityEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-priority"]')); formPriorityEl.nativeElement.value = 'stringValue'; formPriorityEl.nativeElement.dispatchEvent(new Event('input')); - fixture.detectChanges(); - - const submitEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-update-priority"]')); - submitEl.nativeElement.click(); + formPriorityEl.nativeElement.dispatchEvent(new Event('blur')); fixture.detectChanges(); const errorMessageEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-error-priority"]')); @@ -154,8 +148,8 @@ describe('TaskHeaderCloudComponent', () => { fixture.detectChanges(); fixture.whenStable().then(() => { - const valueEl = fixture.debugElement.query(By.css('[data-automation-id="header-parentName"] .adf-property-value')); - expect(valueEl.nativeElement.innerText.trim()).toEqual('ADF_CLOUD_TASK_HEADER.PROPERTIES.PARENT_NAME_DEFAULT'); + const valueEl = fixture.debugElement.query(By.css('[data-automation-id="header-parentName"] input')); + expect(valueEl.nativeElement.value).toEqual('ADF_CLOUD_TASK_HEADER.PROPERTIES.PARENT_NAME_DEFAULT'); }); })); @@ -163,17 +157,12 @@ describe('TaskHeaderCloudComponent', () => { spyOn(taskCloudService, 'updateTask').and.returnValue(of(assignedTaskDetailsCloudMock)); fixture.detectChanges(); fixture.whenStable().then(() => { - const descriptionEditIcon = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-edit-icon-description"]')); - descriptionEditIcon.nativeElement.click(); - fixture.detectChanges(); - const inputEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-edittextarea-description"]')); + const inputEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-description"]')); inputEl.nativeElement.value = 'updated description'; inputEl.nativeElement.dispatchEvent(new Event('input')); - fixture.detectChanges(); + inputEl.nativeElement.dispatchEvent(new Event('blur')); - const submitEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-update-description"]')); - submitEl.nativeElement.click(); fixture.detectChanges(); expect(taskCloudService.updateTask).toHaveBeenCalled(); }); @@ -185,24 +174,20 @@ describe('TaskHeaderCloudComponent', () => { await fixture.whenStable(); let description = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-description"]')); - expect(description.nativeElement.innerText.trim()).toEqual('This is the description'); + expect(description.nativeElement.value.trim()).toEqual('This is the description'); - const descriptionEditIcon = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-edit-icon-description"]')); - descriptionEditIcon.nativeElement.click(); - fixture.detectChanges(); - - const inputEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-edittextarea-description"]')); + const inputEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-description"]')); inputEl.nativeElement.value = 'updated description'; inputEl.nativeElement.dispatchEvent(new Event('input')); + inputEl.nativeElement.dispatchEvent(new Event('blur')); - const submitEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-update-description"]')); - submitEl.nativeElement.click(); + fixture.detectChanges(); expect(taskCloudService.updateTask).toHaveBeenCalled(); await fixture.whenStable(); fixture.detectChanges(); description = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-description"]')); - expect(description.nativeElement.innerText.trim()).toEqual('This is the description'); + expect(description.nativeElement.value.trim()).toEqual('This is the description'); }); }); @@ -223,16 +208,16 @@ describe('TaskHeaderCloudComponent', () => { it('should display parent task id', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentTaskId"] span')); - expect(assigneeEl.nativeElement.innerText).toBe('mock-parent-task-id'); + const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentTaskId"')); + expect(assigneeEl.nativeElement.value).toBe('mock-parent-task-id'); }); })); it('should display parent task name', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentName"] span')); - expect(statusEl.nativeElement.innerText).toBe('This is a parent task name'); + const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-parentName"]')); + expect(statusEl.nativeElement.value.trim()).toBe('This is a parent task name'); }); })); }); @@ -247,35 +232,35 @@ describe('TaskHeaderCloudComponent', () => { it('should display assignee', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-assignee"] span')); - expect(assigneeEl.nativeElement.innerText).toBe('AssignedTaskUser'); + const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-assignee"]')); + expect(assigneeEl.nativeElement.value).toBe('AssignedTaskUser'); }); })); it('should display status', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"] span')); - expect(statusEl.nativeElement.innerText).toBe('ASSIGNED'); + const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"]')); + expect(statusEl.nativeElement.value).toBe('ASSIGNED'); }); })); it('should render defined edit icon for assignee property if the task in assigned state and assingee should be current user', () => { fixture.detectChanges(); - const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-clickable-icon-assignee"]`)); + const value = fixture.debugElement.query(By.css(`[data-automation-id="header-assignee"] [data-automation-id="card-textitem-clickable-icon-assignee"]`)); expect(value).not.toBeNull(); expect(value.nativeElement.innerText).toBe('create'); }); it('should render edit icon if the task in assigned state and assingee should be current user', () => { fixture.detectChanges(); - const priorityEditIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-priority"]`)); - const descriptionEditIcon = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-description"]`)); + const priorityEditIcon = fixture.debugElement.query(By.css(`[data-automation-id="header-priority"] [class*="adf-textitem-edit-icon"]`)); + const descriptionEditIcon = fixture.debugElement.query(By.css(`[data-automation-id="header-description"] [class*="adf-textitem-edit-icon"]`)); const dueDateEditIcon = fixture.debugElement.query(By.css(`[data-automation-id="datepickertoggle-dueDate"]`)); - expect(priorityEditIcon).not.toBeNull('Edit icon should be shown'); - expect(descriptionEditIcon).not.toBeNull('Edit icon should be shown'); - expect(dueDateEditIcon).not.toBeNull('Edit icon should be shown'); + expect(priorityEditIcon).not.toBeNull('Priority edit icon should be shown'); + expect(descriptionEditIcon).not.toBeNull('Description edit icon should be shown'); + expect(dueDateEditIcon).not.toBeNull('Due date edit icon should be shown'); }); it('should not render defined clickable edit icon for assignee property if the task in assigned state and assingned user is different from current logged-in user', () => { @@ -309,16 +294,16 @@ describe('TaskHeaderCloudComponent', () => { it('should display status', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"] span')); - expect(statusEl.nativeElement.innerText).toBe('CREATED'); + const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"]')); + expect(statusEl.nativeElement.value).toBe('CREATED'); }); })); it('should display placeholder if no assignee', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-assignee"] span')); - expect(assigneeEl.nativeElement.innerText).toBe('ADF_CLOUD_TASK_HEADER.PROPERTIES.ASSIGNEE_DEFAULT'); + const assigneeEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-assignee"]')); + expect(assigneeEl.nativeElement.value).toBe('ADF_CLOUD_TASK_HEADER.PROPERTIES.ASSIGNEE_DEFAULT'); }); })); @@ -350,8 +335,8 @@ describe('TaskHeaderCloudComponent', () => { it('should display status', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"] span')); - expect(statusEl.nativeElement.innerText).toBe('COMPLETED'); + const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"]')); + expect(statusEl.nativeElement.value).toBe('COMPLETED'); }); })); @@ -383,8 +368,8 @@ describe('TaskHeaderCloudComponent', () => { it('should display status', async(() => { fixture.detectChanges(); fixture.whenStable().then(() => { - const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"] span')); - expect(statusEl.nativeElement.innerText).toBe('SUSPENDED'); + const statusEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-status"]')); + expect(statusEl.nativeElement.value).toBe('SUSPENDED'); }); })); diff --git a/lib/process-services/src/lib/process-list/components/process-instance-header.component.spec.ts b/lib/process-services/src/lib/process-list/components/process-instance-header.component.spec.ts index 07945b6fb1..6d64b78bf2 100644 --- a/lib/process-services/src/lib/process-list/components/process-instance-header.component.spec.ts +++ b/lib/process-services/src/lib/process-list/components/process-instance-header.component.spec.ts @@ -50,20 +50,22 @@ describe('ProcessInstanceHeaderComponent', () => { expect(fixture.debugElement.children.length).toBe(0); }); - it('should display status as running when process is not complete', () => { + it('should display status as running when process is not complete', async () => { component.processInstance.ended = null; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-status"]'); - expect(valueEl.innerText).toBe('Running'); + expect(valueEl.value).toBe('Running'); }); - it('should display status as completed when process is complete', () => { + it('should display status as completed when process is complete', async () => { component.processInstance.ended = new Date('2016-11-03'); component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-status"]'); - expect(valueEl.innerText).toBe('Completed'); + expect(valueEl.value).toBe('Completed'); }); it('should display due date', () => { @@ -82,20 +84,22 @@ describe('ProcessInstanceHeaderComponent', () => { expect(valueEl.innerText).toBe('ADF_PROCESS_LIST.PROPERTIES.END_DATE_DEFAULT'); }); - it('should display process category', () => { + it('should display process category', async () => { component.processInstance.processDefinitionCategory = 'Accounts'; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-category"]'); - expect(valueEl.innerText).toBe('Accounts'); + expect(valueEl.value).toBe('Accounts'); }); - it('should display placeholder if no process category', () => { + it('should display placeholder if no process category', async () => { component.processInstance.processDefinitionCategory = null; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-category"]'); - expect(valueEl.innerText).toBe('ADF_PROCESS_LIST.PROPERTIES.CATEGORY_DEFAULT'); + expect(valueEl.value).toBe('ADF_PROCESS_LIST.PROPERTIES.CATEGORY_DEFAULT'); }); it('should display created date', () => { @@ -106,52 +110,58 @@ describe('ProcessInstanceHeaderComponent', () => { expect(valueEl.innerText).toBe('Nov 3, 2016'); }); - it('should display started by', () => { + it('should display started by', async () => { component.processInstance.startedBy = {firstName: 'Admin', lastName: 'User'}; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-assignee"]'); - expect(valueEl.innerText).toBe('Admin User'); + expect(valueEl.value).toBe('Admin User'); }); - it('should display process instance id', () => { + it('should display process instance id', async () => { component.processInstance.id = '123'; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-id"]'); - expect(valueEl.innerText).toBe('123'); + expect(valueEl.value).toBe('123'); }); - it('should display description', () => { + it('should display description', async () => { component.processInstance.processDefinitionDescription = 'Test process'; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-description"]'); - expect(valueEl.innerText).toBe('Test process'); + expect(valueEl.value).toBe('Test process'); }); - it('should display placeholder if no description', () => { + it('should display placeholder if no description', async () => { component.processInstance.processDefinitionDescription = null; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-description"]'); - expect(valueEl.innerText).toBe('ADF_PROCESS_LIST.PROPERTIES.DESCRIPTION_DEFAULT'); + expect(valueEl.value).toBe('ADF_PROCESS_LIST.PROPERTIES.DESCRIPTION_DEFAULT'); }); - it('should display businessKey value', () => { + it('should display businessKey value', async () => { component.processInstance.businessKey = 'fakeBusinessKey'; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-businessKey"]'); - expect(valueEl.innerText).toBe('fakeBusinessKey'); + expect(valueEl.value).toBe('fakeBusinessKey'); }); - it('should display default key if no businessKey', () => { + it('should display default key if no businessKey', async () => { component.processInstance.businessKey = null; component.ngOnChanges(); fixture.detectChanges(); + await fixture.whenStable(); const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-businessKey"]'); - expect(valueEl.innerText).toBe('ADF_PROCESS_LIST.PROPERTIES.BUSINESS_KEY_DEFAULT'); + expect(valueEl.value).toBe('ADF_PROCESS_LIST.PROPERTIES.BUSINESS_KEY_DEFAULT'); }); describe('Config Filtering', () => { diff --git a/lib/process-services/src/lib/task-list/components/task-header.component.spec.ts b/lib/process-services/src/lib/task-list/components/task-header.component.spec.ts index 9f3418b6dc..c62d7205b6 100644 --- a/lib/process-services/src/lib/task-list/components/task-header.component.spec.ts +++ b/lib/process-services/src/lib/task-list/components/task-header.component.spec.ts @@ -83,7 +83,7 @@ describe('TaskHeaderComponent', () => { fixture.whenStable().then(() => { const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="header-assignee"] .adf-textitem-clickable-value')); - expect(formNameEl.nativeElement.innerText).toBe('Wilbur Adams'); + expect(formNameEl.nativeElement.value).toBe('Wilbur Adams'); }); })); @@ -94,7 +94,7 @@ describe('TaskHeaderComponent', () => { fixture.whenStable().then(() => { const valueEl = fixture.debugElement.query(By.css('[data-automation-id="header-assignee"] .adf-textitem-clickable-value')); - expect(valueEl.nativeElement.innerText).toBe('ADF_TASK_LIST.PROPERTIES.ASSIGNEE_DEFAULT'); + expect(valueEl.nativeElement.value).toBe('ADF_TASK_LIST.PROPERTIES.ASSIGNEE_DEFAULT'); }); })); @@ -106,7 +106,7 @@ describe('TaskHeaderComponent', () => { fixture.whenStable().then(() => { const formNameEl = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-priority"]')); - expect(formNameEl.nativeElement.innerText).toBe('27'); + expect(formNameEl.nativeElement.value).toBe('27'); }); })); @@ -287,7 +287,7 @@ describe('TaskHeaderComponent', () => { fixture.whenStable().then(() => { const valueEl = fixture.debugElement.query(By.css('[data-automation-id="header-formName"] .adf-textitem-clickable-value')); - expect(valueEl.nativeElement.innerText).toBe('test form'); + expect(valueEl.nativeElement.value).toBe('test form'); }); })); @@ -301,8 +301,8 @@ describe('TaskHeaderComponent', () => { const clickableForm = fixture.debugElement.query(By.css('[data-automation-id="header-formName"] .adf-textitem-clickable-value')); expect(clickableForm).toBeNull(); - const readOnlyForm = fixture.debugElement.query(By.css('[data-automation-id="header-formName"] .adf-textitem-scroll')); - expect(readOnlyForm.nativeElement.innerText).toBe('test form'); + const readOnlyForm = fixture.debugElement.query(By.css('[data-automation-id="header-formName"] input')); + expect(readOnlyForm.nativeElement.value).toBe('test form'); }); })); @@ -335,7 +335,7 @@ describe('TaskHeaderComponent', () => { fixture.whenStable().then(() => { const valueEl = fixture.debugElement.query(By.css('[data-automation-id="header-formName"] .adf-property-value')); - expect(valueEl.nativeElement.innerText).toBe('ADF_TASK_LIST.PROPERTIES.FORM_NAME_DEFAULT'); + expect(valueEl.nativeElement.value).toBe('ADF_TASK_LIST.PROPERTIES.FORM_NAME_DEFAULT'); }); })); diff --git a/lib/testing/src/lib/core/pages/card-view/card-view-text-item.page.ts b/lib/testing/src/lib/core/pages/card-view/card-view-text-item.page.ts index 0a33a4e903..f483aea103 100644 --- a/lib/testing/src/lib/core/pages/card-view/card-view-text-item.page.ts +++ b/lib/testing/src/lib/core/pages/card-view/card-view-text-item.page.ts @@ -15,20 +15,19 @@ * limitations under the License. */ -import { element, by, ElementFinder, Locator } from 'protractor'; +import { element, by, ElementFinder, Locator, Key } from 'protractor'; import { BrowserActions, BrowserVisibility } from '../../utils/public-api'; export class CardTextItemPage { rootElement: ElementFinder; - textField: Locator = by.css('input[data-automation-id*="card-textitem-editinput"]'); + textField: Locator = by.css('[data-automation-id*="card-textitem-value"]'); saveButton: Locator = by.css('button[data-automation-id*="card-textitem-update"]'); clearButton: Locator = by.css('button[data-automation-id*="card-textitem-reset"]'); - field: Locator = by.css('span[data-automation-id*="card-textitem-value"] span'); + field: Locator = by.css('[data-automation-id*="card-textitem-value"]'); labelLocator: Locator = by.css('div[data-automation-id*="card-textitem-label"]'); - toggle: Locator = by.css('div[data-automation-id*="card-textitem-toggle"]'); - editButton: Locator = by.css('button.adf-textitem-action[title*=Edit]'); errorMessage: Locator = by.css('.adf-textitem-editable-error'); clickableElement: Locator = by.css('.adf-textitem-clickable'); + readOnlyField: Locator = by.css('.adf-property-read-only'); constructor(label: string = 'assignee') { this.rootElement = element(by.xpath(`//div[contains(@data-automation-id, "label-${label}")]/ancestor::adf-card-view-textitem`)); @@ -36,7 +35,7 @@ export class CardTextItemPage { async getFieldValue(): Promise { const fieldElement = this.rootElement.all(this.field).first(); - return BrowserActions.getText(fieldElement); + return BrowserActions.getInputValue(fieldElement); } async checkLabelIsPresent(): Promise { @@ -44,14 +43,10 @@ export class CardTextItemPage { await BrowserVisibility.waitUntilElementIsPresent(labelElement); } - async clickOnToggleTextField(): Promise { - const toggleText: ElementFinder = this.rootElement.element(this.toggle); - await BrowserActions.click(toggleText); - } - async enterTextField(text: string): Promise { await BrowserVisibility.waitUntilElementIsVisible(this.rootElement.element(this.textField)); await BrowserActions.clearSendKeys(this.rootElement.element(this.textField), text); + await this.rootElement.element(this.textField).sendKeys(Key.TAB); } async clickOnSaveButton(): Promise { @@ -62,17 +57,12 @@ export class CardTextItemPage { await BrowserActions.click(this.rootElement.element(this.clearButton)); } - async clickOnEditButton(): Promise { - await BrowserActions.click(this.rootElement.element(this.editButton)); - } - async getErrorMessage(): Promise { const errorField = this.rootElement.element(this.errorMessage); return BrowserActions.getText(errorField); } - async checkElementIsReadonly(): Promise { - await BrowserVisibility.waitUntilElementIsNotVisible(this.rootElement.element(this.clickableElement)); - await BrowserVisibility.waitUntilElementIsNotVisible(this.rootElement.element(this.editButton)); + async checkElementIsReadonly(): Promise { + await BrowserVisibility.waitUntilElementIsVisible(this.rootElement.element(this.readOnlyField)); } } diff --git a/lib/testing/src/lib/core/utils/browser-actions.ts b/lib/testing/src/lib/core/utils/browser-actions.ts index 9ff2cdc1e5..45d11cc47b 100644 --- a/lib/testing/src/lib/core/utils/browser-actions.ts +++ b/lib/testing/src/lib/core/utils/browser-actions.ts @@ -65,6 +65,15 @@ export class BrowserActions { } } + static async getInputValue(elementFinder: ElementFinder): Promise { + const present = await BrowserVisibility.waitUntilElementIsPresent(elementFinder); + if (present) { + return elementFinder.getAttribute('value'); + } else { + return ''; + } + } + static async getArrayText(elementFinders: ElementArrayFinder): Promise { return elementFinders.getText(); } @@ -75,12 +84,13 @@ export class BrowserActions { return webElem.getCssValue('color'); } - static async clearWithBackSpace(elementFinder: ElementFinder) { + static async clearWithBackSpace(elementFinder: ElementFinder, sleepTime: number = 0) { await BrowserVisibility.waitUntilElementIsVisible(elementFinder); await elementFinder.click(); const value = await elementFinder.getAttribute('value'); for (let i = value.length; i >= 0; i--) { await elementFinder.sendKeys(protractor.Key.BACK_SPACE); + await browser.sleep(sleepTime); } } diff --git a/lib/testing/src/lib/process-services-cloud/pages/edit-task-filter-cloud-component.page.ts b/lib/testing/src/lib/process-services-cloud/pages/edit-task-filter-cloud-component.page.ts index ed0d8ff742..11ff8d7436 100644 --- a/lib/testing/src/lib/process-services-cloud/pages/edit-task-filter-cloud-component.page.ts +++ b/lib/testing/src/lib/process-services-cloud/pages/edit-task-filter-cloud-component.page.ts @@ -183,7 +183,7 @@ export class EditTaskFilterCloudComponentPage { } async clearAssignee(): Promise { - await BrowserActions.clearWithBackSpace(this.assignee); + await BrowserActions.clearWithBackSpace(this.assignee, 200); await browser.driver.sleep(1000); } diff --git a/lib/testing/src/lib/process-services-cloud/pages/process-header-cloud-component.page.ts b/lib/testing/src/lib/process-services-cloud/pages/process-header-cloud-component.page.ts index 1fdf6b69e2..14b41265a4 100644 --- a/lib/testing/src/lib/process-services-cloud/pages/process-header-cloud-component.page.ts +++ b/lib/testing/src/lib/process-services-cloud/pages/process-header-cloud-component.page.ts @@ -20,29 +20,29 @@ import { BrowserActions } from '../../core/utils/browser-actions'; export class ProcessHeaderCloudPage { - idField: ElementFinder = element.all(by.css('span[data-automation-id*="id"] span span')).first(); - nameField: ElementFinder = element.all(by.css('span[data-automation-id*="name"] span span')).first(); - statusField: ElementFinder = element(by.css('span[data-automation-id*="status"] span span')); - initiatorField: ElementFinder = element(by.css('span[data-automation-id*="initiator"] span span')); - startDateField: ElementFinder = element.all(by.css('span[data-automation-id*="startDate"] span span')).first(); - lastModifiedField: ElementFinder = element.all(by.css('span[data-automation-id*="lastModified"] span span')).first(); - parentIdField: ElementFinder = element(by.css('span[data-automation-id*="parentId"] span span')); - businessKeyField: ElementFinder = element.all(by.css('span[data-automation-id*="businessKey"] span span')).first(); + idField: ElementFinder = element.all(by.css('[data-automation-id="card-textitem-value-id"]')).first(); + nameField: ElementFinder = element.all(by.css('[data-automation-id="card-textitem-value-name"]')).first(); + statusField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-status"]')); + initiatorField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-initiator"]')); + startDateField: ElementFinder = element.all(by.css('span[data-automation-id*="startDate"] span')).first(); + lastModifiedField: ElementFinder = element.all(by.css('span[data-automation-id*="lastModified"] span')).first(); + parentIdField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-parentId"]')); + businessKeyField: ElementFinder = element(by.css('[data-automation-id="card-textitem-value-businessKey"]')); async getId(): Promise { - return BrowserActions.getText(this.idField); + return BrowserActions.getInputValue(this.idField); } async getName(): Promise { - return BrowserActions.getText(this.nameField); + return BrowserActions.getInputValue(this.nameField); } async getStatus(): Promise { - return BrowserActions.getText(this.statusField); + return BrowserActions.getInputValue(this.statusField); } async getInitiator(): Promise { - return BrowserActions.getText(this.initiatorField); + return BrowserActions.getInputValue(this.initiatorField); } async getStartDate(): Promise { @@ -54,11 +54,11 @@ export class ProcessHeaderCloudPage { } async getParentId(): Promise { - return BrowserActions.getText(this.parentIdField); + return BrowserActions.getInputValue(this.parentIdField); } async getBusinessKey(): Promise { - return BrowserActions.getText(this.businessKeyField); + return BrowserActions.getInputValue(this.businessKeyField); } } diff --git a/lib/testing/src/lib/process-services-cloud/pages/start-tasks-cloud-component.page.ts b/lib/testing/src/lib/process-services-cloud/pages/start-tasks-cloud-component.page.ts index 111b798df8..e8e0e1f291 100644 --- a/lib/testing/src/lib/process-services-cloud/pages/start-tasks-cloud-component.page.ts +++ b/lib/testing/src/lib/process-services-cloud/pages/start-tasks-cloud-component.page.ts @@ -79,10 +79,6 @@ export class StartTasksCloudPage { await BrowserVisibility.waitUntilElementIsVisible(errorElement); } - async validateAssignee(error: string): Promise { - await this.checkValidationErrorIsDisplayed(error, '.adf-start-task-cloud-error'); - } - async validateDate(error: string): Promise { await this.checkValidationErrorIsDisplayed(error, '.adf-error-text'); } diff --git a/lib/testing/src/lib/process-services-cloud/pages/task-filters-cloud-component.page.ts b/lib/testing/src/lib/process-services-cloud/pages/task-filters-cloud-component.page.ts index 96019b2a5d..270deb2512 100644 --- a/lib/testing/src/lib/process-services-cloud/pages/task-filters-cloud-component.page.ts +++ b/lib/testing/src/lib/process-services-cloud/pages/task-filters-cloud-component.page.ts @@ -15,63 +15,26 @@ * limitations under the License. */ -import { by, element, ElementFinder, Locator } from 'protractor'; +import { browser, by, element, ElementFinder } from 'protractor'; import { BrowserVisibility } from '../../core/utils/browser-visibility'; import { BrowserActions } from '../../core/utils/browser-actions'; export class TaskFiltersCloudComponentPage { filter: ElementFinder; - taskIcon: Locator = by.xpath("ancestor::div[@class='mat-list-item-content']/mat-icon"); taskFilters: ElementFinder = element(by.css(`mat-expansion-panel[data-automation-id='Task Filters']`)); - activeFilter: ElementFinder = element(by.css("mat-list-item[class*='active'] span")); - defaultActiveFilter: ElementFinder = element.all(by.css('.adf-filters__entry')).first(); async checkTaskFilterIsDisplayed(filterName: string): Promise { this.filter = this.getTaskFilterLocatorByFilterName(filterName); await BrowserVisibility.waitUntilElementIsVisible(this.filter); } - async getTaskFilterIcon(filterName: string): Promise { - this.filter = this.getTaskFilterLocatorByFilterName(filterName); - await BrowserVisibility.waitUntilElementIsVisible(this.filter); - const icon = this.filter.element(this.taskIcon); - return BrowserActions.getText(icon); - } - - async checkTaskFilterHasNoIcon(filterName: string): Promise { - this.filter = this.getTaskFilterLocatorByFilterName(filterName); - await BrowserVisibility.waitUntilElementIsVisible(this.filter); - await BrowserVisibility.waitUntilElementIsNotVisible(this.filter.element(this.taskIcon)); - } - async clickTaskFilter(filterName): Promise { this.filter = this.getTaskFilterLocatorByFilterName(filterName); await BrowserVisibility.waitUntilElementIsClickable(this.filter); await BrowserActions.click(this.filter); - } - - async clickMyTasksFilter(): Promise { - this.filter = this.getTaskFilterLocatorByFilterName('my-tasks'); - await BrowserVisibility.waitUntilElementIsClickable(this.filter); - await BrowserActions.click(this.filter); - } - - async clickCompletedTasksFilter(): Promise { - this.filter = this.getTaskFilterLocatorByFilterName('completed-tasks'); - await BrowserVisibility.waitUntilElementIsClickable(this.filter); - await BrowserActions.click(this.filter); - } - - async checkMyTasksFilterIsDisplayed(): Promise { - this.filter = this.getTaskFilterLocatorByFilterName('my-tasks'); - await BrowserVisibility.waitUntilElementIsVisible(this.filter); - } - - async checkCompletedTasksFilterIsDisplayed(): Promise { - this.filter = this.getTaskFilterLocatorByFilterName('completed-tasks'); - await BrowserVisibility.waitUntilElementIsVisible(this.filter); + await browser.sleep(1000); } async checkTaskFilterNotDisplayed(filterName: string): Promise { @@ -87,11 +50,6 @@ export class TaskFiltersCloudComponentPage { return BrowserActions.getText(this.activeFilter); } - async firstFilterIsActive(): Promise { - const value = await this.defaultActiveFilter.getAttribute('class'); - return value.includes('adf-active'); - } - getTaskFilterLocatorByFilterName(filterName: string): ElementFinder { return element(by.css(`span[data-automation-id="${filterName}-filter"]`)); } diff --git a/lib/testing/src/lib/process-services-cloud/pages/task-form-cloud-component.page.ts b/lib/testing/src/lib/process-services-cloud/pages/task-form-cloud-component.page.ts index fb6ee7574c..8734133739 100644 --- a/lib/testing/src/lib/process-services-cloud/pages/task-form-cloud-component.page.ts +++ b/lib/testing/src/lib/process-services-cloud/pages/task-form-cloud-component.page.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { element, by, ElementFinder } from 'protractor'; +import { element, by, ElementFinder, browser } from 'protractor'; import { BrowserVisibility } from '../../core/utils/browser-visibility'; import { BrowserActions } from '../../core/utils/browser-actions'; import { FormFields } from '../../core/pages/form/form-fields'; @@ -77,6 +77,7 @@ export class TaskFormCloudComponent { async clickCompleteButton(): Promise { await BrowserActions.click(this.completeButton); + await browser.sleep(500); } async checkFormOutcomeButtonIsDisplayedByName(name: string): Promise { diff --git a/lib/testing/src/lib/process-services-cloud/pages/task-header-cloud-component.page.ts b/lib/testing/src/lib/process-services-cloud/pages/task-header-cloud-component.page.ts index ccd6eac3e8..8a094e4d31 100644 --- a/lib/testing/src/lib/process-services-cloud/pages/task-header-cloud-component.page.ts +++ b/lib/testing/src/lib/process-services-cloud/pages/task-header-cloud-component.page.ts @@ -26,10 +26,10 @@ export class TaskHeaderCloudPage { statusCardTextItem: CardTextItemPage = new CardTextItemPage('status'); priorityCardTextItem: CardTextItemPage = new CardTextItemPage('priority'); dueDateField: ElementFinder = element.all(by.css('span[data-automation-id*="dueDate"] span')).first(); - categoryField: ElementFinder = element.all(by.css('span[data-automation-id*="category"] span')).first(); + categoryCardTextItem: CardTextItemPage = new CardTextItemPage('category'); createdField: ElementFinder = element(by.css('span[data-automation-id="card-dateitem-created"] span')); - parentNameField: ElementFinder = element(by.css('span[data-automation-id*="parentName"] span')); - parentTaskIdField: ElementFinder = element(by.css('span[data-automation-id*="parentTaskId"] span')); + parentNameCardTextItem: CardTextItemPage = new CardTextItemPage('parentName'); + parentTaskIdCardTextItem: CardTextItemPage = new CardTextItemPage('parentTaskId'); endDateField: ElementFinder = element.all(by.css('span[data-automation-id*="endDate"] span')).first(); idCardTextItem: CardTextItemPage = new CardTextItemPage('id'); descriptionCardTextItem: CardTextItemPage = new CardTextItemPage('description'); @@ -39,10 +39,6 @@ export class TaskHeaderCloudPage { return this.assigneeCardTextItem.getFieldValue(); } - async clickOnAssignee(): Promise { - await this.assigneeCardTextItem.clickOnToggleTextField(); - } - async getStatus(): Promise { return this.statusCardTextItem.getFieldValue(); } @@ -52,15 +48,15 @@ export class TaskHeaderCloudPage { } async getCategory(): Promise { - return BrowserActions.getText(this.categoryField); + return this.categoryCardTextItem.getFieldValue(); } async getParentName(): Promise { - return BrowserActions.getText(this.parentNameField); + return this.parentNameCardTextItem.getFieldValue(); } async getParentTaskId(): Promise { - return BrowserActions.getText(this.parentTaskIdField); + return this.parentTaskIdCardTextItem.getFieldValue(); } async getEndDate(): Promise { diff --git a/package.json b/package.json index d207f7c2c1..a136d9ace8 100644 --- a/package.json +++ b/package.json @@ -242,7 +242,7 @@ }, { "path": "./lib/dist/testing/bundles/adf-testing.umd.min.js", - "maxSize": "40 kb" + "maxSize": "50 kb" } ], "engines": { diff --git a/scripts/travis/e2e/process-services-cloud-e2e.sh b/scripts/travis/e2e/process-services-cloud-e2e.sh index 71dcd16eb0..2beb03af15 100755 --- a/scripts/travis/e2e/process-services-cloud-e2e.sh +++ b/scripts/travis/e2e/process-services-cloud-e2e.sh @@ -13,7 +13,7 @@ export AUTH_TYPE="OAUTH" AFFECTED_LIBS="$(./scripts/affected-libs.sh -gnu -b $TRAVIS_BRANCH)"; AFFECTED_E2E="$(./scripts/git-util/affected-folder.sh -b $TRAVIS_BRANCH -f "e2e/$CONTEXT_ENV")"; -RUN_E2E=$(echo ./scripts/test-e2e-lib.sh -host http://localhost:4200 -proxy "$E2E_HOST_BPM" -u "$E2E_USERNAME" -p "$E2E_PASSWORD" -e "$E2E_EMAIL" -host_sso "$E2E_HOST_SSO" -host_bpm "$E2E_HOST_BPM" -host_identity "$E2E_HOST_IDENTITY" -identity_admin_email "$E2E_ADMIN_EMAIL_IDENTITY" -identity_admin_password "$E2E_ADMIN_PASSWORD_IDENTITY" -prefix $TRAVIS_BUILD_NUMBER --use-dist -m 2 ) +RUN_E2E=$(echo ./scripts/test-e2e-lib.sh -host http://localhost:4200 -proxy "$E2E_HOST_BPM" -u "$E2E_USERNAME" -p "$E2E_PASSWORD" -e "$E2E_EMAIL" -host_sso "$E2E_HOST_SSO" -host_bpm "$E2E_HOST_BPM" -host_identity "$E2E_HOST_IDENTITY" -identity_admin_email "$E2E_ADMIN_EMAIL_IDENTITY" -identity_admin_password "$E2E_ADMIN_PASSWORD_IDENTITY" -prefix $TRAVIS_BUILD_NUMBER --use-dist -m 2 -save ) ./node_modules/@alfresco/adf-cli/bin/adf-cli init-aae-env --host "$E2E_HOST_BPM" --oauth "$E2E_HOST_SSO" --modelerUsername "$E2E_MODELER_USERNAME" --modelerPassword "$E2E_MODELER_PASSWORD" --devopsUsername "$E2E_DEVOPS_USERNAME" --devopsPassword "$E2E_DEVOPS_PASSWORD" --clientId 'activiti' || exit 1 node ./scripts/check-env/check-cs-env.js --host "$E2E_HOST_BPM" -u "$E2E_ADMIN_EMAIL_IDENTITY" -p "$E2E_ADMIN_PASSWORD_IDENTITY" || exit 1