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

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 {

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;
+    }
+
+}

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());
+    }
+
+}