From c318a46772886fda61c9d048f109b5bf668a41e8 Mon Sep 17 00:00:00 2001 From: KateMaruk Date: Thu, 28 Dec 2023 10:34:49 +0200 Subject: [PATCH] update prettier settings --- .prettierrc | 3 +- pages/base-page.js | 4 +- pages/dashboard/dashboard-page.js | 24 +- pages/dashboard/team-page.js | 16 +- pages/profile-page.js | 16 +- pages/register-page.js | 4 +- pages/workspace/assets-panel-page.js | 8 +- pages/workspace/color-palette-page.js | 20 +- pages/workspace/comments-panel-page.js | 8 +- pages/workspace/design-panel-page.js | 60 ++--- pages/workspace/layers-panel-page.js | 4 +- pages/workspace/main-page.js | 28 +-- pages/workspace/prototype-panel-page.js | 12 +- tests/assets/assets-colors.spec.js | 12 +- tests/assets/assets-typographies.spec.js | 73 +++--- tests/color/color-picker.spec.js | 23 +- .../context-menu-options.spec.js | 80 +++---- .../create-main-components.spec.js | 20 +- .../delete-main-components.spec.js | 12 +- .../update-main-components.spec.js | 20 +- tests/composition/composition-board.spec.js | 108 ++++----- .../composition/composition-comments.spec.js | 4 +- tests/composition/composition-ellipse.spec.js | 213 ++++++++--------- .../composition-flex-layout.spec.js | 196 ++++++---------- tests/composition/composition-image.spec.js | 129 ++++------- .../composition-path-node-panel.spec.js | 81 +++---- tests/composition/composition-path.spec.js | 110 ++++----- .../composition/composition-rectangle.spec.js | 217 ++++++++---------- tests/composition/composition-text.spec.js | 84 +++---- tests/dashboard/dashboard-files.spec.js | 63 +++-- tests/dashboard/dashboard-teams.spec.js | 39 ++-- tests/login.spec.js | 4 +- .../panels-features-fill.spec.js | 24 +- .../panels-features-grid.spec.js | 175 +++++--------- .../panels-features-main-menu.spec.js | 202 +++++++--------- .../panels-features-prototype.spec.js | 45 ++-- 36 files changed, 800 insertions(+), 1341 deletions(-) diff --git a/.prettierrc b/.prettierrc index cf9f4b2..b0f46e6 100644 --- a/.prettierrc +++ b/.prettierrc @@ -2,5 +2,6 @@ "singleQuote": true, "trailingComma": "all", "tabWidth": 2, - "semi": true + "semi": true, + "printWidth": 85 } diff --git a/pages/base-page.js b/pages/base-page.js index 369a8fc..22178ab 100644 --- a/pages/base-page.js +++ b/pages/base-page.js @@ -15,9 +15,7 @@ exports.BasePage = class BasePage { this.viewport = page.locator('div.viewport'); //Layer right-click menu items - this.createdLayer = page.locator( - 'div[class="viewport"] [id^="shape"] >> nth=0', - ); + this.createdLayer = page.locator('div[class="viewport"] [id^="shape"] >> nth=0'); this.createdBoardTitle = page.locator('g[class="frame-title"] >> nth=0'); this.deleteLayerMenuItem = page.locator( 'ul[class*="workspace-context-menu"] li:has-text("Delete")', diff --git a/pages/dashboard/dashboard-page.js b/pages/dashboard/dashboard-page.js index 19c02c4..01ac281 100644 --- a/pages/dashboard/dashboard-page.js +++ b/pages/dashboard/dashboard-page.js @@ -38,9 +38,7 @@ exports.DashboardPage = class DashboardPage extends BasePage { this.delFileAsSharedLibraryMenuItem = page.locator( 'a[data-test="file-del-shared"]', ); - this.delFileAsSharedLibraryButton = page.locator( - 'input[value="Unpublish"]', - ); + this.delFileAsSharedLibraryButton = page.locator('input[value="Unpublish"]'); this.downloadFilePenpotMenuItem = page.locator( 'a[data-test="download-binary-file"]', ); @@ -58,23 +56,17 @@ exports.DashboardPage = class DashboardPage extends BasePage { ); //Projects - this.addProjectButton = page.locator( - 'button[data-test="new-project-button"]', - ); + this.addProjectButton = page.locator('button[data-test="new-project-button"]'); this.projectNameInput = page.locator( 'div[class*="project-name-wrapper"] div[class*="edit-wrapper"]', ); - this.projectNameTitle = page.locator( - 'div[class*="project-name-wrapper"] h2', - ); + this.projectNameTitle = page.locator('div[class*="project-name-wrapper"] h2'); this.deleteProjectMenuItem = page.locator('a[data-test="project-delete"]'); this.deleteProjectButton = page.locator( 'input[value="Delete files"],input[value="Delete project"]', ); this.renameProjectMenuItem = page.locator('a[data-test="project-rename"]'); - this.duplicateProjectMenuItem = page.locator( - 'a[data-test="project-duplicate"]', - ); + this.duplicateProjectMenuItem = page.locator('a[data-test="project-duplicate"]'); this.pinUnpinProjectButton = page.locator('button[alt="Pin/Unpin"] svg'); this.projectOptionsMenuButton = page.locator( 'button[data-test="project-options"]', @@ -122,17 +114,13 @@ exports.DashboardPage = class DashboardPage extends BasePage { this.fontsTablePlaceholder = page.locator( 'div[class*="fonts-placeholder"] div[class*="label"]', ); - this.fontNameInput = page.locator( - 'div[class*="table-row"] input[type="text"]', - ); + this.fontNameInput = page.locator('div[class*="table-row"] input[type="text"]'); this.saveFontButton = page.locator('button:text-is("Save")'); this.searchFontInput = page.locator('input[placeholder="Search font"]'); this.fontFormatError = page.locator('div[class="banner error fixed"]'); //Libraries & Templates - this.noLibrariesPlacelder = page.locator( - 'div[data-test="empty-placeholder"] p', - ); + this.noLibrariesPlacelder = page.locator('div[data-test="empty-placeholder"] p'); } async createFileViaPlaceholder() { diff --git a/pages/dashboard/team-page.js b/pages/dashboard/team-page.js index 9fb0886..486fbfe 100644 --- a/pages/dashboard/team-page.js +++ b/pages/dashboard/team-page.js @@ -20,9 +20,7 @@ exports.TeamPage = class TeamPage extends BasePage { 'button[class*="current-team"] div[class*="team-name"]', ); this.teamNameLabel = page.locator('div[class*="team__name"]'); - this.teamOptionsMenuButton = page.locator( - 'button[class*="switch-options"]', - ); + this.teamOptionsMenuButton = page.locator('button[class*="switch-options"]'); this.deleteTeamMenuItem = page.locator('#teams-options-delete-team'); this.deleteTeamButton = page.locator('input[value="Delete team"]'); this.teamSettingsMenuItem = page.locator('li[data-test="team-settings"]'); @@ -47,9 +45,7 @@ exports.TeamPage = class TeamPage extends BasePage { //Invitations this.invitationsMenuItem = page.locator('li[data-test="team-invitations"]'); - this.inviteMembersToTeamButton = page.locator( - 'a[data-test="invite-member"]', - ); + this.inviteMembersToTeamButton = page.locator('a[data-test="invite-member"]'); this.inviteMembersPopUpHeader = page.locator( 'div[class*="modal-team-container"] div[class*="title"]', ); @@ -64,9 +60,7 @@ exports.TeamPage = class TeamPage extends BasePage { this.inviteMembersToTeamEmailInput = page.locator( 'input[placeholder="Emails, comma separated"]', ); - this.sendInvitationButton = page.locator( - 'button:has-text("Send invitation")', - ); + this.sendInvitationButton = page.locator('button:has-text("Send invitation")'); this.invitationRecord = page.locator( 'div[class*="table-rows"] div[class*="table-row"]', ); @@ -76,9 +70,7 @@ exports.TeamPage = class TeamPage extends BasePage { this.invitationRecordRoleCell = page.locator( 'div[class*="dashboard_team__roles"]', ); - this.invitationRecordRoleSelector = page.locator( - 'div[class*="team__has-priv"]', - ); + this.invitationRecordRoleSelector = page.locator('div[class*="team__has-priv"]'); this.invitationRecordStatusCell = page.locator( 'div[class*="dashboard_team__status"] div', ); diff --git a/pages/profile-page.js b/pages/profile-page.js index 3b3c130..62351df 100644 --- a/pages/profile-page.js +++ b/pages/profile-page.js @@ -10,22 +10,16 @@ exports.ProfilePage = class ProfilePage extends BasePage { //Account this.profileMenuButton = page.locator('div[data-test="profile-btn"]'); - this.yourAccountMenuItem = page.locator( - 'li[data-test="profile-profile-opt"]', - ); + this.yourAccountMenuItem = page.locator('li[data-test="profile-profile-opt"]'); this.logoutMenuItem = page.locator('li[data-test="logout-profile-opt"]'); - this.giveFeedbackMenuItem = page.locator( - 'li[data-test="feedback-profile-opt"]', - ); + this.giveFeedbackMenuItem = page.locator('li[data-test="feedback-profile-opt"]'); this.backToDashboardBtn = page.locator('div[class*="back-to-dashboard"]'); //Profile this.profileNameInput = page.locator('#fullname'); this.profileEmailInput = page.locator('#email'); this.saveSettingsButton = page.locator('button:has-text("Save settings")'); - this.profileImageInput = page.locator( - 'input[data-test="profile-image-input"]', - ); + this.profileImageInput = page.locator('input[data-test="profile-image-input"]'); this.profileAvatarBlock = page.locator( 'div.main_ui_settings_profile__form-container', ); @@ -43,9 +37,7 @@ exports.ProfilePage = class ProfilePage extends BasePage { this.passwordOldInput = page.locator('#password-old'); this.passwordNewInput = page.locator('input[label="New password"]'); this.passwordConfirmInput = page.locator('input[label="Confirm password"]'); - this.updateSettingsBtn = page.locator( - 'button[data-test="submit-password"]', - ); + this.updateSettingsBtn = page.locator('button[data-test="submit-password"]'); this.passwordInputError = page.locator('div[data-test="-error"]'); } diff --git a/pages/register-page.js b/pages/register-page.js index c643a68..1391bfe 100644 --- a/pages/register-page.js +++ b/pages/register-page.js @@ -11,9 +11,7 @@ exports.RegisterPage = class RegisterPage extends BasePage { this.pageTitle = page.locator('h1[data-test="registration-title"]'); this.emailInput = page.locator('#email'); this.passwordInput = page.locator('#password'); - this.createAccountBtn = page.locator( - 'button[data-test="register-form-submit"]', - ); + this.createAccountBtn = page.locator('button[data-test="register-form-submit"]'); this.emailInputError = page.locator('div[data-test="email-input-error"]'); this.passwordInputHint = page.locator('div.main_ui_components_forms__hint'); this.passwordInputError = page.locator('div[data-test="-error"]'); diff --git a/pages/workspace/assets-panel-page.js b/pages/workspace/assets-panel-page.js index d7f5614..67516d9 100644 --- a/pages/workspace/assets-panel-page.js +++ b/pages/workspace/assets-panel-page.js @@ -63,13 +63,9 @@ exports.AssetsPanelPage = class AssetsPanelPage extends BasePage { 'div[class*="typography-entry"]', ); this.fontSelector = page.locator('div[class*="typography__font-option"]'); - this.fontSelectorSearchInput = page.locator( - 'input[placeholder="Search font"]', - ); + this.fontSelectorSearchInput = page.locator('input[placeholder="Search font"]'); this.fontSizeInput = page.locator('div[class*="font-size-select"] input'); - this.typographyNameInput = page.locator( - 'input[class*="adv-typography-name"]', - ); + this.typographyNameInput = page.locator('input[class*="adv-typography-name"]'); this.assetsTitleText = page.locator( 'div[class*="asset-section"] span[class*="title-name"]', ); diff --git a/pages/workspace/color-palette-page.js b/pages/workspace/color-palette-page.js index 3eddda2..8ef138e 100644 --- a/pages/workspace/color-palette-page.js +++ b/pages/workspace/color-palette-page.js @@ -9,25 +9,15 @@ exports.ColorPalettePage = class ColorPalettePage extends BasePage { super(page); this.popUp = page.locator('div[class*="colorpicker-tooltip"]'); this.hexInput = page.locator('#hex-value'); - this.saveColorStyleButton = page.locator( - 'button:has-text("Save color style")', - ); + this.saveColorStyleButton = page.locator('button:has-text("Save color style")'); this.colorsLibrariesSelect = page.locator( 'div[class*="colorpicker_libraries__select-wrapper"]', ); - this.colorsFileLibraryOptions = page.locator( - 'span:has-text("File library")', - ); - this.colorPaletteActionsBtn = page.locator( - 'button[class*="palette-actions"]', - ); + this.colorsFileLibraryOptions = page.locator('span:has-text("File library")'); + this.colorPaletteActionsBtn = page.locator('button[class*="palette-actions"]'); this.colorPaletteMenu = page.locator('ul[class*="palette-menu"]'); - this.colorPaletteFileLibraryOpt = page.locator( - 'li:has-text("File library")', - ); - this.colorPaletteRecentColorsOpt = page.locator( - 'li:has-text("Recent colors")', - ); + this.colorPaletteFileLibraryOpt = page.locator('li:has-text("File library")'); + this.colorPaletteRecentColorsOpt = page.locator('li:has-text("Recent colors")'); } async setHex(value) { diff --git a/pages/workspace/comments-panel-page.js b/pages/workspace/comments-panel-page.js index f7eff71..55263d7 100644 --- a/pages/workspace/comments-panel-page.js +++ b/pages/workspace/comments-panel-page.js @@ -9,9 +9,7 @@ exports.CommentsPanelPage = class CommentsPanelPage extends BasePage { super(page); this.commentsButton = page.locator('button[title="Comments (C)"]'); - this.commentInput = page.locator( - 'textarea[placeholder="Write new comment"]', - ); + this.commentInput = page.locator('textarea[placeholder="Write new comment"]'); this.commentEditInput = page.locator( 'div[class*="comments__edit-form"] textarea', ); @@ -44,9 +42,7 @@ exports.CommentsPanelPage = class CommentsPanelPage extends BasePage { this.commentDeleteOptionMenuItem = page.locator( 'ul[class*="comment-options-dropdown"] li:has-text("Delete thread")', ); - this.deleteThreadButton = page.locator( - 'input[value="Delete conversation"]', - ); + this.deleteThreadButton = page.locator('input[value="Delete conversation"]'); this.resolveCommentCheckbox = page.locator( 'div[class*="comments__options-resolve-wrapper"] span', ); diff --git a/pages/workspace/design-panel-page.js b/pages/workspace/design-panel-page.js index 454459c..01e96cd 100644 --- a/pages/workspace/design-panel-page.js +++ b/pages/workspace/design-panel-page.js @@ -18,9 +18,7 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { ); this.generalCornerRadiusInput = page.locator('div[title="Radius"] input'); this.topLeftCornerRadiusInput = page.locator('div[title="Top left"] input'); - this.topRightCornerRadiusInput = page.locator( - 'div[title="Top right"] input', - ); + this.topRightCornerRadiusInput = page.locator('div[title="Top right"] input'); this.bottomLeftCornerRadiusInput = page.locator( 'div[title="Bottom left"] input', ); @@ -55,9 +53,7 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { 'div[class*="shadow__element-title"]:has-text("Shadow")', ); this.addShadowButton = page.locator('button[class*="shadow__add-shadow"]'); - this.shadowActionsButton = page.locator( - 'button[class*="shadow__more-options"]', - ); + this.shadowActionsButton = page.locator('button[class*="shadow__more-options"]'); this.shadowXInput = page.locator( 'div[class*="shadow-advanced-options"] div[title="X"] input', ); @@ -95,9 +91,7 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { this.flexElementAlignCenterBtn = page.locator( 'label[title="Align self center"] span', ); - this.flexElementAlignEndBtn = page.locator( - 'label[title="Align self end"] span', - ); + this.flexElementAlignEndBtn = page.locator('label[title="Align self end"] span'); this.flexElementMarginVertInput = page.locator( 'div[title="Vertical margin"] input', ); @@ -111,22 +105,16 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { 'div[class*="layout_container__element-title"] button[class*="remove-layout"]', ); this.layoutDirectRowBtn = page.locator('label[title="Row"] span'); - this.layoutDirectRowReverseBtn = page.locator( - 'label[title="Row reverse"] span', - ); + this.layoutDirectRowReverseBtn = page.locator('label[title="Row reverse"] span'); this.layoutDirectColumnBtn = page.locator('label[title="Column"] span'); this.layoutDirectColumnReverseBtn = page.locator( 'label[title="Column reverse"] span', ); - this.layoutAlignStartBtn = page.locator( - 'label[title="Align items start"] span', - ); + this.layoutAlignStartBtn = page.locator('label[title="Align items start"] span'); this.layoutAlignCenterBtn = page.locator( 'label[title="Align items center"] span', ); - this.layoutAlignEndBtn = page.locator( - 'label[title="Align items end"] span', - ); + this.layoutAlignEndBtn = page.locator('label[title="Align items end"] span'); this.layoutJustifyStartBtn = page.locator( 'label[title="Justify content start"] span', ); @@ -153,19 +141,13 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { this.layoutHorizontPaddingInput = page.locator( 'div[title="Horizontal padding"] input', ); - this.layoutIndepPaddingsIcon = page.locator( - 'button[class*="padding-toggle"]', - ); + this.layoutIndepPaddingsIcon = page.locator('button[class*="padding-toggle"]'); this.layoutPaddingTopInput = page.locator('div[title="Top padding"] input'); - this.layoutPaddingRightInput = page.locator( - 'div[title="Right padding"] input', - ); + this.layoutPaddingRightInput = page.locator('div[title="Right padding"] input'); this.layoutPaddingBottomInput = page.locator( 'div[title="Bottom padding"] input', ); - this.layoutPaddingLeftInput = page.locator( - 'div[title="Left padding"] input', - ); + this.layoutPaddingLeftInput = page.locator('div[title="Left padding"] input'); //Design panel - Blur section this.blurSection = page.locator( @@ -204,18 +186,14 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { this.strokeOpacityInput = page.locator( 'div[class*="stroke-data"] input[class*="opacity-input"]', ); - this.strokeAlignmentField = page.locator( - 'div[data-test="stroke.alignment"]', - ); + this.strokeAlignmentField = page.locator('div[data-test="stroke.alignment"]'); this.strokeTypeField = page.locator('div[data-test="stroke.style"]'); //Design panel - Text section this.textUpperCaseIcon = page.locator('svg.icon-text-uppercase-refactor'); this.textLowerCaseIcon = page.locator('svg.icon-text-lowercase-refactor'); this.textTitleCaseIcon = page.locator('svg.icon-text-mixed-refactor'); - this.textMoreOptionsIcon = page.locator( - 'button[class*="text__more-options"]', - ); + this.textMoreOptionsIcon = page.locator('button[class*="text__more-options"]'); this.textVerticalOptionsBlock = page.locator( 'div[class*="vertical-align-options"]', ); @@ -233,14 +211,10 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { this.removeExportButton = page.locator( 'button[class*="exports__action-btn"] svg[class="icon-remove-refactor"]', ); - this.exportElementButton = page.locator( - 'button[class*="exports__export-btn"]', - ); + this.exportElementButton = page.locator('button[class*="exports__export-btn"]'); //Design panel - Grid section - this.gridSection = page.locator( - 'div[class*=element-set]:has-text("Guides")', - ); + this.gridSection = page.locator('div[class*=element-set]:has-text("Guides")'); this.addGridButton = page.locator('button[class*="grid__add-grid"]'); this.removeGridButton = page.locator( 'div[class*="grid__actions"] svg[class="icon-remove-refactor"]', @@ -255,17 +229,13 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage { 'div[class*="grid__option-row"] div[class*="type-select-wrapper"]', ); this.gridTypeSelectorSquareOption = page.locator('span:has-text("Square")'); - this.gridTypeSelectorColumnsOption = page.locator( - 'span:has-text("Columns")', - ); + this.gridTypeSelectorColumnsOption = page.locator('span:has-text("Columns")'); this.gridTypeSelectorRowsOption = page.locator('span:has-text("Rows")'); this.gridSizeInput = page.locator('div[title="Size"] input'); this.gridColumnsRowsInput = page.locator( 'div[class*="grid__column-select"] input', ); - this.gridActionsButton = page.locator( - 'button[class*="grid__show-options"]', - ); + this.gridActionsButton = page.locator('button[class*="grid__show-options"]'); this.gridOpacityInput = page.locator( 'div[class*="grid__advanced-row"] input[class*="opacity-input"]', ); diff --git a/pages/workspace/layers-panel-page.js b/pages/workspace/layers-panel-page.js index 974e03f..4c0cbbf 100644 --- a/pages/workspace/layers-panel-page.js +++ b/pages/workspace/layers-panel-page.js @@ -127,9 +127,7 @@ exports.LayersPanelPage = class LayersPanelPage extends BasePage { .locator(commonSel.concat('//button[@title="Hide"]')) .click({ force: true }); } else { - await this.page - .locator(commonSel.concat('//button[@title="Show"]')) - .click(); + await this.page.locator(commonSel.concat('//button[@title="Show"]')).click(); } } diff --git a/pages/workspace/main-page.js b/pages/workspace/main-page.js index dd91a1a..216743b 100644 --- a/pages/workspace/main-page.js +++ b/pages/workspace/main-page.js @@ -25,15 +25,11 @@ exports.MainPage = class MainPage extends BasePage { this.designTab = page.locator('div[data-id="design"]'); //Viewport - this.textbox = page.locator( - 'div[role="textbox"] div[contenteditable="true"]', - ); + this.textbox = page.locator('div[role="textbox"] div[contenteditable="true"]'); this.guides = page.locator('.guides .new-guides'); //Node panel - this.pathActionsBlock = page.locator( - 'div[class$="path_actions__sub-actions"]', - ); + this.pathActionsBlock = page.locator('div[class$="path_actions__sub-actions"]'); this.firstNode = page.locator( 'g[class="path-point"] circle[pointer-events="visible"] >> nth=0', ); @@ -53,12 +49,8 @@ exports.MainPage = class MainPage extends BasePage { 'g[class="path-point"] circle[pointer-events="visible"] >> nth=6', ); this.nodePanelAddNodeButton = page.locator('button[title^="Add node"]'); - this.nodePanelDeleteNodeButton = page.locator( - 'button[title^="Delete node"]', - ); - this.nodePanelMergeNodesButton = page.locator( - 'button[title^="Merge nodes"]', - ); + this.nodePanelDeleteNodeButton = page.locator('button[title^="Delete node"]'); + this.nodePanelMergeNodesButton = page.locator('button[title^="Merge nodes"]'); this.nodePanelDrawNodesButton = page.locator('button[title^="Draw nodes"]'); this.nodePanelMoveNodesButton = page.locator('button[title^="Move nodes"]'); this.nodePanelJoinNodesButton = page.locator('button[title^="Join nodes"]'); @@ -112,12 +104,8 @@ exports.MainPage = class MainPage extends BasePage { 'li[data-test="hide-ui"] span:text-is("Show / Hide UI")', ); this.dowloadPenpotFileMenuSubItem = page.locator('#file-menu-binary-file'); - this.dowloadStandartFileMenuSubItem = page.locator( - '#file-menu-standard-file', - ); - this.addAsSharedLibraryFileMenuSubItem = page.locator( - '#file-menu-add-shared', - ); + this.dowloadStandartFileMenuSubItem = page.locator('#file-menu-standard-file'); + this.addAsSharedLibraryFileMenuSubItem = page.locator('#file-menu-add-shared'); this.removeAsSharedLibraryFileMenuSubItem = page.locator( '#file-menu-remove-shared', ); @@ -139,9 +127,7 @@ exports.MainPage = class MainPage extends BasePage { //Pages this.addPageButton = page.locator('button[class*="add-page"]'); - this.pagesBlock = page.locator( - 'div.main_ui_workspace_sidebar_sitemap__sitemap', - ); + this.pagesBlock = page.locator('div.main_ui_workspace_sidebar_sitemap__sitemap'); this.firstPageListItem = page.locator( 'ul[class*="pages-list"] div[class*="element-list-body"] >>nth=0', ); diff --git a/pages/workspace/prototype-panel-page.js b/pages/workspace/prototype-panel-page.js index f09cccd..6728ee7 100644 --- a/pages/workspace/prototype-panel-page.js +++ b/pages/workspace/prototype-panel-page.js @@ -16,15 +16,9 @@ exports.PrototypePanelPage = class PrototypePanelPage extends BasePage { this.prototypeArrowSecondConnector = page.locator( 'g[class="interactions"] path[fill="var(--color-primary)"] >>nth=1', ); - 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.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.removeSecondInteractionButton = page.locator( 'button[class*="interactions__remove-btn"] >>nth=1', ); diff --git a/tests/assets/assets-colors.spec.js b/tests/assets/assets-colors.spec.js index a5673b6..a672786 100644 --- a/tests/assets/assets-colors.spec.js +++ b/tests/assets/assets-colors.spec.js @@ -1,9 +1,7 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); const { expect, test } = require('@playwright/test'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); @@ -100,9 +98,7 @@ test.describe(() => { await assetsPanelPage.createGroupFileLibraryAssets('Colors', 'Test Group'); await mainPage.waitForChangeIsSaved(); await assetsPanelPage.isFileLibraryGroupCreated('Test Group'); - await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( - 'group-colors.png', - ); + await expect(assetsPanelPage.assetsPanel).toHaveScreenshot('group-colors.png'); }); mainTest('AS-29 File library colors - rename group', async ({ page }) => { @@ -139,9 +135,7 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await assetsPanelPage.clickFileLibraryColorsColorBullet(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'apply-color-to-board.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('apply-color-to-board.png'); }); mainTest('AS-117 File library colors - apply to stroke', async ({ page }) => { diff --git a/tests/assets/assets-typographies.spec.js b/tests/assets/assets-typographies.spec.js index ec03290..e3d0685 100644 --- a/tests/assets/assets-typographies.spec.js +++ b/tests/assets/assets-typographies.spec.js @@ -25,39 +25,33 @@ test.afterEach(async ({ page }) => { await teamPage.deleteTeam(teamName); }); -mainTest( - 'AS-37 Filter Typographies from All Assets drop-down', - async ({ page }) => { - const assetsPanelPage = new AssetsPanelPage(page); - await assetsPanelPage.clickAssetsTab(); - await assetsPanelPage.selectTypeFromAllAssetsDropdown('Typographies'); - await assetsPanelPage.isAssetsSectionNameDisplayed('Typographies', '0'); - }, -); +mainTest('AS-37 Filter Typographies from All Assets drop-down', async ({ page }) => { + const assetsPanelPage = new AssetsPanelPage(page); + await assetsPanelPage.clickAssetsTab(); + await assetsPanelPage.selectTypeFromAllAssetsDropdown('Typographies'); + await assetsPanelPage.isAssetsSectionNameDisplayed('Typographies', '0'); +}); -mainTest( - 'AS-38 Typographic styles - add from Assets panel', - async ({ page }) => { - const mainPage = new MainPage(page); - const assetsPanelPage = new AssetsPanelPage(page); - await assetsPanelPage.clickAssetsTab(); - await assetsPanelPage.clickAddFileLibraryTypographyButton(); - await mainPage.waitForChangeIsSaved(); - await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( - 'typographies-add-typography-expanded.png', - ); - await assetsPanelPage.minimizeFileLibraryTypography(); - await mainPage.clickViewportTwice(); - await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( - 'typographies-add-typography-minimized.png', - ); - await assetsPanelPage.expandFileLibraryTypography(); - await mainPage.clickViewportTwice(); - await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( - 'typographies-add-typography-expanded.png', - ); - }, -); +mainTest('AS-38 Typographic styles - add from Assets panel', async ({ page }) => { + const mainPage = new MainPage(page); + const assetsPanelPage = new AssetsPanelPage(page); + await assetsPanelPage.clickAssetsTab(); + await assetsPanelPage.clickAddFileLibraryTypographyButton(); + await mainPage.waitForChangeIsSaved(); + await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( + 'typographies-add-typography-expanded.png', + ); + await assetsPanelPage.minimizeFileLibraryTypography(); + await mainPage.clickViewportTwice(); + await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( + 'typographies-add-typography-minimized.png', + ); + await assetsPanelPage.expandFileLibraryTypography(); + await mainPage.clickViewportTwice(); + await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( + 'typographies-add-typography-expanded.png', + ); +}); test.describe(() => { test.beforeEach(async ({ page }) => { @@ -121,10 +115,7 @@ test.describe(() => { mainTest('AS-43 Typographic styles - create group', async ({ page }) => { const mainPage = new MainPage(page); const assetsPanelPage = new AssetsPanelPage(page); - await assetsPanelPage.createGroupFileLibraryAssets( - 'Typographies', - 'Test Group', - ); + await assetsPanelPage.createGroupFileLibraryAssets('Typographies', 'Test Group'); await mainPage.waitForChangeIsSaved(); await assetsPanelPage.isFileLibraryGroupCreated('Test Group'); await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( @@ -135,10 +126,7 @@ test.describe(() => { mainTest('AS-45 Typographic styles - rename group', async ({ page }) => { const mainPage = new MainPage(page); const assetsPanelPage = new AssetsPanelPage(page); - await assetsPanelPage.createGroupFileLibraryAssets( - 'Typographies', - 'Test Group', - ); + await assetsPanelPage.createGroupFileLibraryAssets('Typographies', 'Test Group'); await mainPage.waitForChangeIsSaved(); await assetsPanelPage.renameGroupFileLibrary('New Group'); await mainPage.waitForChangeIsSaved(); @@ -151,10 +139,7 @@ test.describe(() => { mainTest('AS-48 Typographic styles - ungroup', async ({ page }) => { const mainPage = new MainPage(page); const assetsPanelPage = new AssetsPanelPage(page); - await assetsPanelPage.createGroupFileLibraryAssets( - 'Typographies', - 'Test Group', - ); + await assetsPanelPage.createGroupFileLibraryAssets('Typographies', 'Test Group'); await mainPage.waitForChangeIsSaved(); await assetsPanelPage.ungroupFileLibrary(); await mainPage.waitForChangeIsSaved(); diff --git a/tests/color/color-picker.spec.js b/tests/color/color-picker.spec.js index 202e5c8..8812f22 100644 --- a/tests/color/color-picker.spec.js +++ b/tests/color/color-picker.spec.js @@ -1,8 +1,6 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { expect, test } = require('@playwright/test'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); @@ -49,15 +47,12 @@ mainTest('CP-2 Open color picker from Fill menu', async ({ page }) => { await colorPalettePage.isColorPalettePopUpOpened(); }); -mainTest( - 'CP-3 Open color picker from Canvas background menu', - async ({ page }) => { - const designPanelPage = new DesignPanelPage(page); - const colorPalettePage = new ColorPalettePage(page); - await designPanelPage.clickCanvasBackgroundColorIcon(); - await colorPalettePage.isColorPalettePopUpOpened(); - }, -); +mainTest('CP-3 Open color picker from Canvas background menu', async ({ page }) => { + const designPanelPage = new DesignPanelPage(page); + const colorPalettePage = new ColorPalettePage(page); + await designPanelPage.clickCanvasBackgroundColorIcon(); + await colorPalettePage.isColorPalettePopUpOpened(); +}); mainTest('CP-7 Use Recent colors', async ({ page }) => { const color1 = '#FF0000'; @@ -80,9 +75,7 @@ mainTest('CP-7 Use Recent colors', async ({ page }) => { await colorPalettePage.clickColorBullet(false, 1); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'board-recent-color.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('board-recent-color.png'); }); mainTest('CP-8 Use colors from File library', async ({ page }) => { diff --git a/tests/components/main-components/context-menu-options.spec.js b/tests/components/main-components/context-menu-options.spec.js index 6ed9b9a..5ed0fae 100644 --- a/tests/components/main-components/context-menu-options.spec.js +++ b/tests/components/main-components/context-menu-options.spec.js @@ -4,18 +4,10 @@ const { expect, test } = require('@playwright/test'); const { DashboardPage } = require('../../../pages/dashboard/dashboard-page'); const { TeamPage } = require('../../../pages/dashboard/team-page'); const { random } = require('../../../helpers/string-generator'); -const { - LayersPanelPage, -} = require('../../../pages/workspace/layers-panel-page'); -const { - DesignPanelPage, -} = require('../../../pages/workspace/design-panel-page'); -const { - AssetsPanelPage, -} = require('../../../pages/workspace/assets-panel-page'); -const { - InspectPanelPage, -} = require('../../../pages/workspace/inspect-panel-page'); +const { LayersPanelPage } = require('../../../pages/workspace/layers-panel-page'); +const { DesignPanelPage } = require('../../../pages/workspace/design-panel-page'); +const { AssetsPanelPage } = require('../../../pages/workspace/assets-panel-page'); +const { InspectPanelPage } = require('../../../pages/workspace/inspect-panel-page'); const teamName = random().concat('autotest'); const annotation = 'Test annotation for automation'; @@ -61,12 +53,9 @@ test.describe(() => { async ({ page }) => { const mainPage = new MainPage(page); await mainPage.showInAssetsPanelRightClick(); - await expect(page).toHaveScreenshot( - 'component-show-in-assets-panel.png', - { - mask: [mainPage.guides, mainPage.usersSection, mainPage.zoomButton], - }, - ); + await expect(page).toHaveScreenshot('component-show-in-assets-panel.png', { + mask: [mainPage.guides, mainPage.usersSection, mainPage.zoomButton], + }); }, ); @@ -208,10 +197,7 @@ test.describe(() => { const assetsPanelPage = new AssetsPanelPage(page); await assetsPanelPage.clickAssetsTab(); await assetsPanelPage.expandComponentsBlockOnAssetsTab(); - await assetsPanelPage.createGroupFileLibraryAssets( - 'Components', - 'Test Group', - ); + await assetsPanelPage.createGroupFileLibraryAssets('Components', 'Test Group'); await mainPage.waitForChangeIsSaved(); await assetsPanelPage.renameGroupFileLibrary('New Group'); await mainPage.waitForChangeIsSaved(); @@ -226,10 +212,7 @@ test.describe(() => { const assetsPanelPage = new AssetsPanelPage(page); await assetsPanelPage.clickAssetsTab(); await assetsPanelPage.expandComponentsBlockOnAssetsTab(); - await assetsPanelPage.createGroupFileLibraryAssets( - 'Components', - 'Test Group', - ); + await assetsPanelPage.createGroupFileLibraryAssets('Components', 'Test Group'); await mainPage.waitForChangeIsSaved(); await assetsPanelPage.ungroupFileLibrary(); await mainPage.waitForChangeIsSaved(); @@ -297,29 +280,24 @@ mainTest( }, ); -mainTest( - 'Create a group with component and check its name', - async ({ page }) => { - const groupName = 'Test Group'; - const mainPage = new MainPage(page); - const layersPanelPage = new LayersPanelPage(page); - const assetsPanelPage = new AssetsPanelPage(page); - await mainPage.createDefaultBoardByCoordinates(200, 300); - await mainPage.createComponentViaRightClick(); - await mainPage.waitForChangeIsSaved(); - await assetsPanelPage.clickAssetsTab(); - await assetsPanelPage.expandComponentsBlockOnAssetsTab(); - await assetsPanelPage.createGroupFileLibraryAssets('Components', groupName); - await assetsPanelPage.isFileLibraryGroupCreated(groupName); - await layersPanelPage.openLayersTab(); - await expect(layersPanelPage.layersSidebar).toHaveScreenshot( - 'component-group-layer.png', - ); - await expect(mainPage.viewport).toHaveScreenshot( - 'component-group-canvas.png', - ); - }, -); +mainTest('Create a group with component and check its name', async ({ page }) => { + const groupName = 'Test Group'; + const mainPage = new MainPage(page); + const layersPanelPage = new LayersPanelPage(page); + const assetsPanelPage = new AssetsPanelPage(page); + await mainPage.createDefaultBoardByCoordinates(200, 300); + await mainPage.createComponentViaRightClick(); + await mainPage.waitForChangeIsSaved(); + await assetsPanelPage.clickAssetsTab(); + await assetsPanelPage.expandComponentsBlockOnAssetsTab(); + await assetsPanelPage.createGroupFileLibraryAssets('Components', groupName); + await assetsPanelPage.isFileLibraryGroupCreated(groupName); + await layersPanelPage.openLayersTab(); + await expect(layersPanelPage.layersSidebar).toHaveScreenshot( + 'component-group-layer.png', + ); + await expect(mainPage.viewport).toHaveScreenshot('component-group-canvas.png'); +}); mainTest('Rename component with valid name', async ({ page }) => { const newName = 'Renamed ellipse name'; @@ -334,9 +312,7 @@ mainTest('Rename component with valid name', async ({ page }) => { await assetsPanelPage.renameFileLibraryComponent(newName); await mainPage.waitForChangeIsSaved(); await layersPanelPage.openLayersTab(); - await expect(mainPage.viewport).toHaveScreenshot( - 'component-new-name-canvas.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('component-new-name-canvas.png'); await expect(layersPanelPage.layersSidebar).toHaveScreenshot( 'component-new-name-layer.png', ); diff --git a/tests/components/main-components/create-main-components.spec.js b/tests/components/main-components/create-main-components.spec.js index 3dae2f4..7fbdddb 100644 --- a/tests/components/main-components/create-main-components.spec.js +++ b/tests/components/main-components/create-main-components.spec.js @@ -4,15 +4,9 @@ const { expect, test } = require('@playwright/test'); const { DashboardPage } = require('../../../pages/dashboard/dashboard-page'); const { TeamPage } = require('../../../pages/dashboard/team-page'); const { random } = require('../../../helpers/string-generator'); -const { - LayersPanelPage, -} = require('../../../pages/workspace/layers-panel-page'); -const { - AssetsPanelPage, -} = require('../../../pages/workspace/assets-panel-page'); -const { - DesignPanelPage, -} = require('../../../pages/workspace/design-panel-page'); +const { LayersPanelPage } = require('../../../pages/workspace/layers-panel-page'); +const { AssetsPanelPage } = require('../../../pages/workspace/assets-panel-page'); +const { DesignPanelPage } = require('../../../pages/workspace/design-panel-page'); const teamName = random().concat('autotest'); @@ -199,9 +193,7 @@ mainTest('Create component from path by right-click', async ({ page }) => { await mainPage.createDefaultClosedPath(); await mainPage.createComponentViaRightClick(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-main-component-canvas.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-main-component-canvas.png'); await expect(layersPanelPage.layersSidebar).toHaveScreenshot( 'path-main-component-layer.png', ); @@ -242,9 +234,7 @@ mainTest('Undo component', async ({ page, browserName }) => { await mainPage.waitForChangeIsSaved(); await mainPage.clickOnLayerOnCanvas(); await designPanelPage.changeRotationForLayer('200'); - await expect(mainPage.viewport).toHaveScreenshot( - 'component-change_rotation.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('component-change_rotation.png'); await mainPage.clickShortcutCtrlZ(browserName); await expect(mainPage.viewport).toHaveScreenshot( 'component-change_rotation_undo.png', diff --git a/tests/components/main-components/delete-main-components.spec.js b/tests/components/main-components/delete-main-components.spec.js index ac2aa04..a3866f4 100644 --- a/tests/components/main-components/delete-main-components.spec.js +++ b/tests/components/main-components/delete-main-components.spec.js @@ -4,12 +4,8 @@ const { expect, test } = require('@playwright/test'); const { random } = require('../../../helpers/string-generator'); const { DashboardPage } = require('../../../pages/dashboard/dashboard-page'); const { TeamPage } = require('../../../pages/dashboard/team-page'); -const { - LayersPanelPage, -} = require('../../../pages/workspace/layers-panel-page'); -const { - AssetsPanelPage, -} = require('../../../pages/workspace/assets-panel-page'); +const { LayersPanelPage } = require('../../../pages/workspace/layers-panel-page'); +const { AssetsPanelPage } = require('../../../pages/workspace/assets-panel-page'); const teamName = random().concat('autotest'); @@ -35,9 +31,7 @@ mainTest('Undo deleted component', async ({ page, browserName }) => { await mainPage.createComponentViaRightClick(); await mainPage.waitForChangeIsSaved(); await mainPage.deleteLayerViaRightClick(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-component-delete.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-component-delete.png'); await mainPage.clickShortcutCtrlZ(browserName); await expect(mainPage.viewport).toHaveScreenshot( 'rectangle-component-delete-undo.png', diff --git a/tests/components/main-components/update-main-components.spec.js b/tests/components/main-components/update-main-components.spec.js index b37abab..ff1032c 100644 --- a/tests/components/main-components/update-main-components.spec.js +++ b/tests/components/main-components/update-main-components.spec.js @@ -4,18 +4,10 @@ const { DashboardPage } = require('../../../pages/dashboard/dashboard-page'); const { TeamPage } = require('../../../pages/dashboard/team-page'); const { MainPage } = require('../../../pages/workspace/main-page'); const { random } = require('../../../helpers/string-generator'); -const { - LayersPanelPage, -} = require('../../../pages/workspace/layers-panel-page'); -const { - ColorPalettePage, -} = require('../../../pages/workspace/color-palette-page'); -const { - DesignPanelPage, -} = require('../../../pages/workspace/design-panel-page'); -const { - AssetsPanelPage, -} = require('../../../pages/workspace/assets-panel-page'); +const { LayersPanelPage } = require('../../../pages/workspace/layers-panel-page'); +const { ColorPalettePage } = require('../../../pages/workspace/color-palette-page'); +const { DesignPanelPage } = require('../../../pages/workspace/design-panel-page'); +const { AssetsPanelPage } = require('../../../pages/workspace/assets-panel-page'); const teamName = random().concat('autotest'); @@ -55,9 +47,7 @@ mainTest('Update main component', async ({ page }) => { await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); await layersPanelPage.updateMainComponentViaRightClick(); - await expect(mainPage.viewport).toHaveScreenshot( - 'component-update-canvas.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('component-update-canvas.png'); await assetsPanelPage.clickAssetsTab(); await assetsPanelPage.expandComponentsBlockOnAssetsTab(); await expect(assetsPanelPage.assetsPanel).toHaveScreenshot( diff --git a/tests/composition/composition-board.spec.js b/tests/composition/composition-board.spec.js index 9512ca4..6676ae0 100644 --- a/tests/composition/composition-board.spec.js +++ b/tests/composition/composition-board.spec.js @@ -1,8 +1,6 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { expect, test } = require('@playwright/test'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); @@ -146,46 +144,34 @@ test.describe(() => { }); }); - mainTest( - 'CO-12 Add, hide, unhide and delete Blur to board', - async ({ page }) => { - const mainPage = new MainPage(page); - const colorPalettePage = new ColorPalettePage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickFillColorIcon(); - await colorPalettePage.setHex('#304d6a'); - await mainPage.waitForChangeIsSaved(); - await designPanelPage.clickAddBlurButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-blur-default.png', - { - mask: [mainPage.guides], - }, - ); - await designPanelPage.hideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('board-blur-hide.png', { - mask: [mainPage.guides], - }); - await designPanelPage.unhideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-blur-unhide.png', - { - mask: [mainPage.guides], - }, - ); - await designPanelPage.removeBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-blur-remove.png', - { - mask: [mainPage.guides], - }, - ); - }, - ); + mainTest('CO-12 Add, hide, unhide and delete Blur to board', async ({ page }) => { + const mainPage = new MainPage(page); + const colorPalettePage = new ColorPalettePage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickFillColorIcon(); + await colorPalettePage.setHex('#304d6a'); + await mainPage.waitForChangeIsSaved(); + await designPanelPage.clickAddBlurButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('board-blur-default.png', { + mask: [mainPage.guides], + }); + await designPanelPage.hideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('board-blur-hide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.unhideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('board-blur-unhide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.removeBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('board-blur-remove.png', { + mask: [mainPage.guides], + }); + }); mainTest('CO-13 Add and edit Blur to board', async ({ page }) => { const mainPage = new MainPage(page); @@ -204,12 +190,9 @@ test.describe(() => { await designPanelPage.clickAddStrokeButton(); await mainPage.clickViewportOnce(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-stroke-default.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('board-stroke-default.png', { + mask: [mainPage.guides], + }); await mainPage.clickCreatedBoardTitleOnCanvas(); await designPanelPage.changeStrokeSettings( '#43E50B', @@ -278,12 +261,9 @@ test.describe(() => { await designPanelPage.removeStroke(); await mainPage.clickViewportOnce(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-stroke-remove.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('board-stroke-remove.png', { + mask: [mainPage.guides], + }); }); mainTest('CO-25-1 Delete board via rightclick', async ({ page }) => { @@ -325,12 +305,9 @@ test.describe(() => { await designPanelPage.clickIndividualCornersRadiusButton(); await designPanelPage.changeIndependentCorners('30', '60', '90', '120'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-changed-corners.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('board-changed-corners.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeIndependentCorners('0', '0', '0', '0'); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot('board.png', { @@ -405,12 +382,9 @@ test.describe(() => { mask: [mainPage.guides], }); await layersPanelPage.doubleClickLayerIconOnLayersTab(board2); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-second-zoom.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('board-second-zoom.png', { + mask: [mainPage.guides], + }); }, ); diff --git a/tests/composition/composition-comments.spec.js b/tests/composition/composition-comments.spec.js index 6cb53ae..91c3443 100644 --- a/tests/composition/composition-comments.spec.js +++ b/tests/composition/composition-comments.spec.js @@ -4,9 +4,7 @@ const { expect, test } = require('@playwright/test'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); const { random } = require('../../helpers/string-generator'); -const { - CommentsPanelPage, -} = require('../../pages/workspace/comments-panel-page'); +const { CommentsPanelPage } = require('../../pages/workspace/comments-panel-page'); const teamName = random().concat('autotest'); diff --git a/tests/composition/composition-ellipse.spec.js b/tests/composition/composition-ellipse.spec.js index c1cdcb4..c0dc25c 100644 --- a/tests/composition/composition-ellipse.spec.js +++ b/tests/composition/composition-ellipse.spec.js @@ -1,8 +1,6 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { expect, test } = require('@playwright/test'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); @@ -120,9 +118,7 @@ test.describe(() => { await colorPalettePage.setHex('#96e637'); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-inner-shadow.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('ellipse-inner-shadow.png'); }); mainTest( @@ -136,36 +132,24 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.clickAddBlurButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-blur-default.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('ellipse-blur-default.png', { + mask: [mainPage.guides], + }); await designPanelPage.hideBlur(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-blur-hide.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('ellipse-blur-hide.png', { + mask: [mainPage.guides], + }); await designPanelPage.unhideBlur(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-blur-unhide.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('ellipse-blur-unhide.png', { + mask: [mainPage.guides], + }); await designPanelPage.removeBlur(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-blur-remove.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('ellipse-blur-remove.png', { + mask: [mainPage.guides], + }); }, ); @@ -178,95 +162,86 @@ test.describe(() => { await expect(mainPage.viewport).toHaveScreenshot('ellipse-blur.png'); }); - mainTest( - 'CO-121 Add, edit and delete Stroke to ellipse', - async ({ page }) => { - const mainPage = new MainPage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickAddStrokeButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-stroke-default.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await mainPage.waitForChangeIsSaved(); - await designPanelPage.changeStrokeSettings( - '#43E50B', - '70', - '13', - 'Inside', - 'Dotted', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-stroke-inside-dotted.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await mainPage.waitForChangeIsSaved(); - await designPanelPage.changeStrokeSettings( - '#F5358F', - '80', - '5', - 'Outside', - 'Dashed', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-stroke-outside-dashed.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await mainPage.waitForChangeIsSaved(); - await designPanelPage.changeStrokeSettings( - '#F5358F', - '100', - '3', - 'Center', - 'Solid', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-stroke-center-solid.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await mainPage.waitForChangeIsSaved(); - await designPanelPage.changeStrokeSettings( - '#F5358F', - '40', - '4', - 'Center', - 'Mixed', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-stroke-center-mixed.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await mainPage.waitForChangeIsSaved(); - await designPanelPage.removeStroke(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'ellipse-stroke-remove.png', - { - mask: [mainPage.guides], - }, - ); - }, - ); + mainTest('CO-121 Add, edit and delete Stroke to ellipse', async ({ page }) => { + const mainPage = new MainPage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickAddStrokeButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('ellipse-stroke-default.png', { + mask: [mainPage.guides], + }); + await mainPage.clickOnLayerOnCanvas(); + await mainPage.waitForChangeIsSaved(); + await designPanelPage.changeStrokeSettings( + '#43E50B', + '70', + '13', + 'Inside', + 'Dotted', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'ellipse-stroke-inside-dotted.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await mainPage.waitForChangeIsSaved(); + await designPanelPage.changeStrokeSettings( + '#F5358F', + '80', + '5', + 'Outside', + 'Dashed', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'ellipse-stroke-outside-dashed.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await mainPage.waitForChangeIsSaved(); + await designPanelPage.changeStrokeSettings( + '#F5358F', + '100', + '3', + 'Center', + 'Solid', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'ellipse-stroke-center-solid.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await mainPage.waitForChangeIsSaved(); + await designPanelPage.changeStrokeSettings( + '#F5358F', + '40', + '4', + 'Center', + 'Mixed', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'ellipse-stroke-center-mixed.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await mainPage.waitForChangeIsSaved(); + await designPanelPage.removeStroke(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('ellipse-stroke-remove.png', { + mask: [mainPage.guides], + }); + }); mainTest.skip( // todo bug 6359 > need to update after fix diff --git a/tests/composition/composition-flex-layout.spec.js b/tests/composition/composition-flex-layout.spec.js index a73f8ca..6f95291 100644 --- a/tests/composition/composition-flex-layout.spec.js +++ b/tests/composition/composition-flex-layout.spec.js @@ -43,24 +43,18 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); }); - mainTest( - 'FL-1 Add flex layout to board from rightclick', - async ({ page }) => { - const mainPage = new MainPage(page); - const layersPanelPage = new LayersPanelPage(page); - const designPanelPage = new DesignPanelPage(page); - await mainPage.addFlexLayoutViaRightClick(); - await mainPage.waitForChangeIsSaved(); - await layersPanelPage.isLayoutIconVisibleOnLayer(); - await designPanelPage.isLayoutRemoveButtonExists(); - await expect(mainPage.viewport).toHaveScreenshot( - 'board-with-layout.png', - { - mask: [mainPage.guides], - }, - ); - }, - ); + mainTest('FL-1 Add flex layout to board from rightclick', async ({ page }) => { + const mainPage = new MainPage(page); + const layersPanelPage = new LayersPanelPage(page); + const designPanelPage = new DesignPanelPage(page); + await mainPage.addFlexLayoutViaRightClick(); + await mainPage.waitForChangeIsSaved(); + await layersPanelPage.isLayoutIconVisibleOnLayer(); + await designPanelPage.isLayoutRemoveButtonExists(); + await expect(mainPage.viewport).toHaveScreenshot('board-with-layout.png', { + mask: [mainPage.guides], + }); + }); mainTest('FL-2 Add flex layout to board from shortcut', async ({ page }) => { const mainPage = new MainPage(page); @@ -93,23 +87,20 @@ test.describe(() => { }, ); - mainTest( - 'FL-5 Remove flex layout from board from shortcut', - async ({ page }) => { - const mainPage = new MainPage(page); - const layersPanelPage = new LayersPanelPage(page); - const designPanelPage = new DesignPanelPage(page); - await mainPage.pressFlexLayoutShortcut(); - await mainPage.waitForChangeIsSaved(); - await layersPanelPage.isLayoutIconVisibleOnLayer(); - await designPanelPage.isLayoutRemoveButtonExists(); - await mainPage.clickCreatedBoardTitleOnCanvas(); - await mainPage.pressFlexLayoutShortcut(); - await mainPage.waitForChangeIsSaved(); - await layersPanelPage.isLayoutIconVisibleOnLayer(false); - await designPanelPage.isLayoutRemoveButtonExists(false); - }, - ); + mainTest('FL-5 Remove flex layout from board from shortcut', async ({ page }) => { + const mainPage = new MainPage(page); + const layersPanelPage = new LayersPanelPage(page); + const designPanelPage = new DesignPanelPage(page); + await mainPage.pressFlexLayoutShortcut(); + await mainPage.waitForChangeIsSaved(); + await layersPanelPage.isLayoutIconVisibleOnLayer(); + await designPanelPage.isLayoutRemoveButtonExists(); + await mainPage.clickCreatedBoardTitleOnCanvas(); + await mainPage.pressFlexLayoutShortcut(); + await mainPage.waitForChangeIsSaved(); + await layersPanelPage.isLayoutIconVisibleOnLayer(false); + await designPanelPage.isLayoutRemoveButtonExists(false); + }); mainTest( 'FL-6 Remove flex layout from board from Design panel', @@ -147,12 +138,9 @@ test.describe(() => { ); await designPanelPage.changeLayoutDirection('Column'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-column-direction.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-column-direction.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeLayoutDirection('Column reverse'); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot( @@ -163,12 +151,9 @@ test.describe(() => { ); await designPanelPage.changeLayoutDirection('Row'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-row-direction.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-row-direction.png', { + mask: [mainPage.guides], + }); }); mainTest('FL-9 Change alignment', async ({ page }) => { @@ -181,12 +166,9 @@ test.describe(() => { await mainPage.clickCreatedBoardTitleOnCanvas(); await designPanelPage.changeLayoutAlignment('Center'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-align-center.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-align-center.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeLayoutAlignment('End'); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot('layout-align-end.png', { @@ -209,12 +191,9 @@ test.describe(() => { await mainPage.clickCreatedBoardTitleOnCanvas(); await designPanelPage.changeLayoutJustification('Center'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-justify-center.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-justify-center.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeLayoutJustification('End'); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot('layout-justify-end.png', { @@ -246,12 +225,9 @@ test.describe(() => { ); await designPanelPage.changeLayoutJustification('Start'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-justify-start.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-justify-start.png', { + mask: [mainPage.guides], + }); }); mainTest('FL-12 Change column gap', async ({ page }) => { @@ -264,28 +240,19 @@ test.describe(() => { await mainPage.clickCreatedBoardTitleOnCanvas(); await designPanelPage.changeLayoutColumnGap('5'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-column-gap-5.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-column-gap-5.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeLayoutColumnGap('15'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-column-gap-15.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-column-gap-15.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeLayoutColumnGap('0'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-column-gap-0.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-column-gap-0.png', { + mask: [mainPage.guides], + }); }); mainTest('FL-13 Change row gap', async ({ page }) => { @@ -327,12 +294,9 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.changeLayoutPadding('Horizontal', '15'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-padding-5-15.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-padding-5-15.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeLayoutPadding('Horizontal', '0'); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot( @@ -419,12 +383,9 @@ test.describe(() => { ); await designPanelPage.changeFlexElementAlignment('End'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'flex-element-align-end.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('flex-element-align-end.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeFlexElementAlignment('Start'); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot( @@ -501,33 +462,21 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.changeLayoutColumnGap('0'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-padding-gap-0.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-padding-gap-0.png', { + mask: [mainPage.guides], + }); await designPanelPage.clickLayoutVerticalPaddingField(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-padding-gap-0.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-padding-gap-0.png', { + mask: [mainPage.guides], + }); await designPanelPage.clickLayoutHorizontalPaddingField(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-padding-gap-0.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-padding-gap-0.png', { + mask: [mainPage.guides], + }); await designPanelPage.clickLayoutColumnGapField(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layout-padding-gap-0.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layout-padding-gap-0.png', { + mask: [mainPage.guides], + }); }); mainTest('FL-39 Gap click highlight', async ({ page }) => { @@ -554,12 +503,9 @@ test.describe(() => { await designPanelPage.isFlexElementSectionOpened(); await designPanelPage.setFlexElementPositionAbsolute(); await mainPage.waitForChangeIsSaved(); - await expect(page).toHaveScreenshot( - 'flex-element-position-absolute.png', - { - mask: [mainPage.guides, mainPage.usersSection], - }, - ); + await expect(page).toHaveScreenshot('flex-element-position-absolute.png', { + mask: [mainPage.guides, mainPage.usersSection], + }); }, ); }); diff --git a/tests/composition/composition-image.spec.js b/tests/composition/composition-image.spec.js index eba59fc..b67466d 100644 --- a/tests/composition/composition-image.spec.js +++ b/tests/composition/composition-image.spec.js @@ -1,9 +1,7 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); const { expect, test } = require('@playwright/test'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); @@ -128,9 +126,7 @@ test.describe(() => { await designPanelPage.clickIndividualCornersRadiusButton(); await designPanelPage.changeIndependentCorners('30', '60', '90', '120'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-changed-corners.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('image-changed-corners.png'); await designPanelPage.changeIndependentCorners('0', '0', '0', '0'); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot('image-png.png'); @@ -159,54 +155,39 @@ test.describe(() => { await expect(mainPage.viewport).toHaveScreenshot('image-jpeg.png'); }); - mainTest( - 'CO-229 Add, hide, unhide and delete Blur to image', - async ({ page }) => { - const mainPage = new MainPage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickAddBlurButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-blur-default.png', - { - mask: [mainPage.guides], - }, - ); - await designPanelPage.hideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('image-blur-hide.png', { - mask: [mainPage.guides], - }); - await designPanelPage.unhideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-blur-unhide.png', - { - mask: [mainPage.guides], - }, - ); - await designPanelPage.removeBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-blur-remove.png', - { - mask: [mainPage.guides], - }, - ); - }, - ); + mainTest('CO-229 Add, hide, unhide and delete Blur to image', async ({ page }) => { + const mainPage = new MainPage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickAddBlurButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('image-blur-default.png', { + mask: [mainPage.guides], + }); + await designPanelPage.hideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('image-blur-hide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.unhideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('image-blur-unhide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.removeBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('image-blur-remove.png', { + mask: [mainPage.guides], + }); + }); mainTest('CO-231 Add, edit and delete Stroke to image', async ({ page }) => { const mainPage = new MainPage(page); const designPanelPage = new DesignPanelPage(page); await designPanelPage.clickAddStrokeButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-stroke-default.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('image-stroke-default.png', { + mask: [mainPage.guides], + }); await designPanelPage.changeStrokeSettings( '#43E50B', '60', @@ -265,12 +246,9 @@ test.describe(() => { ); await designPanelPage.removeStroke(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-stroke-remove.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('image-stroke-remove.png', { + mask: [mainPage.guides], + }); }); mainTest('CO-242-1 Delete image via rightclick', async ({ page }) => { @@ -315,32 +293,23 @@ test.describe(() => { await expect(mainPage.viewport).toHaveScreenshot('image-rotated-359.png'); }); - mainTest( - 'CO-259 Flip Vertical and Flip Horizontal image', - async ({ page }) => { - const mainPage = new MainPage(page); - await mainPage.flipVerticalViaRightClick(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-flipped-vertical.png', - ); - await mainPage.flipHorizontalViaRightClick(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-flipped-vertical-horizontal.png', - ); - await mainPage.flipVerticalViaShortcut(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-flipped-horizontal.png', - ); - await mainPage.flipHorizontalViaShortcut(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'image-non-flipped-jpeg.png', - ); - }, - ); + mainTest('CO-259 Flip Vertical and Flip Horizontal image', async ({ page }) => { + const mainPage = new MainPage(page); + await mainPage.flipVerticalViaRightClick(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('image-flipped-vertical.png'); + await mainPage.flipHorizontalViaRightClick(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'image-flipped-vertical-horizontal.png', + ); + await mainPage.flipVerticalViaShortcut(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('image-flipped-horizontal.png'); + await mainPage.flipHorizontalViaShortcut(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('image-non-flipped-jpeg.png'); + }); }); test.describe(() => { diff --git a/tests/composition/composition-path-node-panel.spec.js b/tests/composition/composition-path-node-panel.spec.js index bfd0016..96ed664 100644 --- a/tests/composition/composition-path-node-panel.spec.js +++ b/tests/composition/composition-path-node-panel.spec.js @@ -45,18 +45,14 @@ test.describe(() => { await mainPage.releaseShiftKeyboardButton(); await mainPage.clickAddNodeButtonOnNodePanel(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-added-one-node.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-added-one-node.png'); await mainPage.clickFourthNode(); await mainPage.holdShiftKeyboardButton(); await mainPage.clickFifthNode(); await mainPage.releaseShiftKeyboardButton(); await mainPage.pressShiftPlusKeyboardShortcut(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-added-two-nodes.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-added-two-nodes.png'); }, ); @@ -67,15 +63,11 @@ test.describe(() => { await mainPage.clickFirstNode(); await mainPage.clickDeleteNodeButtonOnNodePanel(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-deleted-one-node.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-deleted-one-node.png'); await mainPage.clickSecondNode(); await mainPage.pressDeleteKeyboardButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-deleted-two-nodes.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-deleted-two-nodes.png'); }, ); @@ -89,9 +81,7 @@ test.describe(() => { await mainPage.releaseShiftKeyboardButton(); await mainPage.clickMergeNodesButtonOnNodePanel(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-merged-nodes-once.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-merged-nodes-once.png'); await mainPage.holdShiftKeyboardButton(); await mainPage.clickFirstNode(); await mainPage.clickSecondNode(); @@ -104,36 +94,29 @@ test.describe(() => { }, ); - mainTest( - 'CO-333 Join nodes via Node panel and J shortcut', - async ({ page }) => { - const mainPage = new MainPage(page); - await mainPage.clickDrawNodesButtonOnNodePanel(); - await mainPage.clickViewportByCoordinates(600, 200); - await mainPage.clickViewportByCoordinates(750, 300); - await mainPage.waitForChangeIsSaved(); - await mainPage.clickMoveNodesButtonOnNodePanel(); - await mainPage.waitForChangeIsSaved(); - await mainPage.holdShiftKeyboardButton(); - await mainPage.clickSixthNode(); - await mainPage.clickThirdNode(); - await mainPage.releaseShiftKeyboardButton(); - await mainPage.clickJoinNodesButtonOnNodePanel(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-joined-nodes-once.png', - ); - await mainPage.holdShiftKeyboardButton(); - await mainPage.clickFifthNode(); - await mainPage.clickSecondNode(); - await mainPage.releaseShiftKeyboardButton(); - await mainPage.pressJKeyboardShortcut(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-joined-nodes-twice.png', - ); - }, - ); + mainTest('CO-333 Join nodes via Node panel and J shortcut', async ({ page }) => { + const mainPage = new MainPage(page); + await mainPage.clickDrawNodesButtonOnNodePanel(); + await mainPage.clickViewportByCoordinates(600, 200); + await mainPage.clickViewportByCoordinates(750, 300); + await mainPage.waitForChangeIsSaved(); + await mainPage.clickMoveNodesButtonOnNodePanel(); + await mainPage.waitForChangeIsSaved(); + await mainPage.holdShiftKeyboardButton(); + await mainPage.clickSixthNode(); + await mainPage.clickThirdNode(); + await mainPage.releaseShiftKeyboardButton(); + await mainPage.clickJoinNodesButtonOnNodePanel(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-joined-nodes-once.png'); + await mainPage.holdShiftKeyboardButton(); + await mainPage.clickFifthNode(); + await mainPage.clickSecondNode(); + await mainPage.releaseShiftKeyboardButton(); + await mainPage.pressJKeyboardShortcut(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-joined-nodes-twice.png'); + }); mainTest( 'CO-334 Separate nodes via Node panel and K shortcut', @@ -193,14 +176,10 @@ mainTest( await mainPage.clickFirstNode(); await mainPage.clickToCurveButtonOnNodePanel(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-to-curve-one-node.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-to-curve-one-node.png'); await mainPage.clickSecondNode(); await mainPage.pressCKeyboardShortcut(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-to-curve-two-nodes.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('path-to-curve-two-nodes.png'); }, ); diff --git a/tests/composition/composition-path.spec.js b/tests/composition/composition-path.spec.js index 7893143..e245fbc 100644 --- a/tests/composition/composition-path.spec.js +++ b/tests/composition/composition-path.spec.js @@ -1,9 +1,7 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); const { expect, test } = require('@playwright/test'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); @@ -59,36 +57,30 @@ test.describe(() => { await layersPanelPage.isLayerNameDisplayed('renamed path'); }); - mainTest( - 'CO-282 Add, hide, unhide and delete Blur to Path', - async ({ page }) => { - const mainPage = new MainPage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickAddBlurButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-blur-default.png', - { - mask: [mainPage.guides], - }, - ); - await designPanelPage.hideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('path-blur-hide.png', { - mask: [mainPage.guides], - }); - await designPanelPage.unhideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('path-blur-unhide.png', { - mask: [mainPage.guides], - }); - await designPanelPage.removeBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('path-blur-remove.png', { - mask: [mainPage.guides], - }); - }, - ); + mainTest('CO-282 Add, hide, unhide and delete Blur to Path', async ({ page }) => { + const mainPage = new MainPage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickAddBlurButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-blur-default.png', { + mask: [mainPage.guides], + }); + await designPanelPage.hideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-blur-hide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.unhideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-blur-unhide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.removeBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-blur-remove.png', { + mask: [mainPage.guides], + }); + }); mainTest('CO-283 Add and edit Blur to path', async ({ page }) => { const mainPage = new MainPage(page); @@ -175,32 +167,23 @@ test.describe(() => { }, ); - mainTest( - 'CO-310 Flip Vertical and Flip Horizontal path', - async ({ page }) => { - const mainPage = new MainPage(page); - await mainPage.flipVerticalViaRightClick(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-flipped-vertical.png', - ); - await mainPage.flipHorizontalViaRightClick(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-flipped-vertical-horizontal.png', - ); - await mainPage.flipVerticalViaShortcut(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-flipped-horizontal.png', - ); - await mainPage.flipHorizontalViaShortcut(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-non-flipped-jpeg.png', - ); - }, - ); + mainTest('CO-310 Flip Vertical and Flip Horizontal path', async ({ page }) => { + const mainPage = new MainPage(page); + await mainPage.flipVerticalViaRightClick(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-flipped-vertical.png'); + await mainPage.flipHorizontalViaRightClick(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'path-flipped-vertical-horizontal.png', + ); + await mainPage.flipVerticalViaShortcut(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-flipped-horizontal.png'); + await mainPage.flipHorizontalViaShortcut(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('path-non-flipped-jpeg.png'); + }); mainTest('CO-322 Selection to board', async ({ page }) => { const mainPage = new MainPage(page); @@ -232,12 +215,9 @@ test.describe(() => { ); await designPanelPage.hideShadow(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'path-drop-shadow-hide.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('path-drop-shadow-hide.png', { + mask: [mainPage.guides], + }); await designPanelPage.unhideShadow(); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot( diff --git a/tests/composition/composition-rectangle.spec.js b/tests/composition/composition-rectangle.spec.js index cda24c0..89498a4 100644 --- a/tests/composition/composition-rectangle.spec.js +++ b/tests/composition/composition-rectangle.spec.js @@ -1,8 +1,6 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { expect, test } = require('@playwright/test'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); @@ -133,115 +131,100 @@ test.describe(() => { ); await designPanelPage.hideBlur(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-blur-hide.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-blur-hide.png', { + mask: [mainPage.guides], + }); await designPanelPage.unhideBlur(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-blur-unhide.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-blur-unhide.png', { + mask: [mainPage.guides], + }); await designPanelPage.removeBlur(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-blur-remove.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-blur-remove.png', { + mask: [mainPage.guides], + }); }, ); - mainTest( - 'CO-74 Add, edit and delete Stroke to rectangle', - async ({ page }) => { - const mainPage = new MainPage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickAddStrokeButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-stroke-default.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await designPanelPage.changeStrokeSettings( - '#43E50B', - '60', - '10', - 'Inside', - 'Dotted', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-stroke-inside-dotted.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await designPanelPage.changeStrokeSettings( - '#F5358F', - '80', - '5', - 'Outside', - 'Dashed', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-stroke-outside-dashed.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await designPanelPage.changeStrokeSettings( - '#F5358F', - '100', - '3', - 'Center', - 'Solid', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-stroke-center-solid.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await designPanelPage.changeStrokeSettings( - '#F5358F', - '40', - '4', - 'Center', - 'Mixed', - ); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-stroke-center-mixed.png', - { - mask: [mainPage.guides], - }, - ); - await mainPage.clickOnLayerOnCanvas(); - await designPanelPage.removeStroke(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-stroke-remove.png', - { - mask: [mainPage.guides], - }, - ); - }, - ); + mainTest('CO-74 Add, edit and delete Stroke to rectangle', async ({ page }) => { + const mainPage = new MainPage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickAddStrokeButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'rectangle-stroke-default.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await designPanelPage.changeStrokeSettings( + '#43E50B', + '60', + '10', + 'Inside', + 'Dotted', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'rectangle-stroke-inside-dotted.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await designPanelPage.changeStrokeSettings( + '#F5358F', + '80', + '5', + 'Outside', + 'Dashed', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'rectangle-stroke-outside-dashed.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await designPanelPage.changeStrokeSettings( + '#F5358F', + '100', + '3', + 'Center', + 'Solid', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'rectangle-stroke-center-solid.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await designPanelPage.changeStrokeSettings( + '#F5358F', + '40', + '4', + 'Center', + 'Mixed', + ); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot( + 'rectangle-stroke-center-mixed.png', + { + mask: [mainPage.guides], + }, + ); + await mainPage.clickOnLayerOnCanvas(); + await designPanelPage.removeStroke(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-stroke-remove.png', { + mask: [mainPage.guides], + }); + }); mainTest('CO-80 Rename rectangle with valid name', async ({ page }) => { const mainPage = new MainPage(page); @@ -263,18 +246,14 @@ test.describe(() => { await colorPalettePage.setHex('#304d6a'); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-drop-shadow.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-drop-shadow.png'); await designPanelPage.selectTypeForShadow('Inner shadow'); await designPanelPage.changeShadowSettings('5', '7', '9', '12', '25'); await designPanelPage.clickShadowColorIcon(); await colorPalettePage.setHex('#96e637'); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-inner-shadow.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-inner-shadow.png'); }); mainTest('CO-73 Add and edit Blur to rectangle', async ({ page }) => { @@ -307,24 +286,16 @@ test.describe(() => { const designPanelPage = new DesignPanelPage(page); await designPanelPage.changeRotationForLayer('90'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-rotated-90.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-rotated-90.png'); await designPanelPage.changeRotationForLayer('120'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-rotated-120.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-rotated-120.png'); await designPanelPage.changeRotationForLayer('45'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-rotated-45.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-rotated-45.png'); await designPanelPage.changeRotationForLayer('360'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'rectangle-rotated-359.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('rectangle-rotated-359.png'); }); mainTest('CO-63 Change border radius multiple values', async ({ page }) => { diff --git a/tests/composition/composition-text.spec.js b/tests/composition/composition-text.spec.js index 09a9975..08724f3 100644 --- a/tests/composition/composition-text.spec.js +++ b/tests/composition/composition-text.spec.js @@ -1,9 +1,7 @@ const { mainTest } = require('../../fixtures'); const { expect, test } = require('@playwright/test'); const { MainPage } = require('../../pages/workspace/main-page'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); @@ -74,12 +72,9 @@ test.describe(() => { ); await designPanelPage.hideShadow(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'text-drop-shadow-hide.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('text-drop-shadow-hide.png', { + mask: [mainPage.guides], + }); await designPanelPage.unhideShadow(); await mainPage.waitForChangeIsSaved(); await expect(mainPage.viewport).toHaveScreenshot( @@ -128,40 +123,34 @@ test.describe(() => { await expect(mainPage.viewport).toHaveScreenshot('text-inner-shadow.png'); }); - mainTest( - 'CO-169 Add, hide, unhide and delete Blur to text', - async ({ page }) => { - const mainPage = new MainPage(page); - const colorPalettePage = new ColorPalettePage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickFillColorIcon(); - await colorPalettePage.setHex('#304d6a'); - await mainPage.waitForChangeIsSaved(); - await designPanelPage.clickAddBlurButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'text-blur-default.png', - { - mask: [mainPage.guides], - }, - ); - await designPanelPage.hideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('text-blur-hide.png', { - mask: [mainPage.guides], - }); - await designPanelPage.unhideBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('text-blur-unhide.png', { - mask: [mainPage.guides], - }); - await designPanelPage.removeBlur(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot('text-blur-remove.png', { - mask: [mainPage.guides], - }); - }, - ); + mainTest('CO-169 Add, hide, unhide and delete Blur to text', async ({ page }) => { + const mainPage = new MainPage(page); + const colorPalettePage = new ColorPalettePage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickFillColorIcon(); + await colorPalettePage.setHex('#304d6a'); + await mainPage.waitForChangeIsSaved(); + await designPanelPage.clickAddBlurButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('text-blur-default.png', { + mask: [mainPage.guides], + }); + await designPanelPage.hideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('text-blur-hide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.unhideBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('text-blur-unhide.png', { + mask: [mainPage.guides], + }); + await designPanelPage.removeBlur(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.viewport).toHaveScreenshot('text-blur-remove.png', { + mask: [mainPage.guides], + }); + }); mainTest('CO-170 Add and edit Blur to text', async ({ page }) => { const mainPage = new MainPage(page); @@ -178,12 +167,9 @@ test.describe(() => { await designPanelPage.clickAddStrokeButton(); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.viewport).toHaveScreenshot( - 'text-stroke-default.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('text-stroke-default.png', { + mask: [mainPage.guides], + }); await mainPage.clickOnLayerOnCanvas(); await designPanelPage.changeStrokeSettings('#43E50B', '60', '10', 'Inside'); await mainPage.waitForChangeIsSaved(); diff --git a/tests/dashboard/dashboard-files.spec.js b/tests/dashboard/dashboard-files.spec.js index 31400b5..913b6ee 100644 --- a/tests/dashboard/dashboard-files.spec.js +++ b/tests/dashboard/dashboard-files.spec.js @@ -118,16 +118,13 @@ mainTest( }, ); -mainTest( - 'DA-13 Download Penpot file in Drafts via rightclick', - async ({ page }) => { - const dashboardPage = new DashboardPage(page); - const mainPage = new MainPage(page); - await dashboardPage.createFileViaPlaceholder(); - await mainPage.clickPencilBoxButton(); - await dashboardPage.downloadFileViaRightClick(false); - }, -); +mainTest('DA-13 Download Penpot file in Drafts via rightclick', async ({ page }) => { + const dashboardPage = new DashboardPage(page); + const mainPage = new MainPage(page); + await dashboardPage.createFileViaPlaceholder(); + await mainPage.clickPencilBoxButton(); + await dashboardPage.downloadFileViaRightClick(false); +}); mainTest( 'DA-15 Download standard file in Drafts via rightclick', @@ -381,24 +378,21 @@ mainTest('DA-37-1 Delete file in Project via rightclick', async ({ page }) => { await dashboardPage.checkNumberOfFiles('0 files'); }); -mainTest( - 'DA-37-2 Delete file in Project via Options icon', - async ({ page }) => { - const dashboardPage = new DashboardPage(page); - const mainPage = new MainPage(page); - await dashboardPage.clickAddProjectButton(); - await dashboardPage.setProjectName('Test Project'); - await dashboardPage.isProjectTitleDisplayed('Test Project'); - await dashboardPage.createFileViaPlaceholder(); - await mainPage.clickPencilBoxButton(); - await dashboardPage.deleteFileViaOptionsIcon(); - await dashboardPage.isSuccessMessageDisplayed( - 'Your file has been deleted successfully', - ); - await dashboardPage.waitSuccessMessageHidden(); - await dashboardPage.checkNumberOfFiles('0 files'); - }, -); +mainTest('DA-37-2 Delete file in Project via Options icon', async ({ page }) => { + const dashboardPage = new DashboardPage(page); + const mainPage = new MainPage(page); + await dashboardPage.clickAddProjectButton(); + await dashboardPage.setProjectName('Test Project'); + await dashboardPage.isProjectTitleDisplayed('Test Project'); + await dashboardPage.createFileViaPlaceholder(); + await mainPage.clickPencilBoxButton(); + await dashboardPage.deleteFileViaOptionsIcon(); + await dashboardPage.isSuccessMessageDisplayed( + 'Your file has been deleted successfully', + ); + await dashboardPage.waitSuccessMessageHidden(); + await dashboardPage.checkNumberOfFiles('0 files'); +}); mainTest('DA-52-1 Rename project via rightclick', async ({ page }) => { const dashboardPage = new DashboardPage(page); @@ -466,14 +460,11 @@ mainTest('DA-55 Pin project', async ({ page }) => { await dashboardPage.checkPinnedProjectsSidebarItem('Test Project'); }); -mainTest( - 'DA-59 Import file to project - fail invalid format', - async ({ page }) => { - const dashboardPage = new DashboardPage(page); - await dashboardPage.openSidebarItem('Drafts'); - await dashboardPage.importFileWithInvalidFormat('images/images.png'); - }, -); +mainTest('DA-59 Import file to project - fail invalid format', async ({ page }) => { + const dashboardPage = new DashboardPage(page); + await dashboardPage.openSidebarItem('Drafts'); + await dashboardPage.importFileWithInvalidFormat('images/images.png'); +}); mainTest('DA-60-1 Delete project via rightclick', async ({ page }) => { const dashboardPage = new DashboardPage(page); diff --git a/tests/dashboard/dashboard-teams.spec.js b/tests/dashboard/dashboard-teams.spec.js index 8c78050..81d12d7 100644 --- a/tests/dashboard/dashboard-teams.spec.js +++ b/tests/dashboard/dashboard-teams.spec.js @@ -311,29 +311,24 @@ test.describe(() => { test.describe(() => { const team = random().concat('autotest'); - mainTest( - "DA-116 Team. Settings - check 'Team members' info", - async ({ page }) => { - const teamPage = new TeamPage(page); - const profilePage = new ProfilePage(page); - await profilePage.openYourAccountPage(); - await profilePage.isHeaderDisplayed('Your account'); - await profilePage.changeProfileName('QA Engineer'); - await profilePage.uploadProfileImage('images/sample.jpeg'); - await profilePage.waitInfoMessageHidden(); - await profilePage.backToDashboardFromAccount(); - await teamPage.createTeam(team); - await teamPage.isTeamSelected(team); - await teamPage.openTeamSettingsPageViaOptionsMenu(); + mainTest("DA-116 Team. Settings - check 'Team members' info", async ({ page }) => { + const teamPage = new TeamPage(page); + const profilePage = new ProfilePage(page); + await profilePage.openYourAccountPage(); + await profilePage.isHeaderDisplayed('Your account'); + await profilePage.changeProfileName('QA Engineer'); + await profilePage.uploadProfileImage('images/sample.jpeg'); + await profilePage.waitInfoMessageHidden(); + await profilePage.backToDashboardFromAccount(); + await teamPage.createTeam(team); + await teamPage.isTeamSelected(team); + await teamPage.openTeamSettingsPageViaOptionsMenu(); - const teamOwner = 'QA Engineer (Owner)'; - await teamPage.isTeamOwnerInfoDisplayed(teamOwner); - await teamPage.isTeamMembersInfoDisplayed('1 members'); - await expect(teamPage.teamOwnerSection).toHaveScreenshot( - 'team-owner-block.png', - ); - }, - ); + const teamOwner = 'QA Engineer (Owner)'; + await teamPage.isTeamOwnerInfoDisplayed(teamOwner); + await teamPage.isTeamMembersInfoDisplayed('1 members'); + await expect(teamPage.teamOwnerSection).toHaveScreenshot('team-owner-block.png'); + }); test.afterEach(async ({ page }) => { const teamPage = new TeamPage(page); diff --git a/tests/login.spec.js b/tests/login.spec.js index f6a3a0a..6adf378 100644 --- a/tests/login.spec.js +++ b/tests/login.spec.js @@ -38,7 +38,5 @@ test('ON-15 Login with incorrect password', async ({ page }) => { await loginPage.enterEmail(process.env.LOGIN_EMAIL); await loginPage.enterPwd('11223344'); await loginPage.clickLoginButton(); - await loginPage.isLoginErrorMessageDisplayed( - 'Email or password is incorrect.', - ); + await loginPage.isLoginErrorMessageDisplayed('Email or password is incorrect.'); }); diff --git a/tests/panels-features/panels-features-fill.spec.js b/tests/panels-features/panels-features-fill.spec.js index cedf8f6..cf3f86d 100644 --- a/tests/panels-features/panels-features-fill.spec.js +++ b/tests/panels-features/panels-features-fill.spec.js @@ -1,8 +1,6 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { expect, test } = require('@playwright/test'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); @@ -55,9 +53,7 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.isFillHexCodeSet('FF0000'); await designPanelPage.isFillOpacitySet('100'); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'board-changed-fill.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('board-changed-fill.png'); }); mainTest('PF-78 Change fill opacity for board', async ({ page }) => { @@ -78,9 +74,7 @@ test.describe(() => { const designPanelPage = new DesignPanelPage(page); await designPanelPage.clickRemoveFillButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'board-removed-fill.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('board-removed-fill.png'); }); }); @@ -113,9 +107,7 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.isFillHexCodeSet('FF0000'); await designPanelPage.isFillOpacitySet('100'); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'path-changed-fill.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('path-changed-fill.png'); }); mainTest('PF-82 Change fill opacity for path', async ({ page }) => { @@ -127,9 +119,7 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.isFillHexCodeSet('B1B2B5'); await designPanelPage.isFillOpacitySet('70'); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'path-changed-opacity.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('path-changed-opacity.png'); }); mainTest('PF-97 Remove fill for path', async ({ page }) => { @@ -140,9 +130,7 @@ test.describe(() => { await designPanelPage.clickRemoveFillButton(); await mainPage.waitForChangeIsSaved(); await mainPage.clickOnDesignTab(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'path-removed-fill.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('path-removed-fill.png'); }); }); diff --git a/tests/panels-features/panels-features-grid.spec.js b/tests/panels-features/panels-features-grid.spec.js index a7ebe78..de0f057 100644 --- a/tests/panels-features/panels-features-grid.spec.js +++ b/tests/panels-features/panels-features-grid.spec.js @@ -39,9 +39,7 @@ test.describe(() => { const designPanelPage = new DesignPanelPage(page); await designPanelPage.clickAddGridButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-default.png'); }); mainTest('PF-2 Square grid - change size', async ({ page }) => { @@ -82,60 +80,40 @@ test.describe(() => { await designPanelPage.clickGridActionsButton(); await designPanelPage.clickUseDefaultGridButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-default.png'); }); - mainTest( - 'PF-6 Hide and unhide square grid via Design panel', - async ({ page }) => { - const mainPage = new MainPage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickAddGridButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-default.png', - ); - await designPanelPage.clickHideGridButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-hide.png', - ); - await designPanelPage.clickUnhideGridButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-unhide.png', - ); - }, - ); + mainTest('PF-6 Hide and unhide square grid via Design panel', async ({ page }) => { + const mainPage = new MainPage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickAddGridButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-default.png'); + await designPanelPage.clickHideGridButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-hide.png'); + await designPanelPage.clickUnhideGridButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-unhide.png'); + }); - mainTest( - 'PF-7 Hide and unhide square grid via Main menu', - async ({ page }) => { - const mainPage = new MainPage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickAddGridButton(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-default.png', - ); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickHideGridsMainMenuSubItem(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-hide.png', - ); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickShowGridsMainMenuSubItem(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-unhide.png', - ); - }, - ); + mainTest('PF-7 Hide and unhide square grid via Main menu', async ({ page }) => { + const mainPage = new MainPage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickAddGridButton(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-default.png'); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickHideGridsMainMenuSubItem(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-hide.png'); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickShowGridsMainMenuSubItem(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-unhide.png'); + }); mainTest('PF-11 Remove square grid', async ({ page }) => { const mainPage = new MainPage(page); @@ -144,9 +122,7 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.clickRemoveGridButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'board-without-grid.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('board-without-grid.png'); }); mainTest('PF-12 Set columns grid', async ({ page }) => { @@ -155,9 +131,7 @@ test.describe(() => { await designPanelPage.clickAddGridButton(); await designPanelPage.selectGridType('Columns'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'columns-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('columns-grid-default.png'); }); mainTest('PF-13 Columns grid - change columns number', async ({ page }) => { @@ -197,9 +171,7 @@ test.describe(() => { await designPanelPage.clickAddGridButton(); await designPanelPage.selectGridType('Columns'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'columns-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('columns-grid-default.png'); await designPanelPage.clickGridActionsButton(); await designPanelPage.changeOpacityForGrid('50'); await mainPage.clickViewportTwice(); @@ -226,9 +198,7 @@ test.describe(() => { await designPanelPage.clickUseDefaultGridButton(); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'columns-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('columns-grid-default.png'); }); mainTest( @@ -244,9 +214,7 @@ test.describe(() => { ); await designPanelPage.clickHideGridButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'columns-grid-hide.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('columns-grid-hide.png'); await designPanelPage.clickUnhideGridButton(); await mainPage.waitForChangeIsSaved(); await expect(mainPage.createdLayer).toHaveScreenshot( @@ -263,9 +231,7 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.clickRemoveGridButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'board-without-grid.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('board-without-grid.png'); }); mainTest('PF-26 Set rows grid', async ({ page }) => { @@ -274,9 +240,7 @@ test.describe(() => { await designPanelPage.clickAddGridButton(); await designPanelPage.selectGridType('Rows'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'rows-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('rows-grid-default.png'); }); mainTest('PF-27 Rows grid - change rows number', async ({ page }) => { @@ -316,16 +280,12 @@ test.describe(() => { await designPanelPage.clickAddGridButton(); await designPanelPage.selectGridType('Rows'); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'rows-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('rows-grid-default.png'); await designPanelPage.clickGridActionsButton(); await designPanelPage.changeOpacityForGrid('50'); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'rows-grid-opacity-50.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('rows-grid-opacity-50.png'); await designPanelPage.changeOpacityForGrid('100'); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); @@ -345,38 +305,27 @@ test.describe(() => { await designPanelPage.clickUseDefaultGridButton(); await mainPage.clickViewportTwice(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'rows-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('rows-grid-default.png'); }); - mainTest( - 'PF-35 Hide and unhide rows grid via Main menu', - async ({ page }) => { - const mainPage = new MainPage(page); - const designPanelPage = new DesignPanelPage(page); - await designPanelPage.clickAddGridButton(); - await designPanelPage.selectGridType('Rows'); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'rows-grid-default.png', - ); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickHideGridsMainMenuSubItem(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'rows-grid-hide.png', - ); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickShowGridsMainMenuSubItem(); - await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'rows-grid-unhide.png', - ); - }, - ); + mainTest('PF-35 Hide and unhide rows grid via Main menu', async ({ page }) => { + const mainPage = new MainPage(page); + const designPanelPage = new DesignPanelPage(page); + await designPanelPage.clickAddGridButton(); + await designPanelPage.selectGridType('Rows'); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('rows-grid-default.png'); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickHideGridsMainMenuSubItem(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('rows-grid-hide.png'); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickShowGridsMainMenuSubItem(); + await mainPage.waitForChangeIsSaved(); + await expect(mainPage.createdLayer).toHaveScreenshot('rows-grid-unhide.png'); + }); mainTest('PF-39 Remove rows grid', async ({ page }) => { const mainPage = new MainPage(page); @@ -386,8 +335,6 @@ test.describe(() => { await mainPage.waitForChangeIsSaved(); await designPanelPage.clickRemoveGridButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'board-without-grid.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('board-without-grid.png'); }); }); diff --git a/tests/panels-features/panels-features-main-menu.spec.js b/tests/panels-features/panels-features-main-menu.spec.js index b8b30a0..524508c 100644 --- a/tests/panels-features/panels-features-main-menu.spec.js +++ b/tests/panels-features/panels-features-main-menu.spec.js @@ -1,9 +1,7 @@ const { mainTest } = require('../../fixtures'); const { MainPage } = require('../../pages/workspace/main-page'); const { expect, test } = require('@playwright/test'); -const { - ColorPalettePage, -} = require('../../pages/workspace/color-palette-page'); +const { ColorPalettePage } = require('../../pages/workspace/color-palette-page'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); @@ -41,19 +39,13 @@ mainTest( await designPanelPage.clickAddGridButton(); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-default.png'); await mainPage.pressHideShowGridsShortcut(browserName); await mainPage.waitForChangeIsSaved(); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-hide.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-hide.png'); await mainPage.pressHideShowGridsShortcut(); await mainPage.waitForChangeIsSaved(browserName); - await expect(mainPage.createdLayer).toHaveScreenshot( - 'square-grid-default.png', - ); + await expect(mainPage.createdLayer).toHaveScreenshot('square-grid-default.png'); }, ); @@ -63,9 +55,7 @@ mainTest('PF-98-1 Hide/show rulers via main menu', async ({ page }) => { await mainPage.clickViewMainMenuItem(); await mainPage.clickHideRulersMainMenuSubItem(); await mainPage.clickViewportOnce(); - await expect(mainPage.viewport).toHaveScreenshot( - 'viewport-hidden-rulers.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('viewport-hidden-rulers.png'); await mainPage.clickMainMenuButton(); await mainPage.clickViewMainMenuItem(); await mainPage.clickShowRulersMainMenuSubItem(); @@ -79,42 +69,37 @@ mainTest( const mainPage = new MainPage(page); await mainPage.clickViewportTwice(); await mainPage.pressHideShowRulersShortcut(browserName); - await expect(mainPage.viewport).toHaveScreenshot( - 'viewport-hidden-rulers.png', - ); + await expect(mainPage.viewport).toHaveScreenshot('viewport-hidden-rulers.png'); await mainPage.pressHideShowRulersShortcut(browserName); await expect(mainPage.viewport).toHaveScreenshot('viewport-default.png'); }, ); -mainTest( - 'PF-101 Hide/show color palette - file library check', - async ({ page }) => { - const mainPage = new MainPage(page); - const colorPalettePage = new ColorPalettePage(page); - const assetsPanelPage = new AssetsPanelPage(page); - await assetsPanelPage.clickAssetsTab(); - await assetsPanelPage.clickAddFileLibraryColorButton(); - await colorPalettePage.setHex('#ffff00'); - await colorPalettePage.clickSaveColorStyleButton(); - await mainPage.clickViewportOnce(); - await mainPage.waitForChangeIsSaved(); +mainTest('PF-101 Hide/show color palette - file library check', async ({ page }) => { + const mainPage = new MainPage(page); + const colorPalettePage = new ColorPalettePage(page); + const assetsPanelPage = new AssetsPanelPage(page); + await assetsPanelPage.clickAssetsTab(); + await assetsPanelPage.clickAddFileLibraryColorButton(); + await colorPalettePage.setHex('#ffff00'); + await colorPalettePage.clickSaveColorStyleButton(); + await mainPage.clickViewportOnce(); + await mainPage.waitForChangeIsSaved(); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickShowColorPaletteMainMenuSubItem(); - await mainPage.isColorsPaletteDisplayed(); - await colorPalettePage.openColorPaletteMenu(); - await colorPalettePage.selectColorPaletteMenuOption('File library'); - await expect(mainPage.typographiesColorsBottomPanel).toHaveScreenshot( - 'colors-file-library.png', - ); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickHideColorPaletteMainMenuSubItem(); - await mainPage.isColorsPaletteNotDisplayed(); - }, -); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickShowColorPaletteMainMenuSubItem(); + await mainPage.isColorsPaletteDisplayed(); + await colorPalettePage.openColorPaletteMenu(); + await colorPalettePage.selectColorPaletteMenuOption('File library'); + await expect(mainPage.typographiesColorsBottomPanel).toHaveScreenshot( + 'colors-file-library.png', + ); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickHideColorPaletteMainMenuSubItem(); + await mainPage.isColorsPaletteNotDisplayed(); +}); mainTest.skip('PF-102 Hide/show board names', async ({ page }) => { // todo bug 6365 > need to check after fix @@ -133,64 +118,43 @@ mainTest.skip('PF-102 Hide/show board names', async ({ page }) => { await expect(mainPage.viewport).toHaveScreenshot('board-show-name.png'); }); -mainTest.skip( - 'PF-103-1 Hide/show pixel grid via main menu', - async ({ page }) => { - // todo bug 6365 > need to check after fix - const mainPage = new MainPage(page); - await mainPage.clickViewportTwice(); - await mainPage.increaseZoom(10); - await expect(mainPage.viewport).toHaveScreenshot( - 'canvas-show-pixel-grid.png', - ); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickHidePixelGridMainMenuSubItem(); - await expect(mainPage.viewport).toHaveScreenshot( - 'canvas-hide-pixel-grid.png', - ); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickShowPixelGridMainMenuSubItem(); - await expect(mainPage.viewport).toHaveScreenshot( - 'canvas-show-pixel-grid.png', - ); - }, -); +mainTest.skip('PF-103-1 Hide/show pixel grid via main menu', async ({ page }) => { + // todo bug 6365 > need to check after fix + const mainPage = new MainPage(page); + await mainPage.clickViewportTwice(); + await mainPage.increaseZoom(10); + await expect(mainPage.viewport).toHaveScreenshot('canvas-show-pixel-grid.png'); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickHidePixelGridMainMenuSubItem(); + await expect(mainPage.viewport).toHaveScreenshot('canvas-hide-pixel-grid.png'); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickShowPixelGridMainMenuSubItem(); + await expect(mainPage.viewport).toHaveScreenshot('canvas-show-pixel-grid.png'); +}); -mainTest( - 'PF-103-2 Hide/show pixel grid via shortcut SHIFT ,', - async ({ page }) => { - const mainPage = new MainPage(page); - await mainPage.clickViewportTwice(); - await mainPage.increaseZoom(10); - await expect(mainPage.viewport).toHaveScreenshot( - 'canvas-show-pixel-grid.png', - ); - await mainPage.pressHideShowPixelGridShortcut(); - await expect(mainPage.viewport).toHaveScreenshot( - 'canvas-hide-pixel-grid.png', - ); - await mainPage.pressHideShowPixelGridShortcut(); - await expect(mainPage.viewport).toHaveScreenshot( - 'canvas-show-pixel-grid.png', - ); - }, -); +mainTest('PF-103-2 Hide/show pixel grid via shortcut SHIFT ,', async ({ page }) => { + const mainPage = new MainPage(page); + await mainPage.clickViewportTwice(); + await mainPage.increaseZoom(10); + await expect(mainPage.viewport).toHaveScreenshot('canvas-show-pixel-grid.png'); + await mainPage.pressHideShowPixelGridShortcut(); + await expect(mainPage.viewport).toHaveScreenshot('canvas-hide-pixel-grid.png'); + await mainPage.pressHideShowPixelGridShortcut(); + await expect(mainPage.viewport).toHaveScreenshot('canvas-show-pixel-grid.png'); +}); -mainTest( - "PF-104 Hide/show UI via main menu and shortcut '/'", - async ({ page }) => { - const mainPage = new MainPage(page); - await expect(mainPage.viewport).toHaveScreenshot('canvas-show-ui.png'); - await mainPage.clickMainMenuButton(); - await mainPage.clickViewMainMenuItem(); - await mainPage.clickShowHideUIMainMenuSubItem(); - await expect(mainPage.viewport).toHaveScreenshot('canvas-hide-ui.png'); - await mainPage.pressHideShowUIShortcut(); - await expect(mainPage.viewport).toHaveScreenshot('canvas-show-ui.png'); - }, -); +mainTest("PF-104 Hide/show UI via main menu and shortcut '/'", async ({ page }) => { + const mainPage = new MainPage(page); + await expect(mainPage.viewport).toHaveScreenshot('canvas-show-ui.png'); + await mainPage.clickMainMenuButton(); + await mainPage.clickViewMainMenuItem(); + await mainPage.clickShowHideUIMainMenuSubItem(); + await expect(mainPage.viewport).toHaveScreenshot('canvas-hide-ui.png'); + await mainPage.pressHideShowUIShortcut(); + await expect(mainPage.viewport).toHaveScreenshot('canvas-show-ui.png'); +}); mainTest( 'PF-109 Select all via main menu and shortcut CTRL A', @@ -199,35 +163,23 @@ mainTest( await mainPage.createDefaultRectangleByCoordinates(250, 350); await mainPage.createDefaultEllipseByCoordinates(100, 600); await mainPage.clickViewportTwice(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layers-all-unselected.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layers-all-unselected.png', { + mask: [mainPage.guides], + }); await mainPage.clickMainMenuButton(); await mainPage.clickEditMainMenuItem(); await mainPage.clickSelectAllMainMenuSubItem(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layers-all-selected.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layers-all-selected.png', { + mask: [mainPage.guides], + }); await mainPage.clickViewportTwice(); - await expect(mainPage.viewport).toHaveScreenshot( - 'layers-all-unselected.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layers-all-unselected.png', { + mask: [mainPage.guides], + }); await mainPage.pressSelectAllShortcut(browserName); - await expect(mainPage.viewport).toHaveScreenshot( - 'layers-all-selected.png', - { - mask: [mainPage.guides], - }, - ); + await expect(mainPage.viewport).toHaveScreenshot('layers-all-selected.png', { + mask: [mainPage.guides], + }); }, ); diff --git a/tests/panels-features/panels-features-prototype.spec.js b/tests/panels-features/panels-features-prototype.spec.js index 47ad74b..695630e 100644 --- a/tests/panels-features/panels-features-prototype.spec.js +++ b/tests/panels-features/panels-features-prototype.spec.js @@ -4,9 +4,7 @@ const { expect, test } = require('@playwright/test'); const { random } = require('../../helpers/string-generator'); const { TeamPage } = require('../../pages/dashboard/team-page'); const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); -const { - PrototypePanelPage, -} = require('../../pages/workspace/prototype-panel-page'); +const { PrototypePanelPage } = require('../../pages/workspace/prototype-panel-page'); const { LayersPanelPage } = require('../../pages/workspace/layers-panel-page'); const teamName = random().concat('autotest'); @@ -65,25 +63,19 @@ test.describe(() => { }); }); - mainTest( - 'PF-144 Remove Interaction via Prototype panel', - async ({ page }) => { - const mainPage = new MainPage(page); - const prototypePanelPage = new PrototypePanelPage(page); - await prototypePanelPage.clickAddInteractionButton(); - await mainPage.waitForChangeIsSaved(); - await prototypePanelPage.isPrototypeArrowSecondConnectorDisplayed(); - await prototypePanelPage.clickRemoveSecondInteractionButton(); - await mainPage.waitForChangeIsSaved(); - await prototypePanelPage.isPrototypeArrowSecondConnectorNotDisplayed(); - await expect(page).toHaveScreenshot( - 'connector-between-board2-and-board1.png', - { - mask: [mainPage.usersSection], - }, - ); - }, - ); + mainTest('PF-144 Remove Interaction via Prototype panel', async ({ page }) => { + const mainPage = new MainPage(page); + const prototypePanelPage = new PrototypePanelPage(page); + await prototypePanelPage.clickAddInteractionButton(); + await mainPage.waitForChangeIsSaved(); + await prototypePanelPage.isPrototypeArrowSecondConnectorDisplayed(); + await prototypePanelPage.clickRemoveSecondInteractionButton(); + await mainPage.waitForChangeIsSaved(); + await prototypePanelPage.isPrototypeArrowSecondConnectorNotDisplayed(); + await expect(page).toHaveScreenshot('connector-between-board2-and-board1.png', { + mask: [mainPage.usersSection], + }); + }); mainTest('PF-152 Add 2nd Flow', async ({ page }) => { const mainPage = new MainPage(page); @@ -142,10 +134,7 @@ mainTest('PF-147 Change destination via Prototype panel', async ({ page }) => { await prototypePanelPage.clickFirstInteractionRecord(); await prototypePanelPage.selectInteractionDestination('Board #3'); await mainPage.waitForChangeIsSaved(); - await expect(page).toHaveScreenshot( - 'connector-between-board2-and-board3.png', - { - mask: [mainPage.usersSection], - }, - ); + await expect(page).toHaveScreenshot('connector-between-board2-and-board3.png', { + mask: [mainPage.usersSection], + }); });