From 88a90b310db78dbf31945056627760c91ebc0af7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pekka=20Hyv=C3=B6nen?= Date: Tue, 18 May 2021 10:30:28 +0300 Subject: [PATCH] chore: add IT for dialog shortcut and writing (#761) When a shortcut is added with listenOn(dialog), writing to an input (like TextField) inside the dialog should not be blocked. Related to vaadin/flow#10362 Co-authored-by: Manolo Carrasco Co-authored-by: Tulio Garcia <28783969+tulioag@users.noreply.github.com> --- .../dialog/tests/DialogWithShortcutPage.java | 30 +++++++--- .../dialog/tests/DialogWithShortcutIT.java | 57 +++++++++++++++---- 2 files changed, 68 insertions(+), 19 deletions(-) diff --git a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutPage.java b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutPage.java index 8107a334eba..fb077ec3e9b 100644 --- a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutPage.java +++ b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutPage.java @@ -7,6 +7,7 @@ import com.vaadin.flow.component.Key; import com.vaadin.flow.component.ShortcutRegistration; import com.vaadin.flow.component.Text; +import com.vaadin.flow.component.combobox.ComboBox; import com.vaadin.flow.component.dialog.Dialog; import com.vaadin.flow.component.html.Div; import com.vaadin.flow.component.html.Input; @@ -18,13 +19,13 @@ public class DialogWithShortcutPage extends VerticalLayout { public static final Key SHORTCUT_KEY = Key.KEY_X; - public static final String SHORTCUT = String.join("", - SHORTCUT_KEY.getKeys()); + public static final String SHORTCUT = "x"; public static final String EVENT_LOG = "event-log"; public static final String UI_BUTTON = "ui-button"; public static final String MODELESS_SHORTCUT_ON_UI = "modeless-shortcut-on-ui"; public static final String MODELESS_SHORTCUT_LISTEN_ON_DIALOG = "modeless-shortcur-listen-on-dialog"; public static final String LISTEN_ON_DIALOG = "listen-on-dialog"; + public static final String LISTEN_ON_DIALOG_ALLOW_DEFAULT = "listen-on-dialog-allow-default"; public static final String SHORTCUT_ON_UI = "shortcut-on-ui"; public static final String DIALOG_ID = "dialog"; public static final String REUSABLE_DIALOG = "reusable-dialog"; @@ -41,24 +42,30 @@ public DialogWithShortcutPage() { eventLog.setId(EVENT_LOG); final NativeButton modelessWithShortcutOnUi = new NativeButton( "Modeless with shortcut on UI", - e -> createAndOpenDialog(false).setModal(false)); + e -> createAndOpenDialog(false, true).setModal(false)); modelessWithShortcutOnUi.setId(MODELESS_SHORTCUT_ON_UI); final NativeButton modelessWithShortcutListenOnDialog = new NativeButton( "Modeless with shortcut listenOn(dialog)", - e -> createAndOpenDialog(true).setModal(false)); + e -> createAndOpenDialog(true, true).setModal(false)); modelessWithShortcutListenOnDialog .setId(MODELESS_SHORTCUT_LISTEN_ON_DIALOG); final NativeButton dialogWithShortcutListenOnDialog = new NativeButton( "Dialog with shortcut listenOn(dialog)", - e -> createAndOpenDialog(true)); + e -> createAndOpenDialog(true, true)); dialogWithShortcutListenOnDialog.setId(LISTEN_ON_DIALOG); + final NativeButton dialogWithShortcutListenOnDialogAllowBrowserDefault = new NativeButton( + "Dialog with shortcut listenOn(dialog).allowBrowserDefault()", + e -> createAndOpenDialog(true, false)); + dialogWithShortcutListenOnDialogAllowBrowserDefault + .setId(LISTEN_ON_DIALOG_ALLOW_DEFAULT); final NativeButton dialogWithShortcutOnUi = new NativeButton( - "Dialog with shortcut on UI", e -> createAndOpenDialog(false)); + "Dialog with shortcut on UI", + e -> createAndOpenDialog(false, true)); dialogWithShortcutOnUi.setId(SHORTCUT_ON_UI); final NativeButton reusableDialogButton = new NativeButton( "Reusable dialog", event -> { if (reusableDialog == null) { - reusableDialog = createAndOpenDialog(true); + reusableDialog = createAndOpenDialog(true, true); } else { reusableDialog.open(); } @@ -66,6 +73,7 @@ public DialogWithShortcutPage() { reusableDialogButton.setId(REUSABLE_DIALOG); add(modelessWithShortcutOnUi, modelessWithShortcutListenOnDialog, dialogWithShortcutOnUi, dialogWithShortcutListenOnDialog, + dialogWithShortcutListenOnDialogAllowBrowserDefault, reusableDialogButton); NativeButton nonDialogButton = new NativeButton( @@ -82,13 +90,16 @@ protected void onAttach(AttachEvent attachEvent) { attachEvent.getUI().setId(UI_ID); } - private Dialog createAndOpenDialog(boolean listenOnDialog) { + private Dialog createAndOpenDialog(boolean listenOnDialog, + boolean preventDefault) { int index = dialogCounter++; final String dialogId = DIALOG_ID + index; NativeButton myDialogButton = createDialogButton(); myDialogButton.setId(dialogId + "-button"); + final ComboBox comboBox = new ComboBox<>(); + comboBox.setItems("foo", "bar", "xxx"); Dialog dialog = new Dialog(new Div(new Div(new Text("" + index)), - myDialogButton, new Input())); + myDialogButton, new Input(), comboBox)); NativeButton closeButton = new NativeButton("Close", buttonClickEvent -> dialog.close()); dialog.add(closeButton); @@ -100,6 +111,7 @@ private Dialog createAndOpenDialog(boolean listenOnDialog) { if (listenOnDialog) { registration.listenOn(dialog); } + registration.setBrowserDefaultAllowed(!preventDefault); return dialog; } diff --git a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutIT.java b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutIT.java index 2df240c0a06..3ec4d634102 100644 --- a/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutIT.java +++ b/vaadin-dialog-flow-parent/vaadin-dialog-flow-integration-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutIT.java @@ -1,6 +1,12 @@ package com.vaadin.flow.component.dialog.tests; +import com.vaadin.flow.component.dialog.testbench.DialogElement; +import com.vaadin.flow.component.html.testbench.DivElement; +import com.vaadin.flow.component.html.testbench.InputTextElement; import com.vaadin.flow.component.html.testbench.NativeButtonElement; +import com.vaadin.flow.testutil.TestPath; +import com.vaadin.testbench.TestBenchElement; +import com.vaadin.tests.AbstractComponentIT; import org.junit.Assert; import org.junit.Before; import org.junit.Test; @@ -9,12 +15,6 @@ import org.openqa.selenium.WebElement; import org.openqa.selenium.interactions.Actions; -import com.vaadin.flow.component.dialog.testbench.DialogElement; -import com.vaadin.flow.component.html.testbench.DivElement; -import com.vaadin.flow.testutil.TestPath; -import com.vaadin.testbench.TestBenchElement; -import com.vaadin.tests.AbstractComponentIT; - @TestPath("vaadin-dialog/shortcuts") public class DialogWithShortcutIT extends AbstractComponentIT { @@ -121,6 +121,43 @@ public void twoModelessDialogsOpenedWithSameShortcutKeyOnListenOn_dialogWithFocu validateLatestShortcutEventOnDialog(4, 1); } + // vaadin/vaadin-flow#10362 + @Test + public void dialogWithShortcut_containsInput_shortcutDoesNotBlockInput() { + openDialogButton = $(NativeButtonElement.class) + .id(DialogWithShortcutPage.LISTEN_ON_DIALOG); + + openNewDialog(); + final InputTextElement dialogInput = getFirstDialogInput(); + dialogInput.focus(); + dialogInput.sendKeys("foo" + DialogWithShortcutPage.SHORTCUT + "bar"); + + validateLatestShortcutEventOnDialog(0, 0); + + // by default the shortcut does preventDefault + Assert.assertEquals("Shortcut did not update input value", "foobar", + getFirstDialogInput().getValue()); + } + + // vaadin/vaadin-flow#10362 + @Test + public void dialogWithShortcutAndAllowBrowserDefault_containsInput_shortcutDoesNotBlockInput() { + openDialogButton = $(NativeButtonElement.class) + .id(DialogWithShortcutPage.LISTEN_ON_DIALOG_ALLOW_DEFAULT); + + openNewDialog(); + final InputTextElement dialogInput = getFirstDialogInput(); + dialogInput.focus(); + dialogInput.sendKeys("foo" + DialogWithShortcutPage.SHORTCUT + "bar"); + + validateLatestShortcutEventOnDialog(0, 0); + + // shortcut key is registered + Assert.assertEquals("Shortcut did not update input value", + "foo" + DialogWithShortcutPage.SHORTCUT + "bar", + getFirstDialogInput().getValue()); + } + private void openNewDialog() { openDialogButton.click(); } @@ -129,14 +166,14 @@ private void closeDialog() { new Actions(getDriver()).sendKeys(Keys.ESCAPE).build().perform(); } - private TestBenchElement getFirstDialogInput() { + private InputTextElement getFirstDialogInput() { return getDialogInput(0); } - private TestBenchElement getDialogInput(int dialogIndex) { + private InputTextElement getDialogInput(int dialogIndex) { return $(DialogElement.class) - .id(DialogWithShortcutPage.DIALOG_ID + dialogIndex).$("input") - .first(); + .id(DialogWithShortcutPage.DIALOG_ID + dialogIndex) + .$(InputTextElement.class).first(); } private void pressShortcutKey(TestBenchElement elementToFocus) {