mirror of
https://github.com/penpot/penpotqa.git
synced 2024-08-04 09:28:54 +00:00
d8228410c2
test fixes
234 lines
7.9 KiB
JavaScript
234 lines
7.9 KiB
JavaScript
const { expect } = require('@playwright/test');
|
|
const { getPlatformName } = require('../helpers/get-platform');
|
|
|
|
exports.BasePage = class BasePage {
|
|
/**
|
|
* @param {import('@playwright/test').Page} page
|
|
*/
|
|
constructor(page) {
|
|
this.page = page;
|
|
this.header = page.locator('div[class*="dashboard-title"] h1');
|
|
this.successMessage = page.locator('div[class*="main_ui_messages__success"]');
|
|
this.infoMessage = page.locator('div[class="banner info fixed"]');
|
|
this.moveButton = page.locator('button[title="Move (V)"]');
|
|
this.savedChangesIcon = page.locator('div[title="Saved"]');
|
|
this.viewport = page.locator('div.viewport');
|
|
|
|
//Layer right-click menu items
|
|
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")',
|
|
);
|
|
this.hideLayerMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Hide")',
|
|
);
|
|
this.showLayerMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Show")',
|
|
);
|
|
this.focusOnLayerMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Focus on")',
|
|
);
|
|
this.transformToPathMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Transform to path")',
|
|
);
|
|
this.selectionToBoardMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Selection to board")',
|
|
);
|
|
this.createComponentMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Create component")',
|
|
);
|
|
this.createMultipleComponentsMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Create multiple components")',
|
|
);
|
|
this.flipVerticalMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Flip vertical")',
|
|
);
|
|
this.flipHorizontalMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Flip horizontal")',
|
|
);
|
|
this.editPathMenuItem = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Edit")',
|
|
);
|
|
this.addFlexLayout = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Add flex layout")',
|
|
);
|
|
this.removeFlexLayout = page.locator(
|
|
'ul[class*="workspace-context-menu"] li:has-text("Remove flex layout")',
|
|
);
|
|
this.deleteLayerMenuItem = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Delete")',
|
|
);
|
|
this.createComponentMenuItem = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Create component")',
|
|
);
|
|
this.updateMainComponentMenuItem = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Update main component")',
|
|
);
|
|
this.restoreMainComponentMenuItem = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Restore main component")',
|
|
);
|
|
this.createMultipleComponentsMenuItem = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Create multiple components")',
|
|
);
|
|
this.showInAssetsPanelOption = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Show in assets panel")',
|
|
);
|
|
this.createAnnotationOption = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Create annotation")',
|
|
);
|
|
this.duplicateOption = page.locator(
|
|
'ul[class*="workspace_context_menu"] span:has-text("Duplicate")',
|
|
);
|
|
}
|
|
|
|
async clearInput(input, browserName) {
|
|
await input.click();
|
|
if (getPlatformName() === 'MacOS') {
|
|
await this.page.keyboard.press('Meta+A');
|
|
} else {
|
|
if (browserName === 'webkit') {
|
|
await this.page.keyboard.press('Meta+A');
|
|
} else {
|
|
await this.page.keyboard.press('Control+A');
|
|
}
|
|
}
|
|
await this.page.keyboard.press('Delete');
|
|
}
|
|
|
|
async clickShortcutCtrlZ(browserName) {
|
|
if (getPlatformName() === 'MacOS') {
|
|
await this.page.keyboard.press('Meta+Z');
|
|
} else {
|
|
if (browserName !== 'webkit') {
|
|
await this.page.keyboard.press('Control+Z');
|
|
} else {
|
|
await this.page.keyboard.press('Meta+Z');
|
|
}
|
|
}
|
|
}
|
|
|
|
async reloadPage() {
|
|
await this.page.reload();
|
|
}
|
|
|
|
async clickOnEnter() {
|
|
await this.page.keyboard.press('Enter');
|
|
}
|
|
|
|
async isHeaderDisplayed(title) {
|
|
await expect(this.header).toHaveText(title);
|
|
}
|
|
|
|
async isSuccessMessageDisplayed(message) {
|
|
await expect(this.successMessage).toHaveText(message);
|
|
}
|
|
|
|
async waitSuccessMessageHidden() {
|
|
await this.successMessage.waitFor({ state: 'hidden' });
|
|
}
|
|
|
|
async waitInfoMessageHidden() {
|
|
await this.infoMessage.waitFor({ state: 'hidden' });
|
|
}
|
|
|
|
async clickMoveButton() {
|
|
await this.moveButton.click({ force: true });
|
|
}
|
|
|
|
async waitForChangeIsSaved() {
|
|
await this.savedChangesIcon.waitFor({ state: 'visible' });
|
|
}
|
|
|
|
async deleteLayerViaRightClick() {
|
|
await this.createdLayer.click({ button: 'right', force: true });
|
|
await this.deleteLayerMenuItem.click();
|
|
}
|
|
|
|
async hideLayerViaRightClickOnCanvas(title) {
|
|
const boardSel = this.page.locator(
|
|
`//*[text()="${title}"]//parent::*[@class="frame-title"]`,
|
|
);
|
|
await boardSel.click({ button: 'right', force: true });
|
|
await this.hideLayerMenuItem.click();
|
|
}
|
|
|
|
async focusBoardViaRightClickOnCanvas(title) {
|
|
const boardSel = this.page.locator(
|
|
`//*[text()="${title}"]//parent::*[@class="frame-title"]`,
|
|
);
|
|
await boardSel.click({ button: 'right', force: true });
|
|
await this.focusOnLayerMenuItem.click();
|
|
}
|
|
|
|
async focusLayerViaRightClickOnCanvas() {
|
|
await this.createdLayer.click({ button: 'right', force: true });
|
|
await this.focusOnLayerMenuItem.click();
|
|
}
|
|
|
|
async getLayerSelectorOnLayersTab(layer) {
|
|
return this.page.locator(
|
|
`//*[text()="${layer}"]//parent::div[contains(@class, "element-list-body")]`,
|
|
);
|
|
}
|
|
|
|
async focusLayerViaRightClickOnLayersTab(layer) {
|
|
const layerSel = await this.getLayerSelectorOnLayersTab(layer);
|
|
await layerSel.click({ button: 'right', force: true });
|
|
await this.focusOnLayerMenuItem.click();
|
|
}
|
|
|
|
async hideLayerViaRightClickOnLayersTab(layer) {
|
|
const layerSel = await this.getLayerSelectorOnLayersTab(layer);
|
|
await layerSel.click({ button: 'right', force: true });
|
|
await this.hideLayerMenuItem.click();
|
|
}
|
|
|
|
async unHideLayerViaRightClickOnLayersTab(layer) {
|
|
const layerSel = await this.getLayerSelectorOnLayersTab(layer);
|
|
await layerSel.click({ button: 'right', force: true });
|
|
await this.showLayerMenuItem.click();
|
|
}
|
|
|
|
async transformToPathViaRightClick() {
|
|
await this.createdLayer.click({ button: 'right', force: true });
|
|
await this.transformToPathMenuItem.click();
|
|
}
|
|
|
|
async selectionToBoardViaRightClick() {
|
|
await this.createdLayer.click({ button: 'right', force: true });
|
|
await this.selectionToBoardMenuItem.click();
|
|
}
|
|
|
|
async createComponentViaRightClick() {
|
|
const layerSel = this.page.locator('div[class="viewport"] [id^="shape"]');
|
|
await layerSel.last().click({ button: 'right', force: true });
|
|
await this.createComponentMenuItem.click();
|
|
}
|
|
|
|
async flipVerticalViaRightClick() {
|
|
await this.createdLayer.click({ button: 'right', force: true });
|
|
await this.flipVerticalMenuItem.click();
|
|
}
|
|
|
|
async flipHorizontalViaRightClick() {
|
|
await this.createdLayer.click({ button: 'right', force: true });
|
|
await this.flipHorizontalMenuItem.click();
|
|
}
|
|
|
|
async openNodesPanelViaRightClick() {
|
|
await this.createdLayer.click({ button: 'right', force: true });
|
|
await this.editPathMenuItem.click();
|
|
}
|
|
|
|
async addFlexLayoutViaRightClick() {
|
|
await this.createdBoardTitle.click({ button: 'right', force: true });
|
|
await this.addFlexLayout.click();
|
|
}
|
|
|
|
async removeFlexLayoutViaRightClick() {
|
|
await this.createdBoardTitle.click({ button: 'right', force: true });
|
|
await this.removeFlexLayout.click();
|
|
}
|
|
};
|