Skip to content

Commit

Permalink
fix(locators) change button locators
Browse files Browse the repository at this point in the history
  • Loading branch information
@chalapkoStanislav
chalapkoStanislav committed Nov 18, 2024
1 parent b95b13e commit 74d342e
Show file tree
Hide file tree
Showing 8 changed files with 68 additions and 70 deletions.
50 changes: 29 additions & 21 deletions pages/dashboard/dashboard-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,9 +42,9 @@ exports.DashboardPage = class DashboardPage extends BasePage {
this.moveToOtherTeamMenuItem = page
.getByRole('menuitem')
.filter({ hasText: 'Move to other team' });
this.dashboardLibraryItem = page.locator(
`button[title="New File 1"] div[class*="dashboard_grid__library"]`,
);
this.dashboardLibraryItem = page
.getByRole('button', { name: 'New File 1' })
.locator(`div[class*="dashboard_grid__library"]`);
this.downloadFilePenpotMenuItem = page.getByTestId('download-binary-file');
this.downloadFileStandardMenuItem = page.getByTestId('download-standard-file');
this.dashboardSection = page.locator('[class="main_ui_dashboard__dashboard"]');
Expand Down Expand Up @@ -164,7 +164,9 @@ exports.DashboardPage = class DashboardPage extends BasePage {
this.onboardingContinueCreateTeamBtn = page.locator(
'button[label="Continue creating team"]',
);
this.onboardingContinueWithoutTeamBtn = page.getByRole('button').filter({hasText: 'Continue without team'});
this.onboardingContinueWithoutTeamBtn = page
.getByRole('button')
.filter({ hasText: 'Continue without team' });
this.onboardingInviteInput = page.locator(
'input[class*="components_forms__inside-input"]',
);
Expand Down Expand Up @@ -598,17 +600,17 @@ exports.DashboardPage = class DashboardPage extends BasePage {
await this.openFile();
}
async openFileWithName(name) {
const fileTitle = this.page.locator(`button[title="${name}"]`);
const fileTitle = this.page.getByRole('button', { name: name });
await fileTitle.first().dblclick();
}

async isFileVisibleByName(name) {
const elem = this.page.locator(`button[title="${name}"]`);
const elem = this.page.getByRole('button', { name: name });
await expect(elem.first()).toBeVisible();
}

async deleteFileWithNameViaRightClick(name) {
const elem = this.page.locator(`button[title="${name}"]`).first();
const elem = this.page.getByRole('button', { name: name }).first();
await elem.click({ button: 'right' });
await this.deleteFileMenuItem.click();
}
Expand All @@ -618,7 +620,7 @@ exports.DashboardPage = class DashboardPage extends BasePage {
}

async moveFileToOtherTeamViaRightClick(fileName, otherTeamName) {
const elem = this.page.locator(`button[title="${fileName}"]`).first();
const elem = this.page.getByRole('button', { name: fileName }).first();
await elem.click({ button: 'right' });
await expect(this.moveToFileMenuItem).toBeVisible();
await this.moveToFileMenuItem.click();
Expand All @@ -631,21 +633,23 @@ exports.DashboardPage = class DashboardPage extends BasePage {
}

async addFileWithNameAsSharedLibraryViaRightClick(fileName) {
const elem = this.page.locator(`button[title="${fileName}"]`).first();
const elem = this.page.getByRole('button', { name: fileName }).first();
await elem.click({ button: 'right' });
await this.addFileAsSharedLibraryMenuItem.click();
await this.addFileAsSharedLibraryButton.click();
}

async isFilePresentWithName(fileName) {
const fileNameTitle = this.page.locator(
`button[title="${fileName}"] div[class*="item-info"] h3`,
);
const fileNameTitle = this.page.this.page
.getByRole('button', { name: fileName })
.locator(`div[class*="item-info"] h3`);
await expect(fileNameTitle).toHaveText(fileName);
}

async renameFileWithNameViaRightClick(oldFileName, newFileName) {
const fileTitle = this.page.locator(`button[title="${oldFileName}"]`).first();
const fileTitle = this.page.this.page
.getByRole('button', { name: oldFileName })
.first();
let text = await fileTitle.textContent();
await fileTitle.click({ button: 'right' });
await this.renameFileMenuItem.click();
Expand All @@ -660,9 +664,11 @@ exports.DashboardPage = class DashboardPage extends BasePage {

async clickOnOnboardingContinueBtn() {
await this.onboardingContinueBtn.click();
await this.page.waitForResponse(response =>
response.url() === `${process.env.BASE_URL}api/rpc/command/push-audit-events` &&
response.status() === 200
await this.page.waitForResponse(
(response) =>
response.url() ===
`${process.env.BASE_URL}api/rpc/command/push-audit-events` &&
response.status() === 200,
);
}

Expand Down Expand Up @@ -875,11 +881,13 @@ exports.DashboardPage = class DashboardPage extends BasePage {
}

async clickOnOnboardingContinueWithoutTeamButton() {
if(await this.onboardingContinueWithoutTeamBtn.isVisible()) {
await this.onboardingContinueWithoutTeamBtn.click()
await this.page.waitForResponse(response =>
response.url() === `${process.env.BASE_URL}api/rpc/command/push-audit-events` &&
response.status() === 200
if (await this.onboardingContinueWithoutTeamBtn.isVisible()) {
await this.onboardingContinueWithoutTeamBtn.click();
await this.page.waitForResponse(
(response) =>
response.url() ===
`${process.env.BASE_URL}api/rpc/command/push-audit-events` &&
response.status() === 200,
);
}
}
Expand Down
14 changes: 6 additions & 8 deletions pages/workspace/assets-panel-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,19 +48,17 @@ exports.AssetsPanelPage = class AssetsPanelPage extends BasePage {
this.fileLibraryGroupTitle = page.locator('div[class*="group-title"]');
this.fileLibraryListViewButton = page.getByTitle('List view', { exact: true });
this.fileLibraryGridViewButton = page.getByTitle('Grid view', { exact: true });
this.addFileLibraryColorButton = page.locator(
'button[class*="assets_colors__assets-btn"]',
);
this.addFileLibraryColorButton = page.getByRole('button', { name: 'Add color' });
this.fileLibraryColorsColorBullet = page.locator(
'div[class*="assets_colors__bullet-block"]',
);
this.fileLibraryColorsColorTitle = page.locator('div[class*="name-block"]');
this.fileLibraryColorsColorNameInput = page.locator(
'input[class*="element-name"]',
);
this.addFileLibraryTypographyButton = page.locator(
'button[class*="typographies__assets-btn"]',
);
this.addFileLibraryTypographyButton = page.getByRole('button', {
name: 'Add typography',
});
this.minimizeFileLibraryTypographyButton = page.locator(
'div[class*="typography__action-btn"]',
);
Expand All @@ -83,8 +81,8 @@ exports.AssetsPanelPage = class AssetsPanelPage extends BasePage {
this.assetsTypeDropdown = page.locator('ul[class*="context-menu-items"]');
this.assetsTypeAll = page.locator('#section-all');
this.assetsTypeComponents = page.locator('#section-components');
this.assetsTypeColors = page.locator('#section-color');
this.assetsTypeTypographies = page.locator('#section-typography');
this.assetsTypeColors = page.locator('#section-colors');
this.assetsTypeTypographies = page.locator('#section-typographies');
this.duplicateMainComponentMenuItem = page
.getByRole('menuitem')
.filter({ hasText: 'Duplicate main' });
Expand Down
6 changes: 3 additions & 3 deletions pages/workspace/comments-panel-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,9 @@ exports.CommentsPanelPage = class CommentsPanelPage extends BasePage {
'div[class*="comments-container"] div.main_ui_comments__resolved',
);
this.commentReplyInput = page.getByPlaceholder('Reply');
this.commentOptionsButton = page.locator(
'div[class*="comments__options"] svg[class="icon-menu"]',
);
this.commentOptionsButton = page
.locator('div[class*="viewport_comments__comments-section"]')
.getByRole('button', { name: 'Options' });
this.commentEditOptionMenuItem = page
.getByRole('listitem')
.filter({ hasText: 'Edit' });
Expand Down
48 changes: 19 additions & 29 deletions pages/workspace/design-panel-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,9 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {
'div[class*="fill__element-content"] div[class*="opacity-element-wrapper"] input',
);
this.addFillButton = page.getByRole('button', { name: 'Add fill color' });
this.removeFillButton = page.getByRole('button', { name: 'Remove color' });
this.removeFillButton = page
.locator('div[class*="fill__element-content"]')
.getByRole('button', { name: 'Remove color' });
this.componentColorInput = page.locator(
`input[class*='rows_color_row__color-input']`,
);
Expand All @@ -72,15 +74,9 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {
this.shadowOpacityInput = page.locator(
'div[class*="shadow-advanced-options"] div[class*="color_row__opacity"] input',
);
this.shadowShowIcon = page.locator(
'div[class*="shadow__actions"] svg[class="icon-shown"]',
);
this.shadowUnhideIcon = page.locator(
'div[class*="shadow__actions"] svg[class="icon-hide"]',
);
this.shadowRemoveIcon = page.locator(
'div[class*="shadow__actions"] svg[class="icon-remove"]',
);
this.shadowShowIcon = page.getByRole('button', { name: 'Toggle shadow' });
this.shadowUnhideIcon = page.getByRole('button', { name: 'Toggle shadow' });
this.shadowRemoveIcon = page.getByRole('button', { name: 'Remove shadow' });
this.shadowTypeField = page.locator('div[class*="shadow-type-select"]');

//Design panel - Flex Layout section
Expand Down Expand Up @@ -203,28 +199,22 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {

//Design panel - Blur section
this.blurSection = page.getByText('Blur', { exact: true });
this.addBlurButton = page.getByTestId('add-blur');
this.addBlurButton = page.getByRole('button', { name: 'Add blur' });
this.blurMoreOptions = page.locator('button[class*="blur__show-more"]');
this.blurValueInput = page.locator('#blur-input-sidebar');
this.blurHideIcon = page.locator(
'div[class*="blur__actions"] svg[class="icon-shown"]',
);
this.blurUnhideIcon = page.locator(
'div[class*="blur__actions"] svg[class="icon-hide"]',
);
this.blurRemoveIcon = page.locator(
'div[class*="blur__actions"] svg[class="icon-remove"]',
);
this.blurHideIcon = page.getByRole('button', { name: 'Toggle blur' });
this.blurUnhideIcon = page.getByRole('button', { name: 'Toggle blur' });
this.blurRemoveIcon = page.getByRole('button', { name: 'Remove blur' });

//Design panel - Stroke section
this.addStrokeButton = page.getByTestId('add-stroke');
this.addStrokeButton = page.getByRole('button', { name: 'Add stroke color' });
this.strokeSection = page.getByText('Stroke', { exact: true });
this.strokeColorBullet = page.locator(
'div[class*="bullet-wrapper"] div[class*="color_bullet__is-not-library-color"]',
);
this.strokeRemoveIcon = page.locator(
'div[class*="stroke-data"] button[class*="remove-btn"]',
);
this.strokeRemoveIcon = page
.locator('div[class*="stroke__element-content"]')
.getByRole('button', { name: 'Remove color' });
this.strokeColorInput = page.locator(
'div[class*="stroke-data"] input[class*="color-input"]',
);
Expand All @@ -247,7 +237,9 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {
this.textUpperCaseIcon = page.locator('svg.icon-text-uppercase');
this.textLowerCaseIcon = page.locator('svg.icon-text-lowercase');
this.textTitleCaseIcon = page.locator('svg.icon-text-mixed');
this.textMoreOptionsIcon = page.locator('button[class*="text__more-options"]');
this.textMoreOptionsIcon = page
.locator('div[class*="text__element-content"]')
.getByRole('button', { name: 'Options' });
this.textVerticalOptionsBlock = page.locator(
'div[class*="vertical-align-options"]',
);
Expand All @@ -265,10 +257,8 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {

//Design panel - Export section
this.exportSection = page.getByText('Export', { exact: true });
this.addExportButton = page.locator('button[class*="exports__add-export"]');
this.removeExportButton = page.locator(
'button[class*="exports__action-btn"] svg[class="icon-remove"]',
);
this.addExportButton = page.getByRole('button', { name: 'Add export' });
this.removeExportButton = page.getByRole('button', { name: 'Remove export' });
this.exportElementButton = page.getByRole('button', {
name: /Export \d+ element/,
});
Expand Down
4 changes: 4 additions & 0 deletions pages/workspace/inspect-panel-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,4 +36,8 @@ exports.InspectPanelPage = class InspectPanelPage extends BasePage {
async openCodeTab() {
await this.codeTabButton.click();
}

async waitForCodeButtonVisible() {
await this.codeTabButton.waitFor({ state: 'visible', timeout: 10000 });
}
};
8 changes: 2 additions & 6 deletions pages/workspace/main-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -134,12 +134,8 @@ exports.MainPage = class MainPage extends BasePage {

//Zoom
this.zoomButton = page.getByTitle('Zoom', { exact: true });
this.zoomPlusButton = page.locator(
'button[class*="header__zoom-btn"] svg[class="icon-add"]',
);
this.zoomMinusButton = page.locator(
'button[class*="header__zoom-btn"] svg[class="icon-remove"]',
);
this.zoomPlusButton = page.getByRole('button', { name: 'Zoom in' });
this.zoomMinusButton = page.getByRole('button', { name: 'Zoom out' });
this.zoomResetButton = page.getByRole('button', { name: 'Reset' });
this.zoomToFitAllMenuItem = page
.getByRole('listitem')
Expand Down
6 changes: 4 additions & 2 deletions pages/workspace/prototype-panel-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,9 @@ exports.PrototypePanelPage = class PrototypePanelPage extends BasePage {
);
this.prototypePanelFlowNameText = page.locator('span[class*="flow-name-label"]');
this.prototypePanelFlowNameInput = page.locator('input[class*="interactions"]');
this.addInteractionButton = page.locator('button[class*="add-interaction-btn"]');
this.addInteractionButton = page.getByRole('button', {
name: 'Add interaction',
});
this.removeSecondInteractionButton = page.locator(
'button[class*="interactions__remove-btn"] >>nth=1',
);
Expand All @@ -27,7 +29,7 @@ exports.PrototypePanelPage = class PrototypePanelPage extends BasePage {
this.interactionDestinationField = page.locator(
'//*[text()="Destination"]//parent::div//div[contains(@class, "custom-select")]',
);
this.removeFlowButton = page.locator('button[class*="remove-flow-btn"]');
this.removeFlowButton = page.getByRole('button', { name: 'Remove flow' });
}

async clickPrototypeTab() {
Expand Down
2 changes: 1 addition & 1 deletion tests/ui-theme/ui-theme-features-light-mode.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ mainTest.describe('Settings - UI THEME', () => {
},
);
await inspectPanelPage.openInspectTab();
await mainPage.waitForChangeIsSaved();
await inspectPanelPage.waitForCodeButtonVisible();
await expect(mainPage.fileRightSidebarAside).toHaveScreenshot(
'inspect-file-right-sidebar-image.png',
{
Expand Down

0 comments on commit 74d342e

Please sign in to comment.