1702,1703,1706,1745 tests added
@ -104,6 +104,36 @@ exports.BasePage = class BasePage {
|
|||||||
this.detachInstanceOption = page.locator(
|
this.detachInstanceOption = page.locator(
|
||||||
'ul[class*="workspace_context_menu"] span:has-text("Detach instance")',
|
'ul[class*="workspace_context_menu"] span:has-text("Detach instance")',
|
||||||
);
|
);
|
||||||
|
this.duplicateRowMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Duplicate row")',
|
||||||
|
);
|
||||||
|
this.addRowAboveMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Add 1 row above")',
|
||||||
|
);
|
||||||
|
this.AddRowBelowMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Add 1 row below")',
|
||||||
|
);
|
||||||
|
this.deleteRowMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Delete row")',
|
||||||
|
).first();
|
||||||
|
this.deleteAndShapesRowMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Delete row and shapes")',
|
||||||
|
);
|
||||||
|
this.duplicateColumnMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Duplicate column")',
|
||||||
|
);
|
||||||
|
this.addColumnLeftMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Add 1 column to the left")',
|
||||||
|
);
|
||||||
|
this.AddColumnRightMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Add 1 column to the right")',
|
||||||
|
);
|
||||||
|
this.deleteColumnMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Delete column")',
|
||||||
|
).first();
|
||||||
|
this.deleteAndShapesColumnMenuItem = page.locator(
|
||||||
|
'ul[class*="workspace_context_menu"] li span:has-text("Delete column and shapes")',
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
async clearInput(input, browserName) {
|
async clearInput(input, browserName) {
|
||||||
|
@ -98,6 +98,8 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {
|
|||||||
this.flexElementPositionAbsolute = page.locator(
|
this.flexElementPositionAbsolute = page.locator(
|
||||||
'label[for=":absolute-position"] span',
|
'label[for=":absolute-position"] span',
|
||||||
);
|
);
|
||||||
|
this.flexAddLayoutButton = page.locator('button[data-type="flex"]');
|
||||||
|
this.gridAddLayoutButton = page.locator('button[data-type="grid"]');
|
||||||
this.gridEditButton = page.locator(
|
this.gridEditButton = page.locator(
|
||||||
'button[alt="Grid edit mode"]',
|
'button[alt="Grid edit mode"]',
|
||||||
);
|
);
|
||||||
@ -108,6 +110,9 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {
|
|||||||
this.layoutRemoveButton = page.locator(
|
this.layoutRemoveButton = page.locator(
|
||||||
'div[class*="layout_container__element-title"] button[class*="remove-layout"]',
|
'div[class*="layout_container__element-title"] button[class*="remove-layout"]',
|
||||||
);
|
);
|
||||||
|
this.layoutAddButton = page.locator(
|
||||||
|
'div[class*="layout_container__element-title"] button[class*="add-layout"]',
|
||||||
|
);
|
||||||
this.layoutDirectRowBtn = page.locator('label[title="Row"] span');
|
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.layoutDirectColumnBtn = page.locator('label[title="Column"] span');
|
||||||
@ -688,6 +693,13 @@ exports.DesignPanelPage = class DesignPanelPage extends BasePage {
|
|||||||
await this.layoutRemoveButton.click();
|
await this.layoutRemoveButton.click();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async addLayoutFromDesignPanel(layoutName) {
|
||||||
|
await this.layoutAddButton.click();
|
||||||
|
layoutName === 'flex'
|
||||||
|
? await this.flexAddLayoutButton.click()
|
||||||
|
: await this.gridAddLayoutButton.click();
|
||||||
|
}
|
||||||
|
|
||||||
async openGridEditModeFromDesignPanel() {
|
async openGridEditModeFromDesignPanel() {
|
||||||
await this.gridEditButton.click();
|
await this.gridEditButton.click();
|
||||||
}
|
}
|
||||||
|
@ -15,6 +15,7 @@ exports.InspectPanelPage = class InspectPanelPage extends BasePage {
|
|||||||
this.rowGapOnInspect = page.locator(
|
this.rowGapOnInspect = page.locator(
|
||||||
'div[class*="layout-row"] div[title="Row gap"]',
|
'div[class*="layout-row"] div[title="Row gap"]',
|
||||||
);
|
);
|
||||||
|
this.codeTabButton = page.locator('div[data-id="code"]');
|
||||||
}
|
}
|
||||||
|
|
||||||
async openInspectTab() {
|
async openInspectTab() {
|
||||||
@ -28,4 +29,8 @@ exports.InspectPanelPage = class InspectPanelPage extends BasePage {
|
|||||||
async isRowGapExistOnInspectTab() {
|
async isRowGapExistOnInspectTab() {
|
||||||
await expect(this.rowGapOnInspect).toBeVisible();
|
await expect(this.rowGapOnInspect).toBeVisible();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async openCodeTab() {
|
||||||
|
await this.codeTabButton.click();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
@ -28,6 +28,8 @@ exports.MainPage = class MainPage extends BasePage {
|
|||||||
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');
|
this.guides = page.locator('.guides .new-guides');
|
||||||
this.guidesFragment = page.locator('.main_ui_workspace_sidebar__resize-area');
|
this.guidesFragment = page.locator('.main_ui_workspace_sidebar__resize-area');
|
||||||
|
this.gridEditorLabel = page.locator('input[class*="grid-editor-label"]');
|
||||||
|
this.gridEditorButton = page.locator('button[class*="grid-editor-button"]');
|
||||||
|
|
||||||
//Node panel
|
//Node panel
|
||||||
this.pathActionsBlock = page.locator('div[class$="path_actions__sub-actions"]');
|
this.pathActionsBlock = page.locator('div[class$="path_actions__sub-actions"]');
|
||||||
@ -893,4 +895,28 @@ exports.MainPage = class MainPage extends BasePage {
|
|||||||
await layerSel.last().click({ button: 'right', force: true });
|
await layerSel.last().click({ button: 'right', force: true });
|
||||||
await this.showInAssetsPanelOption.click();
|
await this.showInAssetsPanelOption.click();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async changeGridRowLabel(value) {
|
||||||
|
await this.gridEditorLabel.last().click();
|
||||||
|
await this.gridEditorLabel.last().fill(value);
|
||||||
|
await this.clickOnEnter();
|
||||||
|
}
|
||||||
|
|
||||||
|
async duplicateGridRow() {
|
||||||
|
await this.gridEditorLabel.last().hover();
|
||||||
|
await this.gridEditorButton.click();
|
||||||
|
await this.duplicateRowMenuItem.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
async deleteGridRow() {
|
||||||
|
await this.gridEditorLabel.last().hover();
|
||||||
|
await this.gridEditorButton.click();
|
||||||
|
await this.deleteRowMenuItem.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
async addGridRowBelow() {
|
||||||
|
await this.gridEditorLabel.last().hover();
|
||||||
|
await this.gridEditorButton.click();
|
||||||
|
await this.AddRowBelowMenuItem.click();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
@ -58,7 +58,6 @@ mainTest('PENPOT-1689,1696 Check grid lines, check edit mode in the right panel'
|
|||||||
mask: [mainPage.usersSection],
|
mask: [mainPage.usersSection],
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test.describe(() => {
|
test.describe(() => {
|
||||||
@ -346,23 +345,92 @@ test.describe(() => {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
mainTest('PENPOT-1706 Adding Flex Board', async ({ page }) => {
|
||||||
|
await designPanelPage.addLayoutFromDesignPanel('flex');
|
||||||
|
await designPanelPage.isFlexElementSectionOpened();
|
||||||
|
await expect(mainPage.viewport).toHaveScreenshot('board-with-flex-layout.png', {
|
||||||
|
mask: [mainPage.guides],
|
||||||
|
});
|
||||||
|
await expect(mainPage.fileRightSidebarAside).toHaveScreenshot(
|
||||||
|
'flex-layout-right-sidebar-image.png',
|
||||||
|
{
|
||||||
|
mask: [mainPage.usersSection],
|
||||||
|
},
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
mainTest('PENPOT-1715 Add grid lines, check edit mode and add the text', async ({ page }) => {
|
mainTest('PENPOT-1745 Check code section', async ({ page }) => {
|
||||||
await mainPage.createDefaultBoardByCoordinates(400, 400);
|
await mainPage.createDefaultRectangleByCoordinates(200, 200, true);
|
||||||
await designPanelPage.changeHeightAndWidthForLayer('300', '400');
|
await layersPanelPage.dragAndDropComponentToBoard('Rectangle');
|
||||||
await mainPage.waitForChangeIsSaved();
|
await mainPage.clickViewportOnce();
|
||||||
await mainPage.addGridLayoutViaRightClick();
|
await mainPage.clickCreatedBoardTitleOnCanvas();
|
||||||
await mainPage.waitForChangeIsSaved();
|
await mainPage.waitForChangeIsSaved();
|
||||||
await designPanelPage.isLayoutRemoveButtonExists();
|
await inspectPanelPage.openInspectTab();
|
||||||
await mainPage.clickViewportOnce();
|
await inspectPanelPage.openCodeTab();
|
||||||
await mainPage.clickCreatedBoardTitleOnCanvas();
|
await expect(mainPage.fileRightSidebarAside).toHaveScreenshot(
|
||||||
|
'right-sidebar-inspect-code-section-image.png',
|
||||||
await mainPage.createDefaultTextLayer();
|
{
|
||||||
await layersPanelPage.dragAndDropComponentToBoard('Hello World!');
|
mask: [mainPage.usersSection],
|
||||||
await mainPage.waitForChangeIsSaved();
|
},
|
||||||
|
);
|
||||||
await expect(mainPage.viewport).toHaveScreenshot('board-with-grid-text.png', {
|
});
|
||||||
mask: [mainPage.guides],
|
});
|
||||||
|
|
||||||
|
test.describe(() => {
|
||||||
|
test.beforeEach(async ({ page, browserName }, testInfo) => {
|
||||||
|
if (browserName === 'webkit') {
|
||||||
|
await testInfo.setTimeout(testInfo.timeout + 20000);
|
||||||
|
} else {
|
||||||
|
await testInfo.setTimeout(testInfo.timeout + 15000);
|
||||||
|
}
|
||||||
|
await mainPage.createDefaultBoardByCoordinates(400, 400);
|
||||||
|
await designPanelPage.changeHeightAndWidthForLayer('300', '400');
|
||||||
|
await mainPage.waitForChangeIsSaved();
|
||||||
|
await mainPage.addGridLayoutViaRightClick();
|
||||||
|
await mainPage.waitForChangeIsSaved();
|
||||||
|
await designPanelPage.isLayoutRemoveButtonExists();
|
||||||
|
await mainPage.clickViewportOnce();
|
||||||
|
await mainPage.clickCreatedBoardTitleOnCanvas();
|
||||||
|
});
|
||||||
|
|
||||||
|
mainTest('PENPOT-1715 Add grid lines, check edit mode and add the text', async ({ page }) => {
|
||||||
|
await mainPage.createDefaultTextLayer();
|
||||||
|
await layersPanelPage.dragAndDropComponentToBoard('Hello World!');
|
||||||
|
await mainPage.waitForChangeIsSaved();
|
||||||
|
|
||||||
|
await expect(mainPage.viewport).toHaveScreenshot('board-with-grid-text.png', {
|
||||||
|
mask: [mainPage.guides],
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
mainTest('PENPOT-1702 Check fraction units, three dots and check duplicate, add row, delete row', async ({ page }) => {
|
||||||
|
await designPanelPage.changeHeightAndWidthForLayer('600', '400');
|
||||||
|
await mainPage.clickBoardOnCanvas();
|
||||||
|
await mainPage.doubleClickBoardOnCanvas();
|
||||||
|
await mainPage.duplicateGridRow();
|
||||||
|
await mainPage.waitForChangeIsSaved();
|
||||||
|
await expect(mainPage.viewport).toHaveScreenshot('board-with-duplicated-row.png', {
|
||||||
|
mask: [mainPage.guides],
|
||||||
|
});
|
||||||
|
await mainPage.deleteGridRow();
|
||||||
|
await mainPage.waitForChangeIsSaved();
|
||||||
|
await expect(mainPage.viewport).toHaveScreenshot('board-with-delete-row.png', {
|
||||||
|
mask: [mainPage.guides],
|
||||||
|
});
|
||||||
|
await mainPage.addGridRowBelow();
|
||||||
|
await mainPage.waitForChangeIsSaved();
|
||||||
|
await expect(mainPage.viewport).toHaveScreenshot('board-with-add-row-below.png', {
|
||||||
|
mask: [mainPage.guides],
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
mainTest('PENPOT-1703 Check fraction units, change px column manual', async ({ page }) => {
|
||||||
|
await mainPage.clickBoardOnCanvas();
|
||||||
|
await mainPage.doubleClickBoardOnCanvas();
|
||||||
|
await mainPage.changeGridRowLabel('100 PX');
|
||||||
|
await mainPage.waitForChangeIsSaved();
|
||||||
|
await expect(mainPage.viewport).toHaveScreenshot('board-with-px-row.png', {
|
||||||
|
mask: [mainPage.guides],
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 25 KiB |
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 40 KiB |
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 42 KiB |
After Width: | Height: | Size: 49 KiB |