Disabled shadow divs. Instead use css box-shadow (#13885)

Change-Id: Ibf8888de795b08aed0446607165d7318f94ee6f4

14 files changed, 189 insertions, 13 deletions

diff --git a/WebContent/VAADIN/themes/base/common/common.scss b/WebContent/VAADIN/themes/base/common/common.scss
index 6ec85e3c6d..0a493e0356 100644
--- a/WebContent/VAADIN/themes/base/common/common.scss
+++ b/WebContent/VAADIN/themes/base/common/common.scss
@@ -11,6 +11,19 @@
 .v-caption {
 	cursor: default;
 }
+/* add box-shadows to overlay elements */
+.v-window {
+  box-shadow: 0 5px 18px 0 rgba(0, 0, 0, .5);
+}
+.v-datefield-popup,
+.v-filterselect-suggestpopup,
+.v-menubar-popup,
+.v-slider-feedback,
+.v-popupview-popup,
+.v-contextmenu  {
+	 box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .5);
+}
+
 body &.v-app .v-app-loading {
 	/* You can use this to provide indication for the user that the application is loading. */
 	/* It is applied to the same element as .v-app */
@@ -115,6 +128,7 @@ body &.v-app .v-app-loading {
 .v-tooltip {
 	cursor: default;
 	background: #fff;
+	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .5);
 }
 .v-tooltip-text {
 	overflow: auto;
diff --git a/WebContent/VAADIN/themes/base/shadow/shadow.scss b/WebContent/VAADIN/themes/base/shadow/shadow.scss
index 47bf4acfde..3c369d3fef 100644
--- a/WebContent/VAADIN/themes/base/shadow/shadow.scss
+++ b/WebContent/VAADIN/themes/base/shadow/shadow.scss
@@ -2,6 +2,12 @@
 
 .#{$primaryStyleName} {
 	position: absolute;
+	display: none;
+	pointer-events: none;
+	
+	.v-ie8 & {
+	  display: block;
+	}
 }
 
 .#{$primaryStyleName} .top-left {
diff --git a/WebContent/VAADIN/themes/base/window/window.scss b/WebContent/VAADIN/themes/base/window/window.scss
index 05f3b115ad..4e414379cf 100644
--- a/WebContent/VAADIN/themes/base/window/window.scss
+++ b/WebContent/VAADIN/themes/base/window/window.scss
@@ -125,6 +125,12 @@ div.#{$primaryStyleName}-header {
 /* Shadow for window */
 .v-shadow-window {
 	position: absolute;
+	display: none;
+	pointer-events: none;
+	
+	.v-ie8 & {
+	  display: block;
+	}
 }
 .v-shadow-window .top-left {
     position: absolute; overflow: hidden;
diff --git a/WebContent/VAADIN/themes/chameleon/common/common.scss b/WebContent/VAADIN/themes/chameleon/common/common.scss
index 382dff3325..b8233fc53b 100644
--- a/WebContent/VAADIN/themes/chameleon/common/common.scss
+++ b/WebContent/VAADIN/themes/chameleon/common/common.scss
@@ -100,7 +100,7 @@ $chameleon-line-height: 1.4;
 		-moz-border-radius: 4px;
 		overflow: hidden;
 		}
-	
+
 	.v-filterselect-suggestpopup,
 	.v-contextmenu,
 	.v-menubar-submenu {
diff --git a/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.scss b/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.scss
index 0531d0c9b5..0db478855d 100644
--- a/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.scss
+++ b/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.scss
@@ -25,5 +25,7 @@
 	background-image: url(../../img/grad-light-top2.png);
 	background-position: 0 -1px;
 	}
-
+.#{$primaryStyleName}-popup {
+	border-radius: 5px;
+ }
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/window/window.scss b/WebContent/VAADIN/themes/chameleon/components/window/window.scss
index 92ada43c90..16de81a785 100644
--- a/WebContent/VAADIN/themes/chameleon/components/window/window.scss
+++ b/WebContent/VAADIN/themes/chameleon/components/window/window.scss
@@ -1,5 +1,8 @@
 @mixin chameleon-window($primaryStyleName : v-window) {
 
+.#{$primaryStyleName} {
+	 border-radius: 3px;
+}
 .#{$primaryStyleName}-closebox,
 .#{$primaryStyleName}-restorebox,
 .#{$primaryStyleName}-maximizebox {
diff --git a/WebContent/VAADIN/themes/liferay/menubar/menubar.scss b/WebContent/VAADIN/themes/liferay/menubar/menubar.scss
index 448d7569c8..dd31608e79 100644
--- a/WebContent/VAADIN/themes/liferay/menubar/menubar.scss
+++ b/WebContent/VAADIN/themes/liferay/menubar/menubar.scss
@@ -58,7 +58,9 @@
 	text-shadow: 1px 1px #000;
 	background-color: #5b677d;
 }
