Fix for TextField focus problem with Valo in IE (#16491)

When clicking the text field with text, the caret was always moved to the beginning. Related also to ticket #11152.

Change-Id: I6dd8dcdc51892c2a4f51a9590d4ad435a8dbaba9

3 files changed, 115 insertions, 0 deletions

diff --git a/WebContent/VAADIN/themes/valo/components/_orderedlayout.scss b/WebContent/VAADIN/themes/valo/components/_orderedlayout.scss
index fb40763ade..8a7c877d69 100644
--- a/WebContent/VAADIN/themes/valo/components/_orderedlayout.scss
+++ b/WebContent/VAADIN/themes/valo/components/_orderedlayout.scss
@@ -43,6 +43,11 @@
   .v-horizontal > .v-expand > .v-slot {
     height: 100%;
   }
+  
+  /* Workaround for IE8+IE9 bug where clicking inside an input area which is inside a div with negative margin causes cursor position to jump to wrong position. See #11152 */ 
+  .v-horizontal > .v-expand > .v-slot { 
+     position: relative; 
+  } 
 
   .v-vertical > .v-spacing,
   .v-vertical > .v-expand > .v-spacing {
diff --git a/uitest/src/com/vaadin/tests/layouts/HorizontalLayoutAndCaretPosition.java b/uitest/src/com/vaadin/tests/layouts/HorizontalLayoutAndCaretPosition.java
new file mode 100644
index 0000000000..a8a25d03ce
--- /dev/null
+++ b/uitest/src/com/vaadin/tests/layouts/HorizontalLayoutAndCaretPosition.java
@@ -0,0 +1,65 @@
+/*
+ * Copyright 2000-2014 Vaadin Ltd.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.vaadin.tests.layouts;
+
+import com.vaadin.annotations.Theme;
+import com.vaadin.server.VaadinRequest;
+import com.vaadin.tests.components.AbstractTestUI;
+import com.vaadin.ui.HorizontalLayout;
+import com.vaadin.ui.Label;
+import com.vaadin.ui.TextField;
+
+/*
+ * Copyright 2000-2014 Vaadin Ltd.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+@Theme("valo")
+public class HorizontalLayoutAndCaretPosition extends AbstractTestUI {
+    @Override
+    protected void setup(VaadinRequest request) {
+        final HorizontalLayout root = new HorizontalLayout();
+        root.setSizeFull();
+        addComponent(root);
+        root.addComponent(new TextField());
+
+        Label l = new Label();
+        root.addComponent(l);
+        root.setExpandRatio(l, 1);
+        root.addComponent(new TextField());
+    }
+
+    @Override
+    protected String getTestDescription() {
+        return "Use IE. Enter some text to the text field. Clicking on the text should position the caret where you clicked, not cause it to jump to the start or the end";
+    }
+
+    @Override
+    protected Integer getTicketNumber() {
+        return 11152;
+    }
+
+}
diff --git a/uitest/src/com/vaadin/tests/layouts/HorizontalLayoutAndCaretPositionTest.java b/uitest/src/com/vaadin/tests/layouts/HorizontalLayoutAndCaretPositionTest.java
new file mode 100644
index 0000000000..df42e292e3
--- /dev/null
+++ b/uitest/src/com/vaadin/tests/layouts/HorizontalLayoutAndCaretPositionTest.java
@@ -0,0 +1,45 @@
+/*
+ * Copyright 2000-2014 Vaadin Ltd.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.vaadin.tests.layouts;
+
+import org.junit.Assert;
+import org.junit.Test;
+
+import com.vaadin.testbench.elements.TextFieldElement;
+import com.vaadin.tests.tb3.MultiBrowserTest;
+
+public class HorizontalLayoutAndCaretPositionTest extends MultiBrowserTest {
+
+    @Test
+    public void testCaretPositionOnClck() {
+        openTestURL();
+        TextFieldElement first = $(TextFieldElement.class).first();
+        // type in some text to the first field
+        first.click();
+        first.sendKeys("test");
+        // make sure that the field could be focused and text typed
+        Assert.assertEquals("Field must be focused on click", "test",
+                first.getValue());
+        // now move the focus to the next text field
+        $(TextFieldElement.class).get(1).click();
+        // and back to the first one
+        first.click(30, 10);
+        first.sendKeys("do_not_put_in_beginning_");
+        Assert.assertNotEquals("The caret position must be maintained",
+                "do_not_put_in_beginning_test", first.getValue());
+    }
+
+}