Fixing e2e - part III

e2e/content-services/pages/version-manager.page.ts

@@ -110,7 +110,7 @@ export class VersionManagePage {
 
     async clickActionButton(version: string): Promise<void> {
         await TestElement.byId(`adf-version-list-action-menu-button-${version}`).click();
-        await TestElement.byCss('.cdk-overlay-container .mat-menu-content').waitVisible();
+        await TestElement.byCss('.cdk-overlay-container .mat-mdc-menu-content').waitVisible();
     }
 
     async closeActionsMenu(): Promise<void> {

e2e/core/pages/content-services.page.ts

@@ -55,7 +55,7 @@ export class ContentServicesPage {
     downloadContent = $('button[data-automation-id="Download"]');
     downloadButton = $('button[title="Download"]');
     multiSelectToggle = $('[data-automation-id="multiSelectToggle"]');
-    selectionModeDropdown = $('.mat-select[placeholder="Selection Mode"]');
+    selectionModeDropdown = $('.mat-mdc-select[placeholder="Selection Mode"]');
 
     async isContextActionEnabled(actionName: string): Promise<boolean> {
         const actionButton = $(`button[data-automation-id="context-${actionName}"`);

e2e/core/pages/metadata-view.page.ts

@@ -38,7 +38,7 @@ export class MetadataViewPage {
     multiSwitch = $(`#adf-metadata-multi`);
     defaultPropertiesSwitch = $('#adf-metadata-default-properties');
     closeButton = element(by.cssContainingText('button.mat-button span', 'Close'));
-    displayAspect = $(`input[data-placeholder='Display Aspect']`);
+    displayAspect = $(`input[placeholder='Display Aspect']`);
     applyAspect = element(by.cssContainingText(`button span.mat-button-wrapper`, 'Apply Aspect'));
     saveMetadataButton = $(`[data-automation-id='save-metadata']`);
     saveGeneralMetadataButton = $(`[data-automation-id='save-general-info-metadata']`);

e2e/process-services/pages/attach-form.page.ts

@@ -25,7 +25,7 @@ export class AttachFormPage {
     completeButton = $('#adf-attach-form-complete-button');
     formDropdown = $('#form_id');
     cancelButton = $('#adf-attach-form-cancel-button');
-    defaultTitle = $('.mat-card-title');
+    defaultTitle = $('.mat-mdc-card-title');
     attachFormDropdown = new DropdownPage($('.adf-attach-form-row'));
 
     async checkAttachFormButtonIsDisplayed(): Promise<void> {

e2e/process-services/pages/dialog/create-checklist-dialog.page.ts

@@ -42,7 +42,7 @@ export class ChecklistDialog {
     }
 
     async getNameFieldPlaceholder(): Promise<string> {
-        return BrowserActions.getAttribute(this.nameField, 'data-placeholder');
+        return BrowserActions.getAttribute(this.nameField, 'placeholder');
     }
 
     async checkCancelButtonIsEnabled(): Promise<void> {

e2e/process-services/pages/dialog/start-task-dialog.page.ts

@@ -58,7 +58,7 @@ export class StartTaskDialogPage {
     }
 
     async getAssignee(): Promise<string> {
-        return BrowserActions.getAttribute(this.assignee, 'data-placeholder');
+        return BrowserActions.getAttribute(this.assignee, 'placeholder');
     }
 
     async selectForm(form): Promise<void> {

e2e/process-services/pages/process-details.page.ts

@@ -20,7 +20,7 @@ import { ProcessInstanceHeaderPage, TestElement } from '@alfresco/adf-testing';
 
 export class ProcessDetailsPage {
     processInstanceHeaderPage = new ProcessInstanceHeaderPage();
-    processTitle = TestElement.byCss('.mat-card-title');
+    processTitle = TestElement.byCss('.mat-mdc-card-title');
     processDetailsMessage = TestElement.byCss('adf-process-instance-details div');
     showDiagramButtonDisabled = TestElement.byCss('button[id="show-diagram-button"][disabled]');
     propertiesList = TestElement.byCss('.adf-property-list');

e2e/process-services/pages/task-details.page.ts

@@ -180,7 +180,7 @@ export class TaskDetailsPage {
     }
 
     async getDescriptionPlaceholder(): Promise<string> {
-        return BrowserActions.getAttribute(this.descriptionField, 'data-placeholder');
+        return BrowserActions.getAttribute(this.descriptionField, 'placeholder');
     }
 
     getDueDate(): Promise<string> {
@@ -310,7 +310,7 @@ export class TaskDetailsPage {
     }
 
     async getInvolvePeoplePlaceholder(): Promise<string> {
-        return BrowserActions.getAttribute(this.addPeopleField, 'data-placeholder');
+        return BrowserActions.getAttribute(this.addPeopleField, 'placeholder');
     }
 
     async checkCancelButtonIsEnabled(): Promise<void> {

e2e/process-services/pages/tasks.page.ts

@@ -27,7 +27,7 @@ import { BrowserActions, BrowserVisibility, FormFields } from '@alfresco/adf-tes
 export class TasksPage {
     createButton = $('button[data-automation-id="create-button"');
     addChecklistButton = $('button[class*="adf-add-to-checklist-button"]');
-    rowByRowName = by.xpath('ancestor::mat-chip');
+    rowByRowName = by.xpath('ancestor::mat-chip-list');
     checklistContainer = $('div[class*="checklist-menu"]');
     taskTitle = '.adf-activiti-task-details__header span';
     completeButtonNoForm = $('#adf-no-form-complete-button');

lib/content-services/src/lib/search/components/search-properties/search-properties.component.ts

@@ -104,7 +104,11 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear
                 const extraFreeSpace = 20;
                 this._fileSizeOperatorsMaxWidth = Math.max(...this._fileSizeOperators.map((operator) =>
                     this.getOperatorNameWidth(operator, this.getCanvasFont(this.fileSizeOperatorSelectElement.nativeElement)))) +
+<<<<<<< Updated upstream
                     this.fileSizeOperatorSelectElement.nativeElement.querySelector('.mat-mdc-select-arrow').clientWidth +
+=======
+                    this.fileSizeOperatorSelectElement.nativeElement.querySelector('.mat-mdc-select-arrow-wrapper').clientWidth +
+>>>>>>> Stashed changes
                     extraFreeSpace;
             });
         }

lib/core/src/lib/context-menu/animations.ts

@@ -33,10 +33,10 @@ export const contextMenuAnimation: ( AnimationStateMetadata | AnimationTransitio
         transform: 'scale(0.01, 0.01)'
     })),
     transition('void => *', sequence([
-        query('.mat-menu-content', style({ opacity: 0 })),
+        query('.mat-mdc-menu-content', style({ opacity: 0 })),
         animate('100ms linear', style({ opacity: 1, transform: 'scale(1, 0.5)' })),
         group([
-            query('.mat-menu-content', animate('400ms cubic-bezier(0.55, 0, 0.55, 0.2)',
+            query('.mat-mdc-menu-content', animate('400ms cubic-bezier(0.55, 0, 0.55, 0.2)',
                 style({ opacity: 1 })
             )),
             animate('300ms cubic-bezier(0.25, 0.8, 0.25, 1)', style({ transform: 'scale(1, 1)' }))

lib/core/src/lib/form/components/widgets/form.theme.scss

@@ -73,9 +73,15 @@ ul > li > form-field > .adf-focus {
 /* query for Microsoft IE 11 */
 @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
     adf-form-field {
+<<<<<<< Updated upstream
         .mat-mdc-input-element,
         .mat-mdc-select,
         .mat-mdc-form-field {
+=======
+        .mat-input-element,
+        .mat-mdc-select,
+        .mat-form-field {
+>>>>>>> Stashed changes
             display: block !important;
         }
     }

lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.scss

@@ -8,8 +8,12 @@
             width: 100%;
         }
 
+<<<<<<< Updated upstream
         /* TODO(mdc-migration): The following rule targets internal classes of select that may no longer apply for the MDC version. */
         .mat-select-value-text {
+=======
+        .mat-mdc-select-value-text {
+>>>>>>> Stashed changes
             font-size: var(--theme-body-1-font-size);
         }
 

lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts

@@ -203,8 +203,13 @@ describe('DropdownCloudWidgetComponent', () => {
 
             await openSelect();
 
+<<<<<<< Updated upstream
             const options = fixture.debugElement.queryAll(By.css('.mat-mdc-option'));
             expect(options[0].nativeElement.innerText).toBe('default1_value');
+=======
+            const option = fixture.debugElement.query(By.css('.mdc-list-item__primary-text'));
+            expect(option.nativeElement.innerText).toBe('default1_value');
+>>>>>>> Stashed changes
         });
 
         it('should preselect dropdown widget value when String (defined value) passed ', async () => {
@@ -227,7 +232,11 @@ describe('DropdownCloudWidgetComponent', () => {
             fixture.detectChanges();
 
             await openSelect();
+<<<<<<< Updated upstream
             const options = fixture.debugElement.queryAll(By.css('.mat-mdc-option'));
+=======
+            const options = fixture.debugElement.queryAll(By.css('.mdc-list-item__primary-text'));
+>>>>>>> Stashed changes
             expect(options[0].nativeElement.innerText).toBe('default1_value');
             expect(widget.field.form.values['dropdown-id']).toEqual({ id: 'opt1', name: 'default1_value' });
         });
@@ -452,7 +461,11 @@ describe('DropdownCloudWidgetComponent', () => {
 
             await openSelect('#dropdown-id');
 
+<<<<<<< Updated upstream
             const options = fixture.debugElement.queryAll(By.css('mat-option.mdc-list-item--selected span'));
+=======
+            const options = fixture.debugElement.queryAll(By.css('.mat-mdc-selected span'));
+>>>>>>> Stashed changes
             expect(Array.from(options).map(({ nativeElement }) => nativeElement.getInnerHTML().trim()))
                 .toEqual(['option_1', 'option_2']);
         });
@@ -521,7 +534,11 @@ describe('DropdownCloudWidgetComponent', () => {
 
             await openSelect('#dropdown-id');
 
+<<<<<<< Updated upstream
             const options = fixture.debugElement.queryAll(By.css('mat-option.mdc-list-item--selected span'));
+=======
+            const options = fixture.debugElement.queryAll(By.css('.mat-mdc-selected span'));
+>>>>>>> Stashed changes
             expect(Array.from(options).map(({ nativeElement }) => nativeElement.getInnerHTML().trim()))
                 .toEqual(['option_3', 'option_4']);
         });

lib/process-services/src/lib/form/widgets/dropdown/dropdown.widget.scss

@@ -6,8 +6,13 @@
             padding-top: 0 !important;
             width: 100%;
         }
+<<<<<<< Updated upstream
         /* TODO(mdc-migration): The following rule targets internal classes of select that may no longer apply for the MDC version. */
         .mat-select-value-text {
+=======
+
+        .mat-mdc-select-value-text {
+>>>>>>> Stashed changes
             font-size: var(--theme-body-1-font-size);
         }
 

lib/process-services/src/lib/process-list/components/start-process.component.spec.ts

@@ -339,11 +339,16 @@ describe('StartProcessComponent', () => {
             selectElement.click();
 
             fixture.detectChanges();
+<<<<<<< Updated upstream
 
             fixture.componentInstance.inputAutocomplete.openPanel();
             fixture.detectChanges();
             // await fixture.whenStable();
             const options: any = fixture.debugElement.queryAll(By.css('.mdc-list-item__primary-textk'));
+=======
+            await fixture.whenStable();
+            const options: any = fixture.debugElement.queryAll(By.css('.mdc-list-item__primary-text'));
+>>>>>>> Stashed changes
 
             expect(options.length).toBe(2);
             expect(options[0].nativeElement.innerText).toBe('My Process 1');

lib/testing/src/lib/protractor/content-services/pages/search/search-sorting-picker.page.ts

@@ -27,7 +27,7 @@ export class SearchSortingPickerPage {
 
     async sortBy(sortOrder: string, sortType: string | RegExp): Promise<void> {
         await this.sortingDropdown.clickDropdown();
-        const selectedSortingOption = element(by.cssContainingText('.mat-option-text', sortType));
+        const selectedSortingOption = element(by.cssContainingText('.mdc-list-item__primary-text', sortType));
         await BrowserActions.click(selectedSortingOption);
         await this.sortByOrder(sortOrder);
     }
@@ -53,7 +53,7 @@ export class SearchSortingPickerPage {
     }
 
     async clickSortingOption(option: string): Promise<void> {
-        const selectedSortingOption = element(by.cssContainingText('.mat-option-text', option));
+        const selectedSortingOption = element(by.cssContainingText('.mdc-list-item__primary-text', option));
         await BrowserActions.click(selectedSortingOption);
     }
 

lib/testing/src/lib/protractor/core/pages/form/form-fields.ts

@@ -96,7 +96,7 @@ export class FormFields {
     async getFieldPlaceHolder(fieldId: string, locator = 'input'): Promise<string> {
         const placeHolderLocator = $(`${locator}#${fieldId}`);
         await BrowserVisibility.waitUntilElementIsVisible(placeHolderLocator);
-        return BrowserActions.getAttribute(placeHolderLocator, 'data-placeholder');
+        return BrowserActions.getAttribute(placeHolderLocator, 'placeholder');
     }
 
     async refreshForm(): Promise<void> {

lib/testing/src/lib/protractor/core/pages/form/widgets/attach-file-widget.page.ts

@@ -28,10 +28,17 @@ export class AttachFileWidgetPage {
     filesListLocator = 'div[data-automation-id="adf-attach-widget-readonly-list"]';
     attachFileWidget = $('#attachfile');
     attachedFileMenu = $('mat-list-item button');
+<<<<<<< Updated upstream
     attachedFileOptions = $('.mat-mdc-menu-content');
     viewFileOptionButton = $(`.mat-mdc-menu-content button[id$="show-file"]`);
     downloadFileOptionButton = $(`.mat-mdc-menu-content button[id$="download-file"]`);
     removeFileOptionButton = TestElement.byCss(`.mat-mdc-menu-content button[id$="remove"]`);
+=======
+    attachedFileOptions = $('.mat-mdc-menu-panel .mat-mdc-menu-content');
+    viewFileOptionButton = $(`.mat-mdc-menu-panel .mat-mdc-menu-content button[id$="show-file"]`);
+    downloadFileOptionButton = $(`.mat-mdc-menu-panel .mat-mdc-menu-content button[id$="download-file"]`);
+    removeFileOptionButton = TestElement.byCss(`.mat-mdc-menu-panel .mat-mdc-menu-content button[id$="remove"]`);
+>>>>>>> Stashed changes
 
     async attachFile(fieldId: string, fileLocation: string): Promise<void> {
         const widget = await this.formFields.getWidget(fieldId);

lib/testing/src/lib/protractor/core/pages/material/date-picker-calendar.page.ts

@@ -25,7 +25,7 @@ export class DatePickerCalendarPage {
     datePicker = $('mat-calendar[id*="mat-datepicker"]');
     nextMonthButton = $('button[class*="mat-calendar-next-button"]');
     previousMonthButton = $('button[class*="mat-calendar-previous-button"]');
-    todayDate = TestElement.byCss('div.mat-calendar-body-today');
+    todayDate = TestElement.byCss('span.mat-calendar-body-today');
     periodButton = $('button[class*=mat-calendar-period-button]');
 
     async getSelectedDate(): Promise<string> {

lib/testing/src/lib/protractor/core/pages/material/dropdown.page.ts

@@ -35,7 +35,11 @@ export class DropdownPage {
 
     async selectOption(option: string): Promise<void> {
         Logger.log(`Select dropdown option ${option}`);
+<<<<<<< Updated upstream
         const optionElement = element.all(by.cssContainingText('.mat-mdc-option .mdc-list-item__primary-text', option)).first();
+=======
+        const optionElement = element.all(by.cssContainingText('mat-option span.mdc-list-item__primary-text', option)).first();
+>>>>>>> Stashed changes
         await BrowserActions.click(optionElement);
         await browser.waitForAngular();
     }
@@ -49,7 +53,11 @@ export class DropdownPage {
     }
 
     async getNumberOfOptions(): Promise<number> {
+<<<<<<< Updated upstream
         const dropdownOptions = $$('.mat-mdc-select-panel .mat-mdc-option');
+=======
+        const dropdownOptions = $$('.mat-mdc-select-panel mat-option');
+>>>>>>> Stashed changes
         return dropdownOptions.count();
     }
 
@@ -80,16 +88,28 @@ export class DropdownPage {
     }
 
     async getSelectedOptionText(): Promise<string> {
+<<<<<<< Updated upstream
         const selectedOption = this.dropDownElement.$('.mdc-list-item__primary-text');
+=======
+        const selectedOption = this.dropDownElement.$('.mat-mdc-select-value-text span');
+>>>>>>> Stashed changes
         return BrowserActions.getText(selectedOption);
     }
 
     async checkOptionIsDisplayed(option: string): Promise<void> {
+<<<<<<< Updated upstream
         await BrowserVisibility.waitUntilElementIsVisible(element.all(by.cssContainingText('.mat-mdc-option .mdc-list-item__primary-text', option)).first());
     }
 
     async checkOptionIsNotDisplayed(option: string): Promise<void> {
         await BrowserVisibility.waitUntilElementIsNotVisible(element.all(by.cssContainingText('.mat-mdc-option .mdc-list-item__primary-text', option)).first());
+=======
+        await BrowserVisibility.waitUntilElementIsVisible(element.all(by.cssContainingText('mat-option span.mdc-list-item__primary-text', option)).first());
+    }
+
+    async checkOptionIsNotDisplayed(option: string): Promise<void> {
+        await BrowserVisibility.waitUntilElementIsNotVisible(element.all(by.cssContainingText('mat-option span.mdc-list-item__primary-text', option)).first());
+>>>>>>> Stashed changes
     }
 
     async selectDropdownOption(option: string): Promise<void> {

lib/testing/src/lib/protractor/process-services-cloud/pages/edit-task-filter-cloud-component.page.ts

@@ -36,8 +36,8 @@ export class EditTaskFilterCloudComponentPage {
     id = $('input[data-automation-id="adf-cloud-edit-task-property-taskId"]');
     processDefinitionId = $('input[data-automation-id="adf-cloud-edit-task-property-processDefinitionId"]');
     processInstanceId = $('input[data-automation-id="adf-cloud-edit-task-property-processInstanceId"]');
-    lastModifiedFrom = $('input[data-placeholder="LastModifiedFrom"]');
+    lastModifiedFrom = $('input[placeholder="LastModifiedFrom"]');
-    lastModifiedTo = $('input[data-placeholder="LastModifiedTo"]');
+    lastModifiedTo = $('input[placeholder="LastModifiedTo"]');
     parentTaskId = $('input[data-automation-id="adf-cloud-edit-task-property-parentTaskId"]');
     owner = $('input[data-automation-id="adf-cloud-edit-task-property-owner"]');
     saveButton = $('[data-automation-id="adf-filter-action-save"]');

lib/testing/src/lib/protractor/process-services-cloud/pages/start-process-cloud-component.page.ts

@@ -33,7 +33,7 @@ export class StartProcessCloudPage {
     processDefinition = $('input[id="processDefinitionName"]');
     processDefinitionOptionsPanel = $('div[class*="processDefinitionOptions"]');
 
-    getSelectProcessDropdownLocatorByName = (name: string): ElementFinder => element(by.cssContainingText('.mat-option-text', name));
+    getSelectProcessDropdownLocatorByName = (name: string): ElementFinder => element(by.cssContainingText('.mdc-list-item__primary-text', name));
 
     async checkNoProcessMessage(): Promise<void> {
         await BrowserVisibility.waitUntilElementIsVisible(this.noProcess);
@@ -63,7 +63,7 @@ export class StartProcessCloudPage {
 
     async selectFirstOptionFromProcessDropdown(): Promise<void> {
         await this.clickProcessDropdownArrow();
-        const selectFirstProcessDropdown = $$('.mat-option-text').first();
+        const selectFirstProcessDropdown = $$('.mdc-list-item__primary-text').first();
         await BrowserActions.click(selectFirstProcessDropdown);
     }
 

lib/testing/src/lib/protractor/process-services/pages/process-instance-tasks.page.ts

@@ -22,7 +22,7 @@ import { BrowserActions } from '../../core/utils/browser-actions';
 export class ProcessInstanceTasksPage {
 
     startProcessDialog = $('#adf-start-process-dialog');
-    title = this.startProcessDialog.$('h4.mat-dialog-title');
+    title = this.startProcessDialog.$('h4.mat-mdc-dialog-title');
     closeButton = this.startProcessDialog.element(by.cssContainingText(`div.adf-start-process-dialog-actions button span`, 'Close'));
     startForm = $('div[data-automation-id="start-form"]');