Merge pull request #446 from telekom/feature/device-emulation

Added helper method to use CDP device emulation

Author: martingrossmann

docs/src/docs/selenium4/selenium4-cdp.adoc

@@ -259,4 +259,41 @@ public class ChromeDevToolsTests extends TesterraTest implements
 
 ----
 
+== Set device emulation
 
+There is a simple implementation to emulate mobile devices.
+
+[source, java]
+----
+
+public class ChromeDevToolsTests extends TesterraTest implements
+        ChromeDevToolsProvider,
+        WebDriverManagerProvider {
+
+    @Test
+    public void test_CDP_GeoLocation() {
+        WebDriver webDriver = WEB_DRIVER_MANAGER.getWebDriver();
+
+        CHROME_DEV_TOOLS.setDevice(
+                webDriver,
+                new Dimension(400, 900),    // resolution
+                100,                        // Scale factor
+                true);                      // it's a mobile device
+
+        webDriver.get("...");
+    }
+
+}
+
+----
+
+If you need some more impact on device settings, you can use the origin method
+
+[source, java]
+----
+WebDriver webDriver = WEB_DRIVER_MANAGER.getWebDriver();
+DevTools devTools = CHROME_DEV_TOOLS.getRawDevTools(webDriver);
+devTools.send(Emulation.setDeviceMetricsOverride(...);
+----
+
+See here for more details: https://chromedevtools.github.io/devtools-protocol/tot/Emulation/#method-setDeviceMetricsOverride

driver-ui/src/main/java/eu/tsystems/mms/tic/testframework/pageobjects/internal/ResponsiveClassFinder.java

@@ -214,7 +214,9 @@ private static int getBrowserViewportSize(final WebDriver driver, final int view
             // mehrfaches auslesen verhindern, nur auslesen wenn nötig
             return viewportWidth;
         }
-        Object o = JSUtils.executeScript(driver, "return window.innerWidth");
+        // In case of using Chrome CDP device emulation
+        // https://developer.chrome.com/blog/visual-viewport-api
+        Object o = JSUtils.executeScript(driver, "return window.visualViewport.width");
         if (o instanceof Long) {
             int viewportWidthNew = (int) (long) (Long) o;
             LOGGER.debug(String.format("Browser viewport width is %dpx", viewportWidthNew));

driver-ui/src/main/java/eu/tsystems/mms/tic/testframework/testing/SeleniumChromeDevTools.java

@@ -23,6 +23,7 @@
 import eu.tsystems.mms.tic.testframework.logging.Loggable;
 import eu.tsystems.mms.tic.testframework.webdrivermanager.ChromeDevTools;
 import org.openqa.selenium.Credentials;
+import org.openqa.selenium.Dimension;
 import org.openqa.selenium.UsernameAndPassword;
 import org.openqa.selenium.WebDriver;
 import org.openqa.selenium.chrome.ChromeDriver;
@@ -90,6 +91,32 @@ public void setGeoLocation(WebDriver webDriver, double latitude, double longitud
         log().info("Changed geolocation information to lat={}, long={}", latitude, longitude);
     }
 
+    @Override
+    public void setDevice(WebDriver webDriver, Dimension dimension, int scaleFactor, boolean mobile) {
+        if (!isSupported(webDriver)) {
+            throw new RuntimeException("The current browser does not support DevTools");
+        }
+        DevTools devTools = this.getRawDevTools(webDriver);
+        devTools.send(Emulation.setDeviceMetricsOverride(
+                        dimension.getWidth(),
+                        dimension.getHeight(),
+                        100,
+                        true,
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty(),
+                        Optional.empty()
+                )
+        );
+        log().info("Changed device metrics to {}x{} with scale={}", dimension.getWidth(), dimension.getHeight(), scaleFactor);
+    }
+
     @Override
     public void setBasicAuthentication(WebDriver webDriver, Supplier<Credentials> credentials) {
         if (!isSupported(webDriver)) {

driver-ui/src/main/java/eu/tsystems/mms/tic/testframework/webdrivermanager/ChromeDevTools.java

@@ -23,6 +23,7 @@
 import eu.tsystems.mms.tic.testframework.constants.Browsers;
 import eu.tsystems.mms.tic.testframework.testing.WebDriverManagerProvider;
 import org.openqa.selenium.Credentials;
+import org.openqa.selenium.Dimension;
 import org.openqa.selenium.WebDriver;
 import org.openqa.selenium.devtools.DevTools;
 
@@ -40,6 +41,8 @@ public interface ChromeDevTools extends WebDriverManagerProvider {
 
     void setGeoLocation(WebDriver webDriver, double latitude, double longitude, int accuracy);
 
+    void setDevice(WebDriver webDriver, Dimension dimension, int scaleFactor, boolean mobile);
+
     void setBasicAuthentication(WebDriver webDriver, Supplier<Credentials> credentials);
 
     default boolean isSupported(WebDriver driver) {

integration-tests/src/test/java/eu/tsystems/mms/tic/testframework/playground/ChromeDevToolsTests.java

@@ -27,6 +27,7 @@
 import eu.tsystems.mms.tic.testframework.utils.TimerUtils;
 import eu.tsystems.mms.tic.testframework.webdrivermanager.DesktopWebDriverRequest;
 import org.openqa.selenium.By;
+import org.openqa.selenium.Dimension;
 import org.openqa.selenium.HasAuthentication;
 import org.openqa.selenium.JavascriptException;
 import org.openqa.selenium.UsernameAndPassword;
@@ -338,4 +339,13 @@ public void testT13_NetworkListener() {
         }
     }
 
+    @Test
+    public void testT14_MobileDeviceEmulation() {
+        WebDriver webDriver = WEB_DRIVER_MANAGER.getWebDriver();
+        CHROME_DEV_TOOLS.setDevice(webDriver, new Dimension(400, 900), 100, true);
+
+        webDriver.get("https://the-internet.herokuapp.com/broken_images");
+
+    }
+
 }