使用 Selenium 进行自动化无障碍测试

1. 概述

无障碍测试对于确保软件应用能被所有人（包括残障人士）使用至关重要。手动执行无障碍测试既耗时又容易出错。因此，使用 Selenium 自动化无障碍测试可以简化流程，更早地发现和修复无障碍问题。

本教程将探讨如何使用 Selenium 实现无障碍测试的自动化。

2. 什么是自动化无障碍测试？

自动化无障碍测试是使用自动化工具和脚本评估软件应用是否符合无障碍标准（如 WCAG 网页内容无障碍指南）的过程。

它能识别可能阻碍残障人士有效使用软件的无障碍障碍。

通过自动化这些测试，团队可以快速检测屏幕阅读器兼容性、键盘导航、颜色对比度等无障碍相关问题，确保应用更具包容性并符合法律要求。

3. 为什么选择 Selenium 进行无障碍自动化？

Selenium WebDriver 是流行的开源测试自动化框架。它能自动化 Chrome、Firefox、Edge 和 Safari 等主流浏览器，并与不同测试框架提供更好的灵活性和兼容性。

随着 Selenium 4 的发布，它已完全符合 W3C 标准。在许多国家，法律要求和行业标准（如网页内容无障碍指南）强制要求 Web 应用必须具备无障碍性。通过使用 Selenium 进行自动化无障碍测试，组织可以高效评估其对这些法规和标准的合规性。

4. 如何开始 Selenium 无障碍测试？

本节将学习如何在 LambdaTest 等平台提供的云网格上使用 Selenium 执行无障碍测试。

LambdaTest 是一个 AI 驱动的测试执行平台，允许开发人员和测试人员使用 Selenium 和 Cypress 等框架在 3000 多个真实环境中执行无障碍自动化。

要在 LambdaTest 上执行 Selenium 无障碍测试，需要启用无障碍自动化计划。

4.1. 测试场景

以下无障碍测试场景将在 LambdaTest 电子商务测试场网站上运行：

导航到 LambdaTest 电子商务测试场网站
悬停在 My Account 下拉菜单并点击 Login
输入有效的用户名和密码
执行断言检查登录成功后是否显示退出链接

4.2. 项目设置

在 pom.xml 文件中添加以下 Selenium 依赖：

<dependency>
    <groupId>org.seleniumhq.selenium</groupId>
    <artifactId>selenium-java</artifactId>
    <version>4.23.1</version>
</dependency>

最新版本可查看 Maven 中央仓库。

现在创建一个新的 ECommercePlayGroundAccessibilityTests 类：

public class ECommercePlayGroundAccessibilityTests {

    private RemoteWebDriver driver;
    //..
}

定义一个 setup() 方法来实例化 RemoteWebDriver：

@BeforeTest
public void setup() {
    final String userName = System.getenv("LT_USERNAME") == null 
      ? "LT_USERNAME" : System.getenv("LT_USERNAME");
    final String accessKey = System.getenv("LT_ACCESS_KEY") == null 
      ? "LT_ACCESS_KEY" : System.getenv("LT_ACCESS_KEY");
    final String gridUrl = "@hub.lambdatest.com/wd/hub";
    try {
        this.driver = new RemoteWebDriver(new URL(
          "http://" + userName + ":" + accessKey + gridUrl), 
          getChromeOptions());
    } catch (final MalformedURLException e) {
        System.out.println(
          "Could not start the remote session on LambdaTest cloud grid");
    }
    this.driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(30));
}

此方法需要 LambdaTest 用户名和访问密钥才能在 LambdaTest 云网格上运行测试。这些凭据可在 LambdaTest 的 Account Settings > Password & Security 中找到。

实例化 RemoteWebDriver 时，需要传递 BrowserVersion、PlatformName 等能力参数来运行测试：

