@alfresco/aca-playwright-shared 7.3.0-21514112140 → 7.3.0-21519063154

package/fesm2022/alfresco-aca-playwright-shared.mjs

@@ -656,7 +656,7 @@ class PlaywrightBase {
 class BaseComponent extends PlaywrightBase {
     rootElement;
     overlayElement = this.page.locator('.cdk-overlay-backdrop-showing');
-    progressBar = this.page.locator('mat-progress-bar');
+    progressBar = this.page.locator('[role="progressbar"]');
     constructor(page, rootElement) {
         super(page);
         this.rootElement = rootElement;
@@ -680,8 +680,8 @@ class BaseComponent extends PlaywrightBase {
     }
     async spinnerWaitForReload() {
         try {
-            await this.page.locator('mat-progress-spinner').waitFor({ state: 'attached', timeout: timeouts.medium });
-            await this.page.locator('mat-progress-spinner').waitFor({ state: 'detached', timeout: timeouts.normal });
+            await this.page.locator('[role="progressbar"]').waitFor({ state: 'attached', timeout: timeouts.medium });
+            await this.page.locator('[role="progressbar"]').waitFor({ state: 'detached', timeout: timeouts.normal });
         }
         catch (e) {
             this.logger.info('Spinner was not present');
@@ -773,7 +773,7 @@ class SnackBarComponent extends BaseComponent {
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 class MatMenuComponent extends BaseComponent {
-    static rootElement = '.mat-mdc-menu-content';
+    static rootElement = '[role="menu"]';
     constructor(page) {
         super(page, MatMenuComponent.rootElement);
     }
@@ -801,10 +801,10 @@ class MatMenuComponent extends BaseComponent {
         return menuElement.isVisible();
     }
     async verifyActualMoreActions(expectedToolbarMore) {
-        await this.page.locator('.mat-mdc-menu-content').waitFor({ state: 'attached' });
-        const menus = await this.page.$$('.mat-mdc-menu-content .mat-mdc-menu-item');
+        await this.getChild('').waitFor();
+        const menus = await this.getChild('[role="menuitem"]').all();
         const actualMoreActions = await Promise.all(menus.map(async (button) => {
-            const title = await (await button.$('.mat-mdc-menu-item-text span')).innerText();
+            const title = await button.locator('span span').innerText();
             return title || '';
         }));
         for (const action of expectedToolbarMore) {
@@ -870,8 +870,8 @@ class PaginationComponent extends BaseComponent {
     }
     async spinnerWaitForReload() {
         try {
-            await this.page.locator('mat-progress-spinner').waitFor({ state: 'attached', timeout: 2000 });
-            await this.page.locator('mat-progress-spinner').waitFor({ state: 'detached', timeout: 2000 });
+            await this.page.locator('[role="progressbar"]').waitFor({ state: 'attached', timeout: 2000 });
+            await this.page.locator('[role="progressbar"]').waitFor({ state: 'detached', timeout: 2000 });
         }
         catch (e) {
             this.logger.info('Spinner was not present');
@@ -1032,8 +1032,6 @@ class DataTableComponent extends BaseComponent {
     sitesName = this.page.locator('.adf-datatable-body [data-automation-id*="datatable-row"] [aria-label="Name"]');
     sitesRole = this.page.locator('.adf-datatable-body [data-automation-id*="datatable-row"] [aria-label="My Role"]');
     lockOwner = this.page.locator('.aca-locked-by--name');
-    uncheckedCheckbox = this.page.locator('.mat-mdc-checkbox');
-    checkedCheckbox = this.page.locator('.mat-mdc-checkbox-checked');
     highlightedText = '.aca-highlight';
     searchFileName = '.search-file-name';
     searchFileDescription = '[data-automation-id="search-results-entry-description"]';
@@ -1074,12 +1072,6 @@ class DataTableComponent extends BaseComponent {
      * @returns reference to cell element.
      */
     getByAriaLabelTitle = (title) => this.getChild(`[aria-label="${title}"]`);
-    /**
-     * Method used in cases where we want to get the button (hamburger menu) for row element
-     *
-     * @returns reference to menu placed in row localized by the name
-     */
-    getActionsButtonByName = (name) => this.getRowByName(name).locator('mat-icon', { hasText: new RegExp(`^\\s*more_vert\\s*$`, 'g') });
     /**
      * Method used in cases where we want to get the edit button and there is no hamburger menu
      *
@@ -1103,7 +1095,7 @@ class DataTableComponent extends BaseComponent {
      *
      * @returns reference to checkbox placed in row localized by the name
      */
-    getCheckboxForElement = (item) => this.getRowByName(item).locator('.mat-mdc-checkbox');
+    getCheckboxForElement = (item) => this.getRowByName(item).locator('[type="checkbox"]');
     getColumnHeaderByTitleLocator = (headerTitle) => this.getChild('[role="columnheader"]', { hasText: headerTitle });
     getSearchResultLinkByName = (name) => this.getChild('.aca-search-results-row span[role="link"]', { hasText: name });
     getColumnValuesByName = (name) => this.getChild(`div[title="${name}"] span`);
@@ -1132,20 +1124,6 @@ class DataTableComponent extends BaseComponent {
         await actionButtonLocator.click();
         await this.spinnerWaitForReload();
     }
-    /**
-     * Click action from the expandable kebab menu for the element in datatable
-     *
-     * @param name title of the record you would like to proceed
-     * @param action provide button title for the action
-     * @param subAction if the action is in sub menu, then provide it here
-     */
-    async performActionForElement(name, action, subAction) {
-        await this.getActionsButtonByName(name).click();
-        await this.contextMenuActions.getButtonByText(action).click();
-        if (subAction) {
-            await this.contextMenuActions.getButtonByText(subAction).click();
-        }
-    }
     /**
      * This method is used when we want to perform double click on the dataTable row to open a file or folder
      *
@@ -1196,14 +1174,16 @@ class DataTableComponent extends BaseComponent {
             if (!isSelected) {
                 const row = this.getRowByName(name);
                 await row.hover();
-                await row.locator(this.uncheckedCheckbox).click();
-                await row.locator(this.checkedCheckbox).waitFor({ state: 'visible', timeout: timeouts.large });
+                if (!(await this.getCheckboxForElement(name).isChecked())) {
+                    await this.getCheckboxForElement(name).click();
+                }
             }
         }
     }
     async isRowSelected(itemName) {
         const row = this.getRowByName(itemName);
-        return row.locator(this.checkedCheckbox).isVisible();
+        await row.hover();
+        return this.getCheckboxForElement(itemName).isChecked();
     }
     async getColumnHeaders() {
         const columnNameLocator = this.columnHeaders;
@@ -1409,7 +1389,7 @@ class ToolbarComponent extends BaseComponent {
 class AdfFolderDialogComponent extends BaseComponent {
     static rootElement = 'adf-folder-dialog';
     folderNameInputLocator = this.getChild('[id="adf-folder-name-input"]');
-    folderNameInputHint = this.getChild('mat-hint');
+    folderNameInputHint = this.getChild('[aria-atomic="true"] span');
     folderTitleInput = this.getChild('[id="adf-folder-title-input"]');
     folderDescriptionInput = this.getChild('[id="adf-folder-description-input"]');
     createButton = this.getChild('[id="adf-folder-create-button"]');
@@ -1418,7 +1398,7 @@ class AdfFolderDialogComponent extends BaseComponent {
         super(page, AdfFolderDialogComponent.rootElement);
     }
     getLabelText = (text) => this.getChild('label', { hasText: text });
-    getRequiredMarker = (text) => this.getLabelText(text).locator('.mat-mdc-form-field-required-marker');
+    getRequiredMarker = (text) => this.getLabelText(text).locator('span');
     /**
      * This method is used when we want to fill in Create new Folder Dialog and choose Create button
      *
@@ -1469,9 +1449,9 @@ class AdfLibraryDialogComponent extends BaseComponent {
         super(page, AdfLibraryDialogComponent.rootElement);
     }
     getLabelText = (text) => this.getChild('label', { hasText: text });
-    getRequiredMarker = (text) => this.getLabelText(text).locator('.mat-mdc-form-field-required-marker');
-    getDialogTitle = (text) => this.getChild('.mat-mdc-dialog-title', { hasText: text });
-    getErrorByText = (text) => this.page.locator('mat-error', { hasText: text });
+    getRequiredMarker = (text) => this.getLabelText(text).locator('span');
+    getDialogTitle = (text) => this.getChild('h2', { hasText: text });
+    getErrorByText = (text) => this.getChild('.adf-library-dialog-form-field').getByText(text);
     /**
      * This method is used when we want to fill in Create Library Dialog and choose Create button
      *
@@ -1645,19 +1625,19 @@ class ViewerOverlayDialogComponent extends BaseComponent {
  */
 class ContentNodeSelectorDialog extends BaseComponent {
     static rootElement = 'adf-content-node-selector';
-    constructor(page) {
-        super(page, ContentNodeSelectorDialog.rootElement);
-    }
-    cancelButton = this.getChild('[data-automation-id="content-node-selector-actions-cancel"]');
-    actionButton = this.getChild('[data-automation-id="content-node-selector-actions-choose"]');
-    locationDropDown = this.getChild('[id="site-dropdown-container"] mat-form-field');
     selectedRow = this.getChild('.adf-is-selected');
-    getOptionLocator = (optionName) => this.page.locator('.mat-mdc-select-panel .mdc-list-item__primary-text', { hasText: optionName });
     getRowByName = (name) => this.getChild(`adf-datatable-row`, { hasText: name.toString() });
+    cancelButton = this.getChild('[data-automation-id="content-node-selector-actions-cancel"]');
+    actionButton = this.getChild('[data-automation-id="content-node-selector-actions-choose"]');
+    locationDropDown = this.getChild('[id="site-dropdown-container"] .adf-sites-dropdown-form-field');
+    getOptionLocator = (optionName) => this.page.locator('[role=listbox] [role=option]', { hasText: optionName }).first();
     getDialogTitle = (text) => this.getChild('[data-automation-id="content-node-selector-title"]', { hasText: text });
     getBreadcrumb = (text) => this.getChild('[data-automation-id="current-folder"]', { hasText: text });
     getFolderIcon = this.getChild('[data-automation-id="dropdown-breadcrumb-trigger"]');
     loadMoreButton = this.getChild('[data-automation-id="adf-infinite-pagination-button"]');
+    constructor(page) {
+        super(page, ContentNodeSelectorDialog.rootElement);
+    }
     async loadMoreNodes() {
         await this.spinnerWaitForReload();
         while (await this.loadMoreButton.isVisible()) {
@@ -1709,7 +1689,7 @@ class ContentNodeSelectorDialog extends BaseComponent {
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 class CreateFromTemplateDialogComponent extends BaseComponent {
-    static rootElement = 'mat-dialog-container';
+    static rootElement = '.aca-create-from-template-dialog';
     constructor(page) {
         super(page, CreateFromTemplateDialogComponent.rootElement);
     }
@@ -1795,16 +1775,14 @@ class AdfConfirmDialogComponent extends BaseComponent {
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 class DateTimePicker extends BaseComponent {
-    static rootElement = '.mat-calendar';
-    calendar = this.getChild('.mat-datepicker-popup');
-    dayPicker = this.getChild('mat-month-view');
-    nextMonthBtn = this.getChild('.mat-calendar-next-button');
-    rootElemLocator = this.page.locator('.mat-datepicker-popup');
+    static rootElement = '[role="dialog"]';
+    dayPicker = this.getChild('[role="grid"]');
+    nextMonthBtn = this.getChild('[aria-label="Next month"]');
     constructor(page) {
         super(page, DateTimePicker.rootElement);
     }
     async isCalendarOpen() {
-        const element = this.rootElemLocator;
+        const element = this.getChild('');
         return element.isVisible();
     }
     async pickDateTime() {
@@ -1859,10 +1837,11 @@ class ShareDialogComponent extends BaseComponent {
     urlAction = this.getChild('.adf-input-action');
     expireToggle = this.getChild(`[data-automation-id='adf-expire-toggle']`);
     expireInput = this.getChild('input[formcontrolname="time"]');
-    datetimePickerButton = this.getChild('.mat-datepicker-toggle');
+    datetimePickerButton = this.getChild('[data-automation-id="adf-content-share-expiration-field"] button');
+    dateErrorText = this.getChild('[data-automation-id="adf-share-link-input-warning"]');
+    clockIcon = this.getChild('[adf-icon="timer"]');
     dateTimePicker = new DateTimePicker(this.page);
     getDialogLabel = () => this.getChild('label').innerText();
-    getErrorByText = (text) => this.page.locator('mat-error', { hasText: text });
     async getLabels() {
         return this.page.$$eval('.adf-share-link__label', (elements) => elements.map((element) => element.textContent));
     }
@@ -2084,18 +2063,18 @@ class AdfDeleteTrashComponent extends BaseComponent {
  */
 class LinkRulesDialog extends BaseComponent {
     static rootElement = 'aca-rule-set-picker';
-    constructor(page) {
-        super(page, LinkRulesDialog.rootElement);
-    }
+    getRowByName = (name) => this.getChild(`adf-datatable-row`, { hasText: name.toString() });
     cancelButton = this.getChild('[data-automation-id="content-node-selector-actions-cancel"]');
     selectFolderButton = this.getChild('button', { hasText: ' Select folder ' });
     emptyLinkRules = this.getChild('.adf-empty-content__title');
-    getOptionLocator = (optionName) => this.page.locator('.mat-mdc-select-panel .mdc-list-item__primary-text', { hasText: optionName });
-    getRowByName = (name) => this.getChild(`adf-datatable-row`, { hasText: name.toString() });
+    getOptionLocator = (optionName) => this.page.locator('[role=listbox] [role=option]', { hasText: optionName }).first();
     getDialogTitle = (text) => this.getChild('[data-automation-id="content-node-selector-title"]', { hasText: text });
     getBreadcrumb = (text) => this.getChild('[data-automation-id="current-folder"]', { hasText: text });
     getFolderIcon = this.getChild('.adf-dropdown-breadcrumb-icon', { hasText: 'folder' });
     getLibraryIcon = this.getChild('.adf-empty-content__icon', { hasText: 'library_books' });
+    constructor(page) {
+        super(page, LinkRulesDialog.rootElement);
+    }
     async selectDestination(folderName) {
         const row = this.getRowByName(folderName);
         await expect(row).toBeVisible();
@@ -2138,14 +2117,14 @@ class LinkRulesDialog extends BaseComponent {
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 class EditDialog extends BaseComponent {
-    static rootElement = 'mat-dialog-container';
+    static rootElement = 'adf-folder-dialog';
     editDialog = this.getChild('');
     titleInput = this.getChild('[data-automation-id="adf-folder-dialog-title"]');
     cancelButton = this.getChild('#adf-folder-cancel-button');
     updateButton = this.getChild('#adf-folder-create-button');
     descriptionInput = this.getChild('#adf-folder-description-input');
     nameInput = this.getChild('#adf-folder-name-input');
-    fieldHint = this.getChild('mat-hint');
+    fieldHint = this.getChild('[aria-atomic="true"] span');
     constructor(page) {
         super(page, EditDialog.rootElement);
     }
@@ -2307,8 +2286,8 @@ class ManageRulesDialogComponent extends BaseComponent {
 class ManageRules extends BaseComponent {
     static rootElement = '.aca-manage-rules';
     getGroupsList = (optionName) => this.getChild('.aca-rule-list-item__header', { hasText: optionName });
-    ruleToggle = this.getChild('.aca-manage-rules__container .mdc-switch').first();
-    ruleToggleFalse = this.getChild('aca-rule-list-grouping aca-rule-list-item .mdc-switch--unselected').first();
+    ruleToggle = this.getChild('.aca-manage-rules__container [role="switch"]').first();
+    ruleToggleFalse = this.getChild('aca-rule-list-grouping aca-rule-list-item [role="switch"][aria-checked="false"]').first();
     ruleDetailsTitle = this.getChild('.aca-manage-rules__container__rule-details__header__title__name');
     ruleDetailsDeleteButton = this.getChild('#delete-rule-btn');
     ruleDetailsEditButton = this.getChild('#edit-rule-btn');
@@ -2396,7 +2375,7 @@ class ManageRules extends BaseComponent {
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 class SpinnerComponent extends BaseComponent {
-    static rootElement = 'mat-progress-spinner';
+    static rootElement = '[role="progressbar"]';
     constructor(page, rootElement = SpinnerComponent.rootElement) {
         super(page, rootElement);
     }
@@ -2469,20 +2448,19 @@ var MimeType;
 })(MimeType || (MimeType = {}));
 class ActionsDropdownComponent extends BaseComponent {
     static rootElement = 'aca-edit-rule-dialog aca-rule-action-list';
-    getOptionLocator = (optionName) => this.page.locator('.mat-mdc-select-panel .mdc-list-item__primary-text', { hasText: optionName }).first();
+    getOptionLocator = (optionName) => this.page.locator('[role=listbox] [role=option]', { hasText: optionName }).first();
     ruleActionLocator = this.getChild('aca-rule-action');
     addActionButtonLocator = this.getChild('[data-automation-id="rule-action-list-add-action-button"]');
     actionDropdownLocator = this.getChild('[data-automation-id="rule-action-select"]');
     actionAspectNameLocator = '[data-automation-id="header-aspect-name"] .adf-property-field';
     actionCheckInInputLocator = '[data-automation-id="header-description"] input';
-    actionAutoDeclareLocator = '[data-automation-id="header-version"] mat-select';
-    actionSpecialiseTypeLocator = '[data-automation-id="header-type-name"] mat-select';
     actionSimpleWorkflowStepInputLocator = '[data-automation-id="header-approve-step"] input';
-    actionSimpleWorkflowApproveFolderLocator = `[data-automation-id="header-approve-folder"] mat-icon`;
     actionSimpleWorkflowActionChoiceLocator = '[data-automation-id="content-node-selector-actions-choose"]';
     actionSimpleWorkflowLabelApproveLocator = `[data-automation-id="card-boolean-label-approve-move"]`;
     actionSimpleWorkflowSRejectStepLocator = '[data-automation-id="header-reject-step"] input';
     actionSimpleWorkflowRejectFolderLocator = `[data-automation-id="header-reject-folder"] input`;
+    actionSimpleWorkflowApproveFolderLocator = `[data-automation-id="header-approve-folder"] [role="img"]`;
+    actionSpecialiseTypeLocator = '[data-automation-id="header-type-name"] [role="combobox"]';
     mimeTypeDropdownLocator = this.getChild('[data-automation-id="select-box"][aria-label="Mimetype *"]');
     actionTransformAndCopyContentDestinationFolderLocator = '[data-automation-id="card-textitem-value-destination-folder"]';
     contentNodeSelectorSearchInput = '[data-automation-id="content-node-selector-search-input"]';
@@ -2508,9 +2486,6 @@ class ActionsDropdownComponent extends BaseComponent {
     async insertAddAspectActionValues(AspectValue, index) {
         await this.dropdownSelection(AspectValue, this.actionAspectNameLocator, index);
     }
-    async insertAutoDeclareOptionsActionValues(autoDeclareOptionsValue, index) {
-        await this.dropdownSelection(autoDeclareOptionsValue, this.actionAutoDeclareLocator, index);
-    }
     async insertSpecialiseTypeActionValues(specialiseTypeValue, index) {
         await this.dropdownSelection(specialiseTypeValue, this.actionSpecialiseTypeLocator, index);
     }
@@ -2619,7 +2594,7 @@ var Comparator;
     Comparator["EndsWith"] = "Ends with";
 })(Comparator || (Comparator = {}));
 class ConditionComponent extends ManageRulesDialogComponent {
-    getOptionLocator = (optionName) => this.page.locator(`.cdk-overlay-pane .mat-mdc-option span`, { hasText: optionName });
+    getOptionLocator = (optionName) => this.page.locator('[role=listbox] [role=option]', { hasText: optionName }).first();
     async selectField(fields, index) {
         await this.fieldDropDown.nth(index).click();
         const option = this.getOptionLocator(fields);
@@ -2681,7 +2656,7 @@ class AdfInfoDrawerComponent extends BaseComponent {
     tagsCreator = this.getChild('adf-tags-creator');
     getNameField = (labelText) => this.getChild(`[data-automation-id="library-name-properties-wrapper"] input[placeholder='${labelText}']`);
     getIdField = (labelText) => this.getChild(`[data-automation-id="library-id-properties-wrapper"] input[placeholder='${labelText}']`);
-    getVisibilityField = (labelText) => this.getChild(`[data-automation-id="library-visibility-properties-wrapper"] mat-select[ng-reflect-placeholder='${labelText}']`);
+    getVisibilityField = (labelText) => this.getChild(`[data-automation-id="library-visibility-properties-wrapper"] [role="combobox"][ng-reflect-placeholder='${labelText}']`);
     getDescriptionField = this.getChild('[data-automation-id="library-description-properties-wrapper"] textarea');
     propertiesTab = this.page.getByRole('tab', { name: 'Properties' });
     commentsTab = this.page.getByRole('tab', { name: 'Comments' });
@@ -2698,10 +2673,11 @@ class AdfInfoDrawerComponent extends BaseComponent {
     editButton = this.page.getByRole('button', { name: 'Edit' });
     cancelButton = this.page.getByRole('button', { name: 'Cancel' });
     updateButton = this.page.getByRole('button', { name: 'Update' });
-    hintMessage = this.page.locator('mat-hint');
-    errorMessage = this.page.locator('mat-error');
+    hintMessage = this.getChild('[data-automation-id="app-library-metadata-form-name-hint"]');
+    errorNameMessage = this.getChild('[data-automation-id="library-name-properties-wrapper"] [aria-atomic="true"]');
+    errorDescriptionMessage = this.getChild('[data-automation-id="library-description-properties-wrapper"] [aria-atomic="true"]');
     expandDetailsButton = this.getChild(`button[title='Expand panel']`);
-    expandedDetailsTabs = this.page.locator('.aca-details-container .mdc-tab__text-label');
+    expandedDetailsTabs = this.page.locator('.aca-details-container [role="tab"]');
     expandedDetailsPermissionsTab = this.expandedDetailsTabs.getByText('Permissions');
     nameField = this.page.locator('input[placeholder=Name]');
     idField = this.page.locator(`input[placeholder='Library ID']`);
@@ -2714,7 +2690,7 @@ class AdfInfoDrawerComponent extends BaseComponent {
     categoriesAccordionPenButton = this.categoriesAccordion.locator('[data-automation-id="meta-data-categories-edit"]');
     tagsInput = this.tagsCreator.locator('input');
     createTagButton = this.tagsCreator.locator('.adf-create-tag-label');
-    tagsChips = this.tagsCreator.locator('mat-chip');
+    tagsChips = this.tagsCreator.locator('[role="listitem"]');
     tagsChipsXButton = this.tagsChips.locator('.adf-dynamic-chip-list-delete-icon');
     tagsAccordionCancelButton = this.getChild('[data-automation-id="reset-tags-metadata"]');
     tagsAccordionConfirmButton = this.getChild('[data-automation-id="save-tags-metadata"]');
@@ -3051,16 +3027,13 @@ class SearchOverlayComponent extends BaseComponent {
         super(page, rootElement);
     }
     async isFoldersOptionChecked() {
-        const optClass = await this.searchFoldersOption.getAttribute('class');
-        return optClass.includes('.mat-mdc-checkbox-checked');
+        return this.searchFoldersOption.isChecked();
     }
     async isFilesOptionChecked() {
-        const optClass = await this.searchFilesOption.getAttribute('class');
-        return optClass.includes('.mat-mdc-checkbox-checked');
+        return this.searchFilesOption.isChecked();
     }
     async isLibrariesOptionChecked() {
-        const optClass = await this.searchLibrariesOption.getAttribute('class');
-        return optClass.includes('.mat-mdc-checkbox-checked');
+        return this.searchLibrariesOption.isChecked();
     }
     async clearOptions() {
         if (await this.isFilesOptionChecked()) {
@@ -3124,8 +3097,8 @@ class SearchSortingPicker extends BaseComponent {
     static rootElement = '#aca-button-action-menu';
     actionMenu = this.page.locator('[data-automation-id="auto_header_content_id_$thumbnail"]');
     sortOrderButton = this.page.locator('#aca-button-sorting-menu');
-    sortByDropdownExpanded = this.page.locator('.mat-mdc-menu-panel').first();
-    sortByList = this.page.locator('.mat-mdc-menu-panel button');
+    sortByDropdownExpanded = this.page.locator('[role="menu"]').first();
+    sortByList = this.page.locator('[role="menu"] button');
     constructor(page, rootElement = SearchSortingPicker.rootElement) {
         super(page, rootElement);
     }
@@ -3207,7 +3180,7 @@ class SearchFilters extends BaseComponent {
     menuCardClose = this.page.locator('.adf-search-filter-title-action');
     menuCardClear = this.page.locator('#cancel-filter-button');
     menuCardApply = this.page.locator('#apply-filter-button');
-    dropdownOptions = this.page.locator(`mat-option`);
+    dropdownOptions = this.page.locator(`[role="option"]`);
 }
 
 /*!
@@ -3461,13 +3434,13 @@ class SearchFiltersProperties extends BaseComponent {
     fileSizeInput = this.getChild(`[placeholder$='Enter file size']`);
     unitButton = this.getChild(`[data-automation-id='adf-search-properties-file-size-unit']`);
     fileTypeInput = this.getChild(`[placeholder$='File Type']`);
-    atLeastOption = this.page.locator(`mat-option`, { hasText: 'At Least' });
-    atMostOption = this.page.locator(`mat-option`, { hasText: 'At Most' });
-    exactlyOption = this.page.locator(`mat-option`, { hasText: 'Exactly' });
-    kbUnit = this.page.locator(`mat-option`, { hasText: 'KB' });
-    mbUnit = this.page.locator(`mat-option`, { hasText: 'MB' });
-    gbUnit = this.page.locator(`mat-option`, { hasText: 'GB' });
-    dropdownOptions = this.page.locator(`mat-option`);
+    atLeastOption = this.page.locator(`[role="option"]`, { hasText: 'At Least' });
+    atMostOption = this.page.locator(`[role="option"]`, { hasText: 'At Most' });
+    exactlyOption = this.page.locator(`[role="option"]`, { hasText: 'Exactly' });
+    kbUnit = this.page.locator(`[role="option"]`, { hasText: 'KB' });
+    mbUnit = this.page.locator(`[role="option"]`, { hasText: 'MB' });
+    gbUnit = this.page.locator(`[role="option"]`, { hasText: 'GB' });
+    dropdownOptions = this.page.locator(`[role="option"]`);
     async setPropertiesParameters(page, operator, unit, fileSizeInputText, fileTypeInputText) {
         await page.searchFilters.propertiesFilter.click();
         if (operator) {