mirror of
https://github.com/penpot/penpot.git
synced 2026-08-01 02:46:20 +00:00
48 lines
1.9 KiB
JavaScript
48 lines
1.9 KiB
JavaScript
import { test, expect } from "@playwright/test";
|
||
import { ViewerPage } from "../pages/ViewerPage";
|
||
|
||
// Issue 8257: outer stroke of a rotated board is cropped in View Mode.
|
||
// The SVG viewport must be large enough to contain the stroke of a rotated board.
|
||
// A 55° rotated board (80×120) with a 20px outer stroke has a rotated bounding box
|
||
// of ~144×134px. The viewport must be at least ~202×192px (bbox + stroke margin).
|
||
|
||
test.beforeEach(async ({ page }) => {
|
||
await ViewerPage.init(page);
|
||
});
|
||
|
||
const rotatedBoardFileId = "aa5cc0bb-91ff-81b9-8004-77df9cd3edb1";
|
||
const rotatedBoardPageId = "aa5cc0bb-91ff-81b9-8004-77df9cd3edb2";
|
||
|
||
test("Viewer shows full outer stroke of a rotated board without clipping", async ({
|
||
page,
|
||
}) => {
|
||
const viewer = new ViewerPage(page);
|
||
await viewer.setupLoggedInUser();
|
||
await viewer.setupFileWithRotatedBoardStroke();
|
||
|
||
await viewer.goToViewer({
|
||
fileId: rotatedBoardFileId,
|
||
pageId: rotatedBoardPageId,
|
||
});
|
||
|
||
// Wait for the viewer SVG to be rendered
|
||
const svg = page.locator("svg[class*='not-fixed']").first();
|
||
await expect(svg).toBeVisible();
|
||
|
||
// The SVG viewBox must be large enough to contain the rotated board plus its
|
||
// 20px outer stroke. For a 55° rotated board (80×120):
|
||
// - The axis-aligned bounding box of the rotated frame is ~144×134px
|
||
// - The outer stroke (20px) adds sqrt(2)*20 ≈ 29px margin on each side
|
||
// - So the viewport must be at least ~202×192px
|
||
//
|
||
// Before the fix, the viewer used the unrotated selrect (80×120) as the viewport,
|
||
// causing the stroke to be heavily clipped.
|
||
const viewBox = await svg.getAttribute("viewBox");
|
||
const [, , vbWidth, vbHeight] = viewBox.split(" ").map(Number);
|
||
|
||
// The unrotated selrect is 80×120. If the viewport is close to those dimensions,
|
||
// the stroke is being clipped (bug). The fixed viewport should be much larger.
|
||
expect(vbWidth).toBeGreaterThan(150);
|
||
expect(vbHeight).toBeGreaterThan(150);
|
||
});
|