public ChromeOptions getChromeOptions() {
    final var browserOptions = new ChromeOptions();
    browserOptions.setPlatformName("Windows 10");
    browserOptions.setBrowserVersion("127.0");
    final HashMap<String, Object> ltOptions = new HashMap<String, Object>();
    ltOptions.put("project", 
      "Automated Accessibility Testing With Selenium");
    ltOptions.put("build", 
      "LambdaTest Selenium Playground");
    ltOptions.put("name", 
      "Accessibility test");
    ltOptions.put("w3c", true);
    ltOptions.put("plugin", 
      "java-testNG");
    ltOptions.put("accessibility", true);
    ltOptions.put("accessibility.wcagVersion", 
      "wcag21");
    ltOptions.put("accessibility.bestPractice", false);
    ltOptions.put("accessibility.needsReview", true);

    browserOptions.setCapability(
      "LT:Options", ltOptions);

    return browserOptions;
}

在 LambdaTest 上进行无障碍测试时，需要添加 accessibility、accessibility.wcagVersion、accessibility.bestPractice 和 accessibility.needsReview 等能力参数。

生成能力参数可参考 LambdaTest 自动化能力生成器。

4.3. 测试实现

使用两个测试方法 testNavigationToLoginPage() 和 testLoginFunction() 实现测试场景。

以下是 testNavigationToLoginPage() 方法的代码片段：

@Test(priority = 1)
public void testNavigationToLoginPage() {
    driver.get("https://ecommerce-playground.lambdatest.io/");
    WebElement myAccountLink = driver.findElement(By.cssSelector(
      "#widget-navbar-217834 > ul > li:nth-child(6) > a"));
    Actions actions = new Actions(driver);
    actions.moveToElement(myAccountLink).build().perform();
    WebElement loginLink = driver.findElement(By.linkText("Login"));
    loginLink.click();

    String pageHeaderText = driver.findElement(By.cssSelector(
      "#content > div > div:nth-child(2) > div h2")).getText();
    assertEquals(pageHeaderText, "Returning Customer");
}

此测试实现了测试场景的前两个步骤：导航到 LambdaTest 电子商务测试场网站并悬停在 My account 链接上。由于优先级设置为“1”，此测试方法首先执行。

Selenium WebDriver 的 Actions 类的 moveToElement() 方法悬停在 My account 链接上。

菜单打开后，使用 linkText 定位 Login 链接并执行点击操作。最后执行断言检查登录页面是否成功加载。

现在查看 testLoginFunction() 方法的代码片段：

@Test(priority = 2)
public void testLoginFunction() {
    WebElement emailAddressField = driver.findElement(By.id(
      "input-email"));
    emailAddressField.sendKeys("user@example.com");
    WebElement passwordField = driver.findElement(By.id(
      "input-password"));
    passwordField.sendKeys("Password123");
    WebElement loginBtn = driver.findElement(By.cssSelector(
      "input.btn-primary"));
    loginBtn.click();

    WebElement myAccountLink = driver.findElement(By.cssSelector(
      "#widget-navbar-217834 > ul > li:nth-child(6) > a"));
    Actions actions = new Actions(driver);
    actions.moveToElement(myAccountLink).build().perform();
    WebElement logoutLink = driver.findElement(By.linkText("Logout"));
    assertTrue(logoutLink.isDisplayed());
}

此测试覆盖使用有效凭据登录并验证 Logout 链接的最后步骤。在 E-Mail Address 和 Password 字段输入凭据后，点击登录按钮。使用 moveToElement() 方法在 My Account 链接上执行鼠标悬停，并断言检查 Logout 链接是否可见。

4.4. 测试执行

以下 LambdaTest Web 自动化仪表板的截图显示了两个无障碍测试：

LambdaTest 无障碍测试执行结果

5. 结论

无障碍测试有助于发现网站或基于 Web 的应用程序可用性相关的缺陷。它使网站能被所有用户（包括残障人士）使用。

必须遵循 WCAG 制定的指南，使网站或 Web 应用具备无障碍性。之后，对网站进行无障碍测试至关重要，以确保网站和 Web 应用对每个人都可用。

本文使用的源代码可在 GitHub 上获取。

Persistence

REST

Security