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 <[email protected]> Co-authored-by: Tulio Garcia <[email protected]>
vaadin · May 18, 2021 · 88a90b3 · 88a90b3
1 parent 14676de
commit 88a90b3
Show file tree

Hide file tree

Showing 2 changed files with 68 additions and 19 deletions.
diff --git a/...on-tests/src/main/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutPage.java b/...on-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,31 +42,38 @@ 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();
                     }
                 });
         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<String> 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/...tion-tests/src/test/java/com/vaadin/flow/component/dialog/tests/DialogWithShortcutIT.java b/...tion-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) {