mirror of
https://github.com/penpot/penpot.git
synced 2025-07-10 20:27:21 +02:00
🐛 Fix text auto height
This commit is contained in:
parent
f54497194a
commit
925af4e1e9
7 changed files with 2008 additions and 4 deletions
1858
frontend/playwright/data/render-wasm/get-multiple-texts-base.json
Normal file
1858
frontend/playwright/data/render-wasm/get-multiple-texts-base.json
Normal file
File diff suppressed because it is too large
Load diff
|
@ -158,7 +158,6 @@ test("Renders a file with multiple emoji", async ({ page }) => {
|
|||
pageId: "6bd7c17d-4f59-815e-8006-5e999f38f211",
|
||||
});
|
||||
|
||||
|
||||
await workspace.waitForFirstRender();
|
||||
await expect(workspace.canvas).toHaveScreenshot();
|
||||
});
|
||||
|
@ -175,3 +174,142 @@ test("Renders a file with texts with different alignments", async ({ page }) =>
|
|||
await workspace.waitForFirstRender();
|
||||
await expect(workspace.canvas).toHaveScreenshot();
|
||||
});
|
||||
|
||||
test("Updates text alignment edition - part 1", async ({ page }) => {
|
||||
const workspace = new WasmWorkspacePage(page);
|
||||
await workspace.setupEmptyFile();
|
||||
await workspace.mockGetFile("render-wasm/get-multiple-texts-base.json");
|
||||
|
||||
await workspace.goToWorkspace({
|
||||
id: "6bd7c17d-4f59-815e-8006-5c1f68846e43",
|
||||
pageId: "f8b42814-8653-81cf-8006-638aacdc3ffb",
|
||||
});
|
||||
await workspace.waitForFirstRender({ hideUI: false });
|
||||
await workspace.clickLeafLayer("Text 1");
|
||||
|
||||
const textOptionsButton = workspace.page.getByTestId("text-align-options-button");
|
||||
const autoWidthButton = workspace.page.getByTitle("Auto width");
|
||||
const autoHeightButton = workspace.page.getByTitle("Auto height");
|
||||
const alignMiddleButton = workspace.page.getByTitle("Align middle");
|
||||
const alignBottomButton = workspace.page.getByTitle("Align bottom");
|
||||
const alignRightButton = workspace.page.getByTitle("Align right (Ctrl+Alt+R)");
|
||||
|
||||
await textOptionsButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 1");
|
||||
await autoWidthButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 2");
|
||||
await autoHeightButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 3");
|
||||
await alignMiddleButton.click();
|
||||
await alignRightButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 4");
|
||||
await alignBottomButton.click();
|
||||
|
||||
await workspace.page.keyboard.press("Escape");
|
||||
await workspace.hideUI();
|
||||
|
||||
await expect(workspace.canvas).toHaveScreenshot({timeout: 10000});
|
||||
});
|
||||
|
||||
test("Updates text alignment edition - part 2", async ({ page }) => {
|
||||
const workspace = new WasmWorkspacePage(page);
|
||||
await workspace.setupEmptyFile();
|
||||
await workspace.mockGetFile("render-wasm/get-multiple-texts-base.json");
|
||||
|
||||
await workspace.goToWorkspace({
|
||||
id: "6bd7c17d-4f59-815e-8006-5c1f68846e43",
|
||||
pageId: "f8b42814-8653-81cf-8006-638aacdc3ffb",
|
||||
});
|
||||
await workspace.waitForFirstRender({ hideUI: false });
|
||||
await workspace.clickLeafLayer("Text 1");
|
||||
|
||||
const textOptionsButton = workspace.page.getByTestId("text-align-options-button");
|
||||
const alignTopButton = workspace.page.getByTitle("Align top");
|
||||
const alignMiddleButton = workspace.page.getByTitle("Align middle");
|
||||
const alignBottomButton = workspace.page.getByTitle("Align bottom");
|
||||
const alignCenterButton = workspace.page.getByTitle("Align center (Ctrl+Alt+T)");
|
||||
const alignJustifyButton = workspace.page.getByTitle("Justify (Ctrl+Alt+J)");
|
||||
const LTRButton = workspace.page.getByTitle("LTR");
|
||||
const RTLButton = workspace.page.getByTitle("RTL");
|
||||
|
||||
await textOptionsButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 5");
|
||||
await alignBottomButton.click();
|
||||
await alignTopButton.click();
|
||||
await alignCenterButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 6");
|
||||
await alignJustifyButton.click();
|
||||
await RTLButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 7");
|
||||
await alignJustifyButton.click();
|
||||
await RTLButton.click();
|
||||
await LTRButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 8");
|
||||
await alignMiddleButton.click();
|
||||
await alignJustifyButton.click();
|
||||
await RTLButton.click();
|
||||
|
||||
await workspace.page.keyboard.press("Escape");
|
||||
await workspace.hideUI();
|
||||
|
||||
await expect(workspace.canvas).toHaveScreenshot({timeout: 10000});
|
||||
});
|
||||
|
||||
test("Updates text alignment edition - part 3", async ({ page }) => {
|
||||
const workspace = new WasmWorkspacePage(page);
|
||||
await workspace.setupEmptyFile();
|
||||
await workspace.mockGetFile("render-wasm/get-multiple-texts-base.json");
|
||||
|
||||
await workspace.goToWorkspace({
|
||||
id: "6bd7c17d-4f59-815e-8006-5c1f68846e43",
|
||||
pageId: "f8b42814-8653-81cf-8006-638aacdc3ffb",
|
||||
});
|
||||
await workspace.waitForFirstRender({ hideUI: false });
|
||||
await workspace.clickLeafLayer("Text 1");
|
||||
|
||||
const textOptionsButton = workspace.page.getByTestId("text-align-options-button");
|
||||
const autoWidthButton = workspace.page.getByTitle("Auto width");
|
||||
const autoHeightButton = workspace.page.getByTitle("Auto height");
|
||||
const alignMiddleButton = workspace.page.getByTitle("Align middle");
|
||||
const alignBottomButton = workspace.page.getByTitle("Align bottom");
|
||||
const alignLeftButton = workspace.page.getByTitle("Align left (Ctrl+Alt+L)");
|
||||
const alignCenterButton = workspace.page.getByTitle("Align center (Ctrl+Alt+T)");
|
||||
const alignJustifyButton = workspace.page.getByTitle("Justify (Ctrl+Alt+J)");
|
||||
const RTLButton = workspace.page.getByTitle("RTL");
|
||||
|
||||
await textOptionsButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 9");
|
||||
await autoHeightButton.click();
|
||||
await alignBottomButton.click();
|
||||
await alignJustifyButton.click();
|
||||
await RTLButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 10");
|
||||
await alignBottomButton.click();
|
||||
await alignJustifyButton.click();
|
||||
await RTLButton.click();
|
||||
await autoWidthButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 11");
|
||||
await alignCenterButton.click();
|
||||
await alignBottomButton.click();
|
||||
|
||||
await workspace.clickLeafLayer("Text 12");
|
||||
await alignCenterButton.click();
|
||||
await alignLeftButton.click();
|
||||
await alignMiddleButton.click();
|
||||
|
||||
await workspace.page.keyboard.press("Escape");
|
||||
await workspace.hideUI();
|
||||
|
||||
await expect(workspace.canvas).toHaveScreenshot({timeout: 10000});
|
||||
});
|
Binary file not shown.
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
After Width: | Height: | Size: 28 KiB |
|
@ -324,6 +324,7 @@
|
|||
[:> grow-options opts]
|
||||
[:> icon-button* {:variant "ghost"
|
||||
:aria-label (tr "labels.options")
|
||||
:data-testid "text-align-options-button"
|
||||
:on-click toggle-more-options
|
||||
:icon "menu"}]]
|
||||
|
||||
|
|
|
@ -49,10 +49,17 @@ pub extern "C" fn get_text_dimensions() -> *mut u8 {
|
|||
|
||||
if let Type::Text(content) = &shape.shape_type {
|
||||
let paragraphs = content.get_skia_paragraphs(font_col);
|
||||
height = auto_height(¶graphs).ceil();
|
||||
m_width = max_width(¶graphs);
|
||||
if content.grow_type() == GrowType::AutoWidth {
|
||||
|
||||
match content.grow_type() {
|
||||
GrowType::AutoHeight => {
|
||||
height = auto_height(¶graphs).ceil();
|
||||
}
|
||||
GrowType::AutoWidth => {
|
||||
width = auto_width(¶graphs).ceil();
|
||||
height = auto_height(¶graphs).ceil();
|
||||
}
|
||||
GrowType::Fixed => {}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue