From c67fc468008fe89ae6d7889c266d33c28522786d Mon Sep 17 00:00:00 2001 From: Sergey Vinogradov Date: Mon, 13 Jan 2025 16:56:30 +0400 Subject: [PATCH 1/4] fix: set viewport-fit: cover to enable CSS env vars in PWAs --- .../java/com/vaadin/flow/component/page/Viewport.java | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java b/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java index 97abe9194f8..478e31b8f02 100644 --- a/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java +++ b/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java @@ -25,7 +25,7 @@ /** * Defines a viewport tag that will be added to the HTML of the host page of a * UI class. If no viewport tag has been defined, a default of - * width=device-width, initial-scale=1.0 is used. + * width=device-width, initial-scale=1.0, viewport-fit=cover is used. * * @author Vaadin Ltd * @since 1.0 @@ -42,20 +42,20 @@ *

* Recommended for a Responsive Web Design. */ - String DEFAULT = "width=device-width, initial-scale=1.0"; + String DEFAULT = "width=device-width, initial-scale=1.0, viewport-fit=cover"; /** * Sets the viewport to the height of the device rather than the rendered * space. */ - String DEVICE_HEIGHT = "height=device-height, initial-scale=1.0"; + String DEVICE_HEIGHT = "height=device-height, initial-scale=1.0, viewport-fit=cover"; /** * Sets the viewport at the width and height of the device. The device-width * and device-height properties are translated to 100vw and 100vh * respectively. */ - String DEVICE_DIMENSIONS = "width=device-width, height=device-height, initial-scale=1.0"; + String DEVICE_DIMENSIONS = "width=device-width, height=device-height, initial-scale=1.0, viewport-fit=cover"; /** * Gets the viewport tag content. From 3215223d932afe808c434b7abee7fe8e3d5b7913 Mon Sep 17 00:00:00 2001 From: Sergey Vinogradov Date: Mon, 13 Jan 2025 17:35:27 +0400 Subject: [PATCH 2/4] run formatter --- .../src/main/java/com/vaadin/flow/component/page/Viewport.java | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java b/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java index 478e31b8f02..8b9a29507d9 100644 --- a/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java +++ b/flow-server/src/main/java/com/vaadin/flow/component/page/Viewport.java @@ -25,7 +25,8 @@ /** * Defines a viewport tag that will be added to the HTML of the host page of a * UI class. If no viewport tag has been defined, a default of - * width=device-width, initial-scale=1.0, viewport-fit=cover is used. + * width=device-width, initial-scale=1.0, viewport-fit=cover is + * used. * * @author Vaadin Ltd * @since 1.0 From 397065efe2438aee73caf7113453abfbfe4b0db3 Mon Sep 17 00:00:00 2001 From: Sergey Vinogradov Date: Mon, 13 Jan 2025 18:18:17 +0400 Subject: [PATCH 3/4] fix tests --- .../com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java b/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java index 967a87a83bd..993410f181c 100644 --- a/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java +++ b/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java @@ -53,7 +53,7 @@ public void should_add_appShellAnnotations() { By.cssSelector("meta[name=viewport]")); Assert.assertNotNull(metaViewPort); Assert.assertEquals( - "width=device-width, height=device-height, initial-scale=1.0", + "width=device-width, height=device-height, initial-scale=1.0, viewport-fit: cover", metaViewPort.getAttribute("content")); } From 8de8c70753fbda4b71891f215987234b1455f05d Mon Sep 17 00:00:00 2001 From: Sergey Vinogradov Date: Mon, 13 Jan 2025 16:28:21 +0200 Subject: [PATCH 4/4] Fix tests --- .../com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java b/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java index 993410f181c..d70fbdf1ea2 100644 --- a/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java +++ b/flow-tests/test-ccdm/src/test/java/com/vaadin/flow/ccdmtest/IndexHtmlRequestHandlerIT.java @@ -53,7 +53,7 @@ public void should_add_appShellAnnotations() { By.cssSelector("meta[name=viewport]")); Assert.assertNotNull(metaViewPort); Assert.assertEquals( - "width=device-width, height=device-height, initial-scale=1.0, viewport-fit: cover", + "width=device-width, height=device-height, initial-scale=1.0, viewport-fit=cover", metaViewPort.getAttribute("content")); }