3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-08-03 06:18:33 +02:00
Code Issues Projects Releases Packages Wiki Activity

✨ Add an integration test for #7686 (constraints dropdown)

Browse source
This commit is contained in:
Belén Albeza 2024-06-05 15:52:38 +02:00
parent c8ff8fcbf7
commit 4efab3e8c8
8 changed files with 479 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

17
frontend/playwright/ui/pages/WorkspacePage.js
View file

@ -45,12 +45,11 @@ export class WorkspacePage extends BaseWebSocketPage {
this.rootShape = page.locator(`[id="shape-00000000-0000-0000-0000-000000000000"]`);
this.rectShapeButton = page.getByRole("button", { name: "Rectangle (R)" });
this.colorpicker = page.getByTestId("colorpicker");
this.layers = page.getByTestId("layers");
}
async goToWorkspace() {
await this.page.goto(
`/#/workspace/${WorkspacePage.anyProjectId}/${WorkspacePage.anyFileId}?page-id=${WorkspacePage.anyPageId}`,
);
async goToWorkspace({ fileId = WorkspacePage.anyFileId, pageId = WorkspacePage.anyPageId } = {}) {
await this.page.goto(`/#/workspace/${WorkspacePage.anyProjectId}/${fileId}?page-id=${pageId}`);
this.#ws = await this.waitForNotificationsWebSocket();
await this.#ws.mockOpen();
@ -97,4 +96,14 @@ export class WorkspacePage extends BaseWebSocketPage {
await this.viewport.hover({ position: { x: x + width, y: y + height } });
await this.page.mouse.up();
}
async clickLeafLayer(name, clickOptions = {}) {
const layer = this.layers.getByText(name);
await layer.click(clickOptions);
}
async clickToggableLayer(name, clickOptions = {}) {
const layer = this.layers.getByTestId("layer-item").filter({ has: this.page.getByText(name) });
await layer.getByRole("button").click(clickOptions);
}
}

46
frontend/playwright/ui/specs/design-tab.spec.js Normal file
View file

@ -0,0 +1,46 @@
import { test, expect } from "@playwright/test";
import { WorkspacePage } from "../pages/WorkspacePage";
test.beforeEach(async ({ page }) => {
await WorkspacePage.init(page);
});
const multipleConstraintsFileId = `03bff843-920f-81a1-8004-756365e1eb6a`;
const multipleConstraintsPageId = `03bff843-920f-81a1-8004-756365e1eb6b`;
const setupFileWithMultipeConstraints = async (workspace) => {
await workspace.setupEmptyFile();
await workspace.mockRPC(/get\-file\?/, "design/get-file-multiple-constraints.json");
await workspace.mockRPC(
"get-file-object-thumbnails?file-id=*",
"design/get-file-object-thumbnails-multiple-constraints.json",
);
await workspace.mockRPC(
"get-file-fragment?file-id=*",
"design/get-file-fragment-multiple-constraints.json",
);
};
test.describe("Constraints", () => {
test("Constraint dropdown shows 'Mixed' when multiple layers are selected with different constraints", async ({
page,
}) => {
const workspace = new WorkspacePage(page);
await setupFileWithMultipeConstraints(workspace);
await workspace.goToWorkspace({
fileId: multipleConstraintsFileId,
pageId: multipleConstraintsPageId,
});
await workspace.clickToggableLayer("Board");
await workspace.clickLeafLayer("Ellipse");
await workspace.clickLeafLayer("Rectangle", { modifiers: ["Shift"] });
const constraintVDropdown = workspace.page.getByTestId("constraint-v-select");
await expect(constraintVDropdown).toContainText("Mixed");
const constraintHDropdown = workspace.page.getByTestId("constraint-h-select");
await expect(constraintHDropdown).toContainText("Mixed");
expect(false);
});
});