fix: Tooltip does not shrink when content changes (#11871)

Change-Id: I6b0cc0996560b2f8dd28e110e455445952c0fbd9

3 files changed, 132 insertions, 0 deletions

diff --git a/client/src/com/vaadin/client/VTooltip.java b/client/src/com/vaadin/client/VTooltip.java
index d61af537a9..edd1273bf5 100644
--- a/client/src/com/vaadin/client/VTooltip.java
+++ b/client/src/com/vaadin/client/VTooltip.java
@@ -132,6 +132,22 @@ public class VTooltip extends VOverlay {
         }
         if (info.getTitle() != null && !info.getTitle().isEmpty()) {
             description.setInnerHTML(info.getTitle());
+            /*
+             * Issue #11871: to correctly update the offsetWidth of description
+             * element we need to clear style width of it's parent DIV from old
+             * value (in some strange cases this width=[tooltip MAX_WIDTH] after
+             * tooltip text has been already updated to new shortly value:
+             * 
+             * <div class="popupContent"> <div style="width: 500px;"> <div
+             * class="v-errormessage" aria-hidden="true" style="display: none;">
+             * <div class="gwt-HTML"> </div> </div> <div
+             * class="v-tooltip-text">This is a short tooltip</div> </div>
+             * 
+             * and it leads to error during calculation offsetWidth (it is
+             * native GWT method getSubPixelOffsetWidth()) of description
+             * element")
+             */
+            description.getParentElement().getStyle().clearWidth();
             description.getStyle().clearDisplay();
         } else {
             description.setInnerHTML("");
@@ -151,6 +167,7 @@ public class VTooltip extends VOverlay {
             // in the right or bottom edge. For this reason the tooltip is moved
             // first to 0,0 position so that the calculation goes correctly.
             setPopupPosition(0, 0);
+
             setPopupPositionAndShow(new PositionCallback() {
                 @Override
                 public void setPosition(int offsetWidth, int offsetHeight) {
diff --git a/uitest/src/com/vaadin/tests/tooltip/TooltipWidthUpdating.java b/uitest/src/com/vaadin/tests/tooltip/TooltipWidthUpdating.java
new file mode 100644
index 0000000000..c5e49d1af3
--- /dev/null
+++ b/uitest/src/com/vaadin/tests/tooltip/TooltipWidthUpdating.java
@@ -0,0 +1,69 @@
+package com.vaadin.tests.tooltip;
+
+import com.vaadin.server.VaadinRequest;
+import com.vaadin.tests.components.AbstractTestUI;
+import com.vaadin.tests.util.LoremIpsum;
+import com.vaadin.ui.NativeButton;
+import com.vaadin.ui.TextField;
+import com.vaadin.ui.VerticalLayout;
+
+/**
+ * Test to see if the width of the tooltip element is updated if a narrower
+ * tooltip is opened to replace a tooltip with wider content.
+ * 
+ * @author Vaadin Ltd
+ */
+public class TooltipWidthUpdating extends AbstractTestUI {
+
+    private static final long serialVersionUID = 1L;
+    protected static final String SHORT_TOOLTIP_TEXT = "This is a short tooltip";
+    protected static final String LONG_TOOLTIP_TEXT = LoremIpsum.get(5000);
+    protected static final Integer MAX_WIDTH = 500;
+
+    @Override
+    protected void setup(VaadinRequest request) {
+        NativeButton componentWithShortTooltip = new NativeButton(
+                "Short tooltip");
+        componentWithShortTooltip.setDescription(SHORT_TOOLTIP_TEXT);
+        componentWithShortTooltip.setId("shortTooltip");
+
+        getTooltipConfiguration().setMaxWidth(MAX_WIDTH);
+        getTooltipConfiguration().setCloseTimeout(200);
+
+        NativeButton componentWithLongTooltip = new NativeButton("Long tooltip");
+        componentWithLongTooltip.setId("longTooltip");
+        componentWithLongTooltip.setDescription(LONG_TOOLTIP_TEXT);
+
+        VerticalLayout vl = new VerticalLayout();
+
+        TextField component1 = new TextField("TextField");
+        component1.setId("component1");
+        TextField component2 = new TextField("TextField");
+        TextField component3 = new TextField("TextField");
+        TextField component4 = new TextField("TextField");
+        TextField component5 = new TextField("TextField");
+        TextField component6 = new TextField("TextField");
+        TextField component7 = new TextField("TextField");
+        TextField component8 = new TextField("TextField");
+
+        // some count of any components should be added before (between) buttons
+        // to make defect reproducible
+        vl.addComponents(component1, component2, component2, component3,
+                component4, component5, component5, component6, component7,
+                component8);
+
+        getLayout().addComponents(componentWithShortTooltip, vl,
+                componentWithLongTooltip);
+    }
+
+    @Override
+    protected String getTestDescription() {
+        return "Tests that tooltip element width is updated if a narrower tooltip is opened to replace a tooltip with wider content";
+    }
+
+    @Override
+    protected Integer getTicketNumber() {
+        return 11871;
+    }
+
+}
diff --git a/uitest/src/com/vaadin/tests/tooltip/TooltipWidthUpdatingTest.java b/uitest/src/com/vaadin/tests/tooltip/TooltipWidthUpdatingTest.java
new file mode 100644
index 0000000000..150d0e070e
--- /dev/null
+++ b/uitest/src/com/vaadin/tests/tooltip/TooltipWidthUpdatingTest.java
@@ -0,0 +1,46 @@
+/*
+ * Copyright 2000-2013 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.tooltip;
+
+import static org.hamcrest.Matchers.lessThan;
+import static org.junit.Assert.assertThat;
+
+import org.junit.Test;
+import org.openqa.selenium.WebElement;
+
+import com.vaadin.testbench.By;
+import com.vaadin.tests.tb3.TooltipTest;
+
+public class TooltipWidthUpdatingTest extends TooltipTest {
+
+    @Test
+    public void testTooltipWidthUpdating() {
+        openTestURL();
+
+        WebElement btnLongTooltip = vaadinElementById("longTooltip");
+        WebElement btnShortTooltip = vaadinElementById("shortTooltip");
+
+        moveMouseToTopLeft(btnLongTooltip);
+        testBenchElement(btnLongTooltip).showTooltip();
+
+        moveMouseToTopLeft(btnShortTooltip);
+        testBenchElement(btnShortTooltip).showTooltip();
+
+        assertThat(getDriver().findElement(By.className("popupContent"))
+                .getSize().getWidth(), lessThan(TooltipWidthUpdating.MAX_WIDTH));
+    }
+
+}
\ No newline at end of file