From 2cba34585bc6dc5dcf92484b8e6af79ce77af5e9 Mon Sep 17 00:00:00 2001 From: Diego Cardoso Date: Tue, 5 Nov 2024 15:18:10 +0200 Subject: [PATCH] feat: add position API to Dialog (#6782) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Sascha Ißbrücker --- .../dialog/tests/DialogTestPage.java | 9 +++- .../dialog/tests/DialogTestPageIT.java | 12 +++++ .../vaadin/flow/component/dialog/Dialog.java | 48 +++++++++++++++++++ .../flow/component/dialog/DialogTest.java | 10 ++++ 4 files changed, 78 insertions(+), 1 deletion(-) diff --git a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogTestPage.java b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogTestPage.java index 5fc4845ac01..3280b9f437f 100644 --- a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogTestPage.java +++ b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogTestPage.java @@ -214,6 +214,13 @@ private void createResizableDraggableDialog() { e -> dialog.open()); openDialog.setId("dialog-resizable-draggable-open-button"); + NativeButton setPosition = new NativeButton("set custom position", + e -> { + dialog.setTop("100px"); + dialog.setLeft("200px"); + }); + setPosition.setId("dialog-resizable-draggable-set-position-button"); + NativeButton sizeRestrictions = new NativeButton( "set resizing restrictions", e -> { dialog.setMinWidth("175px"); @@ -223,7 +230,7 @@ private void createResizableDraggableDialog() { }); sizeRestrictions.setId("dialog-resizing-restrictions-button"); - add(openDialog, message, sizeRestrictions); + add(openDialog, setPosition, message, sizeRestrictions); } private void changeDialogDimensions() { diff --git a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogTestPageIT.java b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogTestPageIT.java index 22643f4dcb2..b2e45d1a6d7 100644 --- a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogTestPageIT.java +++ b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogTestPageIT.java @@ -440,6 +440,18 @@ public void draggableDialog_shouldAllowDraggingFromDivContainer() { Assert.assertNotEquals(overlayTop, overlay.getCssValue("top")); } + @Test + public void setDialogPosition() { + findElement(By.id("dialog-resizable-draggable-set-position-button")) + .click(); + findElement(By.id("dialog-resizable-draggable-open-button")).click(); + + TestBenchElement dialogOverlay = $("*").id("overlay"); + TestBenchElement overlay = dialogOverlay.$("*").id("overlay"); + Assert.assertEquals("100px", overlay.getCssValue("top")); + Assert.assertEquals("200px", overlay.getCssValue("left")); + } + /** * Get the number for a css value with px suffix * diff --git a/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/main/java/com/vaadin/flow/component/dialog/Dialog.java b/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/main/java/com/vaadin/flow/component/dialog/Dialog.java index c72bb78926d..52297cb8410 100644 --- a/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/main/java/com/vaadin/flow/component/dialog/Dialog.java +++ b/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/main/java/com/vaadin/flow/component/dialog/Dialog.java @@ -138,6 +138,54 @@ public DialogCloseActionEvent(Dialog source, boolean fromClient) { } } + /** + * Gets the top position of the overlay. + * + * @return the top position of the overlay + */ + public String getTop() { + return getElement().getProperty("top"); + } + + /** + * Sets the top position of the overlay. If a unitless number is provided, + * pixels are assumed. + *

+ * Note that the overlay top edge may not be the same as the viewport top + * edge (e.g. the "Lumo" theme defines some spacing to prevent the overlay + * from stretching all the way to the top of the viewport). + * + * @param top + * the top position of the overlay + */ + public void setTop(String top) { + getElement().setProperty("top", top); + } + + /** + * Gets the left position of the overlay. + * + * @return the left position of the overlay + */ + public String getLeft() { + return getElement().getProperty("left"); + } + + /** + * Sets the distance of the overlay from the left of its container. If a + * unitless number is provided, pixels are assumed. + *

+ * Note that the overlay left edge may not be the same as the viewport left + * edge (e.g. the "Lumo" theme defines some spacing to prevent the overlay + * from stretching all the way to the left of the viewport). + * + * @param left + * the left position of the overlay + */ + public void setLeft(String left) { + getElement().setProperty("left", left); + } + /** * `resize` event is sent when the user finishes resizing the overlay. */ diff --git a/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/test/java/com/vaadin/flow/component/dialog/DialogTest.java b/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/test/java/com/vaadin/flow/component/dialog/DialogTest.java index dc8e7e928b3..a0cdf26907b 100644 --- a/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/test/java/com/vaadin/flow/component/dialog/DialogTest.java +++ b/vaadin-dialog-flow-parent/vaadin-dialog-flow/src/test/java/com/vaadin/flow/component/dialog/DialogTest.java @@ -382,6 +382,16 @@ public void open_close_notAutoAttachedInBeforeClientResponse() { Assert.assertNull(dialog.getElement().getParent()); } + @Test + public void position_setTopLeft_positionIsDefined() { + Dialog dialog = new Dialog(); + dialog.setTop("10px"); + dialog.setLeft("20px"); + + Assert.assertEquals("10px", dialog.getTop()); + Assert.assertEquals("20px", dialog.getLeft()); + } + private void fakeClientResponse() { ui.getInternals().getStateTree().runExecutionsBeforeClientResponse(); ui.getInternals().getStateTree().collectChanges(ignore -> {