如何使用 selenium java webdriver 验证同一页面中的两个图像是否重叠。？

Question

如何使用 selenium webdriver 验证同一页面中的两个图像是否重叠。？ 我期望发生重叠时会抛出错误。

附上屏幕截图以便更好地理解。

在此输入图片描述 在此输入图片描述

Answer 1

代码：

package tests;

import org.openqa.selenium.By;
import org.openqa.selenium.Point;
import org.openqa.selenium.Rectangle;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;

import selenium.ChromeDriverSetup;

public class AmirsOverlappingTest extends ChromeDriverSetup {

    public static void main(String[] args) {
        
        WebDriver driver = startChromeDriver(); // wrapped driver init
        driver.get("https://www.stackoverflow.com");
        driver.findElement(By.xpath("//button[contains(@class,'js-accept-cookies')]")).click();
        
        WebElement topBar = driver.findElement(By.className("s-topbar--container"));
        WebElement topBarLogo = driver.findElement(By.xpath("//a[@class='s-topbar--logo js-gps-track']"));
        WebElement footer = driver.findElement(By.id("footer"));
        System.out.println("topBarLogo overlapping topBar: " + overlapping(topBarLogo, topBar));
        System.out.println("footer overlapping topBar: " + overlapping(footer, topBar));
        driver.quit();
    }
    
    public static Boolean overlapping(WebElement first, WebElement second) {
        Boolean overlap = false;
        
        Rectangle r1 = first.getRect();
        Point topLeft1 = first.getLocation();
        Point bottomRight1 = new Point(topLeft1.getX() + r1.getWidth(), topLeft1.getY() + r1.getHeight());
        
        Rectangle r2 = second.getRect();
        Point topLeft2 = second.getLocation();
        Point bottomRight2 = new Point(topLeft2.getX() + r2.getWidth(), topLeft2.getY() + r2.getHeight());
        
        if (topLeft1.getX() < bottomRight2.getX() && topLeft2.getX() < bottomRight1.getX() && topLeft1.getY() < bottomRight2.getY() && topLeft2.getY() < bottomRight1.getY()) {
            overlap = true;
        }
        
        if (topLeft1.getX() > bottomRight2.getX() && topLeft2.getX() > bottomRight1.getX() && topLeft1.getY() > bottomRight2.getY() && topLeft2.getY() > bottomRight1.getY()) {
            overlap = true;
        }
        return overlap;
    }

}

输出：

Starting ChromeDriver 108.0.5359.71 (1e0e3868ee06e91ad636a874420e3ca3ae3756ac-refs/branch-heads/5359@{#1016}) on port 24985
Only local connections are allowed.
Please see https://chromedriver.chromium.org/security-considerations for suggestions on keeping ChromeDriver safe.
ChromeDriver was started successfully.
Pro 21, 2022 3:16:14 ODP. org.openqa.selenium.remote.ProtocolHandshake createSession
INFO: Detected dialect: W3C
topBarLogo overlapping topBar: true
footer overlapping topBar: false