-
+.v-menubar-popup {
+	border-radius: 5px;
+ }
 .v-menubar-menuitem-disabled,
 .v-menubar-submenu .v-menubar-menuitem-disabled,
 .v-menubar span.v-menubar-menuitem-disabled:hover,
diff --git a/WebContent/VAADIN/themes/liferay/window/window.scss b/WebContent/VAADIN/themes/liferay/window/window.scss
index 583a81d9e4..d78c69a72f 100644
--- a/WebContent/VAADIN/themes/liferay/window/window.scss
+++ b/WebContent/VAADIN/themes/liferay/window/window.scss
@@ -5,7 +5,6 @@
 }
 
 .v-window-wrap {
-	border: 1px solid #c8c9ca;
 	-webkit-border-radius: 4px;
 	-moz-border-radius: 4px;
 	border-radius: 4px;
diff --git a/WebContent/VAADIN/themes/reindeer/window/window.scss b/WebContent/VAADIN/themes/reindeer/window/window.scss
index 57bd2d4c12..66c80c6a44 100644
--- a/WebContent/VAADIN/themes/reindeer/window/window.scss
+++ b/WebContent/VAADIN/themes/reindeer/window/window.scss
@@ -2,9 +2,9 @@
 
 .#{$primaryStyleName} {
 	background: transparent;
+	border: 1px solid #808386;
 }
 .#{$primaryStyleName}-wrap {
-	border: 1px solid #808386;
 	-webkit-box-sizing: border-box;
 	-moz-box-sizing: border-box;
 	box-sizing: border-box;
@@ -48,8 +48,8 @@
 	height: 15px;
 }
 .#{$primaryStyleName}-closebox {
-	top: 12px;
-	right: 10px;
+	top: 11px;
+	right: 9px;
 	width: 15px;
 	height: 16px;
 	background: transparent;
@@ -63,8 +63,8 @@
 }
 .#{$primaryStyleName}-maximizebox,
 .#{$primaryStyleName}-restorebox {
-	top: 12px;
-	right: 28px;
+	top: 11px;
+	right: 27px;
 	width: 15px;
 	height: 16px;
 	background: transparent;
@@ -166,7 +166,9 @@
 /**
  Black style window -----------------------------
 **/
-
+.#{$primaryStyleName}-black {
+	border-radius: 8px;
+}
 .#{$primaryStyleName}-black {
 	.#{$primaryStyleName}-wrap {
 		border-color: #2e3030;
diff --git a/WebContent/VAADIN/themes/runo/common/common.scss b/WebContent/VAADIN/themes/runo/common/common.scss
index 36447d9593..c33b490411 100644
--- a/WebContent/VAADIN/themes/runo/common/common.scss
+++ b/WebContent/VAADIN/themes/runo/common/common.scss
@@ -38,6 +38,16 @@
 .v-window select {
 	padding: 0;
 }
