From 5f402ff7f4ebc646a247f1a9f3dfef6cc9580840 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Johannes=20Dahlstr=C3=B6m?= Date: Mon, 11 Feb 2013 16:03:21 +0200 Subject: [PATCH] Set the overlay container width and height to zero (#10860) * Fix body scrolling in touch devices that do not honor overflow: hidden Change-Id: Ia444d3c222094b9aa83ba31d5710eed9d9e549cc --- .../VAADIN/themes/base/common/common.scss | 7 ++- .../tests/overlays/OverlayTouchScrolling.java | 56 +++++++++++++++++++ 2 files changed, 62 insertions(+), 1 deletion(-) create mode 100644 uitest/src/com/vaadin/tests/overlays/OverlayTouchScrolling.java diff --git a/WebContent/VAADIN/themes/base/common/common.scss b/WebContent/VAADIN/themes/base/common/common.scss index fd4625606a..e7fdd3fe84 100644 --- a/WebContent/VAADIN/themes/base/common/common.scss +++ b/WebContent/VAADIN/themes/base/common/common.scss @@ -225,7 +225,12 @@ body &.v-app-loading { /* Enable kinetic scrolling on Mobile Safari 6 */ .v-ios.v-sa6 & .v-scrollable { - -webkit-overflow-scrolling: touch; + -webkit-overflow-scrolling: touch; +} + +&.v-overlay-container { + width: 0; + height: 0; } } \ No newline at end of file diff --git a/uitest/src/com/vaadin/tests/overlays/OverlayTouchScrolling.java b/uitest/src/com/vaadin/tests/overlays/OverlayTouchScrolling.java new file mode 100644 index 0000000000..fdcfdf7266 --- /dev/null +++ b/uitest/src/com/vaadin/tests/overlays/OverlayTouchScrolling.java @@ -0,0 +1,56 @@ +/* +@VaadinApache2LicenseForJavaFiles@ + */ + +package com.vaadin.tests.overlays; + +import com.vaadin.server.VaadinRequest; +import com.vaadin.tests.components.AbstractTestUI; +import com.vaadin.ui.Button; +import com.vaadin.ui.Button.ClickEvent; +import com.vaadin.ui.Component; +import com.vaadin.ui.CssLayout; +import com.vaadin.ui.Label; +import com.vaadin.ui.Notification; + +public class OverlayTouchScrolling extends AbstractTestUI { + + @Override + protected void setup(VaadinRequest request) { + + final CssLayout green = new CssLayout(); + green.setSizeFull(); + final CssLayout layout = new CssLayout() { + @Override + protected String getCss(Component c) { + return "background:green;"; + } + }; + layout.setSizeFull(); + layout.addComponent(green); + setContent(layout); + + Button button = new Button("Tap me with a touch device"); + button.addClickListener(new Button.ClickListener() { + @Override + public void buttonClick(ClickEvent event) { + + Notification + .show("Now close this and you can scroll in mad places."); + green.addComponent(new Label( + "Thank you for clicking, now scroll (with touch device) to area without green background, which shouldn't be possible.")); + } + }); + green.addComponent(button); + } + + @Override + protected String getTestDescription() { + return "Using overlays breaks top level scrolling on touch devices"; + } + + @Override + protected Integer getTicketNumber() { + return 10860; + } +} -- 2.39.5