Take margin/border/padding into account when measuring ComboBox in IE (#17002)

Change-Id: I8fcf33b78ff239529b794d41088fd9d8aba5c518

1 files changed, 20 insertions, 3 deletions

diff --git a/client/src/com/vaadin/client/ui/VFilterSelect.java b/client/src/com/vaadin/client/ui/VFilterSelect.java
index 8d9e30ac6e..22eef57901 100644
--- a/client/src/com/vaadin/client/ui/VFilterSelect.java
+++ b/client/src/com/vaadin/client/ui/VFilterSelect.java
@@ -599,7 +599,8 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler,
                     + "]");
 
             Element menuFirstChild = menu.getElement().getFirstChildElement();
-            final int naturalMenuWidth = menuFirstChild.getOffsetWidth();
+            final int naturalMenuWidth = WidgetUtil
+                    .getRequiredWidth(menuFirstChild);
 
             if (popupOuterPadding == -1) {
                 popupOuterPadding = WidgetUtil
@@ -612,12 +613,18 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler,
             }
 
             if (BrowserInfo.get().isIE()) {
+                // Must take margin,border,padding manually into account for
+                // menu element as we measure the element child and set width to
+                // the element parent
+                int naturalMenuOuterWidth = naturalMenuWidth
+                        + getMarginBorderPaddingWidth(menu.getElement());
+
                 /*
                  * IE requires us to specify the width for the container
                  * element. Otherwise it will be 100% wide
                  */
-                int rootWidth = Math.max(desiredWidth, naturalMenuWidth)
-                        - popupOuterPadding;
+                int rootWidth = Math.max(desiredWidth - popupOuterPadding,
+                        naturalMenuOuterWidth);
                 getContainerElement().getStyle().setWidth(rootWidth, Unit.PX);
             }
 
@@ -1283,6 +1290,16 @@ public class VFilterSelect extends Composite implements Field, KeyDownHandler,
         sinkEvents(Event.ONPASTE);
     }
 
+    private static int getMarginBorderPaddingWidth(Element element) {
+        final ComputedStyle s = new ComputedStyle(element);
+        int[] margin = s.getMargin();
+        int[] border = s.getBorder();
+        int[] padding = s.getPadding();
+        return margin[1] + margin[3] + border[1] + border[3] + padding[1]
+                + padding[3];
+
+    }
+
     /*
      * (non-Javadoc)
      *