+.v-window
+.v-datefield-popup,
+.v-filterselect-suggestpopup,
+.v-menubar-menuitem,
+.v-slider-popup,
+.v-tooltip-text,
+.v-popupview-popup,
+.v-contextmenu  {
+	box-shadow: 0 2px 5px 0 rgba(0,0,0, .28);
+}
 /* Custom tooltip */
 .v-tooltip {
 	background-color: #fffcdd;
diff --git a/WebContent/VAADIN/themes/runo/window/window.scss b/WebContent/VAADIN/themes/runo/window/window.scss
index 1a7cfd3b01..bf2081674c 100644
--- a/WebContent/VAADIN/themes/runo/window/window.scss
+++ b/WebContent/VAADIN/themes/runo/window/window.scss
@@ -1,5 +1,10 @@
 @mixin runo-window($primaryStyleName : v-window) {
 
+/* add box-shadows to an overlay element */
+.#{$primaryStyleName} {
+	box-shadow: 0 10px 24px 0 rgba(42, 45, 46, .4);
+	border-radius: 10px;
+}
 .#{$primaryStyleName} {
 	color: #464f52;
 	font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;
diff --git a/uitest/src/com/vaadin/tests/components/window/WindowMoveListenerTest.java b/uitest/src/com/vaadin/tests/components/window/WindowMoveListenerTest.java
index a2b5e0f139..e067ada818 100644
--- a/uitest/src/com/vaadin/tests/components/window/WindowMoveListenerTest.java
+++ b/uitest/src/com/vaadin/tests/components/window/WindowMoveListenerTest.java
@@ -23,16 +23,15 @@ public class WindowMoveListenerTest extends MultiBrowserTest {
 
         // I'd loved to use the header, but that doesn't work. Footer works
         // fine, though :)
-        WebElement windowHeader = getDriver().findElement(
+        WebElement windowFooter = getDriver().findElement(
                 By.className("v-window-footer"));
 
         final Point winPos = window.getLocation();
 
         // move window
-        Action a = new Actions(driver).clickAndHold(windowHeader)
+        Action a = new Actions(driver).clickAndHold(windowFooter)
                 .moveByOffset(100, 100).release().build();
         a.perform();
-
         assertNotEquals("Window was not dragged correctly.", winPos.x,
                 window.getLocation().x);
         assertNotEquals("Window was not dragged correctly.", winPos.y,
diff --git a/uitest/src/com/vaadin/tests/components/window/WindowShadow.java b/uitest/src/com/vaadin/tests/components/window/WindowShadow.java
new file mode 100644
index 0000000000..12e7899503
--- /dev/null
+++ b/uitest/src/com/vaadin/tests/components/window/WindowShadow.java
@@ -0,0 +1,59 @@
+/*
+ * 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.components.window;
+
+import com.vaadin.server.VaadinRequest;
+import com.vaadin.tests.components.AbstractTestUI;
+import com.vaadin.ui.UI;
+import com.vaadin.ui.Window;
+
+//Tests that  invisible divs don't overlap windows and don't block mouse events
+public class WindowShadow extends AbstractTestUI {
+
+    @Override
+    protected void setup(VaadinRequest request) {
+        Window wnd = createWindow();
+        wnd.setId("topwindow");
+        Window wnd2 = createWindow();
+        wnd2.setId("botwindow");
+        wnd.setPositionX(100);
+        wnd.setPositionY(100);
+        wnd2.setPositionX(100);
+        // Pick ycoord, that the top div of the Window overlaps with its footer
+        int yCoord = (int) (wnd.getPositionX() + wnd.getHeight() - 5);
+        wnd2.setPositionY(yCoord);
+        UI.getCurrent().addWindow(wnd);
+        UI.getCurrent().addWindow(wnd2);
+    }
+
+    private Window createWindow() {
+        Window wnd = new Window();
+        wnd.setHeight("200");
+        wnd.setWidth("200");
+        return wnd;
+    }
+
+    @Override
+    protected String getTestDescription() {
+        return "Popup window has shadow div elemetns, which overlaps other elements and blocks mouse events";
+    }
+
+    @Override
+    protected Integer getTicketNumber() {
+        return 13885;
+    }
+
+}
diff --git a/uitest/src/com/vaadin/tests/components/window/WindowShadowTest.java b/uitest/src/com/vaadin/tests/components/window/WindowShadowTest.java
new file mode 100644
index 0000000000..0bd6c9fa44
--- /dev/null
+++ b/uitest/src/com/vaadin/tests/components/window/WindowShadowTest.java
@@ -0,0 +1,69 @@
+/*
+ * 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.components.window;
+
+import java.awt.AWTException;
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.List;
+
+import org.junit.Test;
+import org.openqa.selenium.By;
+import org.openqa.selenium.Point;
+import org.openqa.selenium.WebElement;
+import org.openqa.selenium.interactions.HasInputDevices;
+import org.openqa.selenium.interactions.Mouse;
+import org.openqa.selenium.interactions.internal.Coordinates;
+import org.openqa.selenium.internal.Locatable;
+import org.openqa.selenium.remote.DesiredCapabilities;
+
+import com.vaadin.tests.tb3.MultiBrowserTest;
+
+public class WindowShadowTest extends MultiBrowserTest {
+
+    @Test
+    public void dragBackgroundWindow() throws AWTException, IOException,
+            InterruptedException {
+        openTestURL();
+        WebElement wnd = getDriver().findElement(By.id("topwindow"));
+        // There is some bug in Selenium. Can't move window using header
+        // need use footer instead.
+        WebElement wnd1Footer = wnd
+                .findElement(By.className("v-window-footer"));
+        Point startLoc = wnd.getLocation();
+        Coordinates footerCoordinates = ((Locatable) wnd1Footer)
+                .getCoordinates();
+        Mouse mouse = ((HasInputDevices) getDriver()).getMouse();
+        mouse.mouseDown(footerCoordinates);
+        mouse.mouseMove(footerCoordinates, 200, 200);
+        mouse.mouseUp(footerCoordinates);
+        Point endLoc = wnd.getLocation();
+        // don't compare to specific coordinate, because in IE9 and IE11
+        // the window position is random.
+        // So, checkt that the window was moved
+        org.junit.Assert.assertNotEquals(startLoc, endLoc);
+    }
+
+    // IE8 doesn't support shadow-box css rule
+    // ignore this browser in testing
+    @Override
+    public List<DesiredCapabilities> getBrowsersToTest() {
+        List<DesiredCapabilities> browsers = new ArrayList<DesiredCapabilities>(
+                getAllBrowsers());
+        browsers.remove(Browser.IE8.getDesiredCapabilities());
+        return browsers;
+    }
+}
\ No newline at end of file