0

我的任务是截取移动版网页的屏幕截图。

为此，我选择了 Selenide 和 Ashot。在桌面视图中一切正确。但是在页面的移动仿真视图中，存在一些问题。它显示了一张照片，但捕获了另一张照片。也许有人知道另一种解决方案，或者如何解决这个问题？

public class ChromeMobileEmulation implements WebDriverProvider {
    @Override
    public WebDriver createDriver(DesiredCapabilities desiredCapabilities) {

        Map<String, String> mobileEmulation = new HashMap<>();
        mobileEmulation.put("deviceName", "iPhone X");

        ChromeOptions chromeOptions = new ChromeOptions().setHeadless(true);
        chromeOptions.setExperimentalOption("mobileEmulation", mobileEmulation);
        chromeOptions.addArguments("--diagnostics", "--disable-blink-features");
        WebDriverManager.chromedriver().setup();

        return new ChromeDriver(chromeOptions);
    }

    @BeforeAll
    public static void setUp() throws IOException {
        propertyLoader();
        createFolders();

        SelenideLogger.addListener("allure", new AllureSelenide().screenshots(true).savePageSource(false));
        Configuration.browser = System.getProperty("browser");
        Configuration.timeout = 10000;

        RestAssured.filters(new AllureRestAssured());

        chromeMobile = new SelenideDriver(new SelenideConfig()
                .browser(ChromeMobileEmulation.class.getName())
                .headless(true)
                .browserSize("375x812"));
    }

    private Screenshot capturePage(int scrollTime) {
        return new AShot().shootingStrategy(viewportPasting(scrollTime)).takeScreenshot(getWebDriver());
    }

    protected void capturePageToVault(String pageName, String url, SelenideDriver driver, int scrollTime) throws IOException {
        driver.open(url);

        expected = capturePage(scrollTime, driver.getWebDriver());

        ImageIO.write(expected.getImage(), "png", expectedImg(pageName));

    }
}





WORKING SOLUTION FOR ME
private Screenshot capturePage(int scrollTime, WebDriver driver) {
        return new AShot()
                .coordsProvider(new WebDriverCoordsProvider())
                .shootingStrategy(viewportPasting(scaling(3), scrollTime))
                .takeScreenshot(driver);
    }
4

1 回答 1

2

如果您确实收到了屏幕截图，这是一个好兆头——您的代码至少可以工作。您没有提供足够的信息（屏幕截图、元素坐标等），但我相信您的缩放策略有问题。

何时发生此问题以及它的外观：

当您在新设备上截屏时，可能会发生截屏“捕获错误坐标”的情况。根据我的经验，当我在 Macbook Retina 显示器上执行测试时，会发生这种情况，并与非视网膜显示器的屏幕截图进行比较，或者在 Macbook 上执行代码，但浏览器是在非视网膜显示器上打开的。

我不是显示器专家（我希望有人能更好地解释这一点），但我相信这个问题的发生是由于以下原因之一：不同的显示器分辨率（你在一个或另一个显示器上有多少像素）或 ppi比率（每英寸像素）。

解决方案：

我建议您获取元素坐标并将其与截屏的坐标进行比较。如果您看到一些常见的乘数，例如“我的屏幕截图是元素的两倍”，那么您应该设置缩放策略：

new AShot()
  .shootingStrategy(ShootingStrategies.scaling(2))
  .takeScreenshot(webDriver);

可能您的问题类似于： Selenium: Not able to take complete page screenshot using aShot library

于 2019-11-19T19:54:05.243 回答