30 天 AI 测试挑战活动：第十六天：评估采用 AI 进行无障碍测试并分享你的发现

AI 技术在无障碍测试领域的应用日益增多，旨在帮助开发者和测试人员更高效地发现和解决可访问性问题。以下是一些可以用于无障碍测试的 AI 工具：

1. **Axe Core**：虽然 Axe Core 本身是一个自动化的可访问性测试库，它的企业版提供了一些 AI 驱动的功能，用于识别和解决可访问性问题。

2. **AccessiBe**：AccessiBe 使用 AI 来解决网站的可访问性问题。它能够自动识别和修复多种可访问性问题，如导航、键盘功能性以及屏幕阅读器优化等。

3. **UserWay**：UserWay 提供一个 AI 驱动的网站可访问性插件，能够自动解决多种可访问性问题，包括颜色对比度、字体大小、导航以及其他与可访问性相关的问题。

4. **Evinced**：Evinced 是一种开发工具，使用 AI 来帮助开发者在编码过程中识别可访问性问题。它可以集成到开发流程中，提供实时反馈和修复建议。

5. **Fable**：Fable 利用 AI 技术提供模拟真实用户的无障碍测试，特别是针对有视觉和运动障碍人士的测试。它能帮助开发者理解这些用户如何与他们的产品互动。

这些工具可以帮助组织在开发和测试过程中更早地发现并解决可访问性问题，确保他们的产品和服务对所有人都是可访问的。使用这些工具时，重要的是要结合人工测试和用户反馈，因为 AI 和自动化工具可能无法捕捉到所有类型的可访问性问题。

import { test } from '@playwright/test';
import { BatchInfo, Configuration, EyesRunner, VisualGridRunner, BrowserType, DeviceName, ScreenOrientation, Eyes, Target } from '@applitools/eyes-playwright';

export let Batch: BatchInfo;
export let Config: Configuration;
export let Runner: EyesRunner;

test.beforeAll(async() => {

    // Configure Applitools SDK to run on the Ultrafast Grid
    Runner = new VisualGridRunner({ testConcurrency: 5 });
    Batch = new BatchInfo({name: `Playwright Typescript Quickstart`});

    Config = new Configuration();
    Config.setBatch(Batch);
    Config.addBrowsers(
        { name: BrowserType.CHROME, width: 800, height: 600 },
        { name: BrowserType.FIREFOX, width: 1600, height: 1200 },
        { name: BrowserType.SAFARI, width: 1024, height: 768 },
        { chromeEmulationInfo: { deviceName: DeviceName.iPhone_11, screenOrientation: ScreenOrientation.PORTRAIT} },
        { chromeEmulationInfo: { deviceName: DeviceName.Nexus_10, screenOrientation: ScreenOrientation.LANDSCAPE} }
    )
});

test.describe('ACME Bank', () => {
    let eyes: Eyes;
    test.beforeEach(async ({ page }) => {
        eyes = new Eyes(Runner, Config);

        // Start Applitools Visual AI Test
        // Args: Playwright Page, App Name, Test Name, Viewport Size for local driver
        await eyes.open(page, 'ACME Bank', `Playwright Typescript: Quickstart`, { width: 1200, height: 600 })
    });
    
    test('log into a bank account', async ({ page }) => {
        await page.goto('https://sandbox.applitools.com/bank?layoutAlgo=true');

        // Full Page - Visual AI Assertion
        await eyes.check('Login page', Target.window().fully());

        await page.locator('id=username').fill('user');
        await page.locator('id=password').fill('password');
        await page.locator('id=log-in').click();
        await page.locator('css=.dashboardNav_navContainer__kA4wD').waitFor({state: 'attached'});

        // Full Page - Visual AI Assertion
        await eyes.check('Main page', Target.window().fully()
            .layoutRegions(
                '.dashboardOverview_accountBalances__3TUPB',
                '.dashboardTable_dbTable___R5Du'
            )
        );
    });

    test.afterEach(async () => {
        // End Applitools Visual AI Test
        await eyes.close();
    });
});

test.afterAll(async() => {
    // Wait for Ultrast Grid Renders to finish and gather results
    const results = await Runner.getAllTestResults();
    console.log('Visual test results', results);
});