PHP 怎么PHP 无障碍测试

wen PHP项目 2026-07-28 2

本文目录导读：

PHP 怎么PHP 无障碍测试

PHP无障碍测试的主要方法
总结建议

我来详细介绍一下PHP无障碍测试（Accessibility Testing）的方法和实践。

PHP无障碍测试的主要方法

使用自动化测试工具

<?php
// 使用 PHP WebDriver 进行无障碍测试
use Facebook\WebDriver\Remote\RemoteWebDriver;
use Facebook\WebDriver\Remote\DesiredCapabilities;
class AccessibilityTest extends PHPUnit\Framework\TestCase
{
    private $driver;
    private $axe;
    protected function setUp(): void
    {
        // 初始化 WebDriver
        $host = 'http://localhost:4444';
        $this->driver = RemoteWebDriver::create($host, DesiredCapabilities::chrome());
        // 初始化 axe-core（无障碍测试引擎）
        $this->axe = new AxeCore();
    }
    public function testHomePageAccessibility()
    {
        $this->driver->get('http://your-site.com');
        // 运行无障碍检查
        $result = $this->axe->analyze($this->driver);
        // 验证结果
        $this->assertCount(0, $result['violations'], 
            '发现无障碍问题: ' . json_encode($result['violations']));
    }
}

使用Pa11y工具集成

<?php
// 使用 Pa11y CLI 无障碍测试工具
class Pa11yTest
{
    public function runAccessibilityTests($url)
    {
        $command = "pa11y --reporter json " . escapeshellarg($url);
        $output = shell_exec($command);
        $results = json_decode($output, true);
        // 分析结果
        $issues = [];
        foreach ($results as $issue) {
            $issues[] = [
                'type' => $issue['type'],
                'code' => $issue['code'],
                'message' => $issue['message'],
                'selector' => $issue['selector']
            ];
        }
        return $issues;
    }
}

PHPUnit 无障碍测试框架

<?php
use PHPUnit\Framework\TestCase;
class AccessibilityHelper
{
    // WCAG 规则检查
    public static function checkAltAttribute($html)
    {
        $dom = new DOMDocument();
        @$dom->loadHTML($html);
        $images = $dom->getElementsByTagName('img');
        $errors = [];
        foreach ($images as $img) {
            if (!$img->hasAttribute('alt')) {
                $errors[] = '缺少alt属性';
            }
        }
        return $errors;
    }
    public static function checkFormLabels($html)
    {
        $dom = new DOMDocument();
        @$dom->loadHTML($html);
        $inputs = $dom->getElementsByTagName('input');
        $errors = [];
        foreach ($inputs as $input) {
            $id = $input->getAttribute('id');
            if ($id && !self::hasLabel($dom, $id)) {
                $errors[] = "输入框缺少对应label: {$id}";
            }
        }
        return $errors;
    }
}
class AccessibilityParserTest extends TestCase
{
    public function testImageAltAttributes()
    {
        $html = '<img src="test.jpg" />';
        $errors = AccessibilityHelper::checkAltAttribute($html);
        $this->assertEmpty($errors, '所有图片必须有alt属性');
    }
}

集成CI/CD流程

# .github/workflows/accessibility.yml
name: Accessibility Testing
on: [push, pull_request]
jobs:
  accessibility:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v2
    - name: Setup PHP
      uses: shivammathur/setup-php@v2
      with:
        php-version: '8.0'
    - name: Install dependencies
      run: composer install
    - name: Run axe-core tests
      run: |
        npm install -g axe-cli
        axe http://localhost:8000 --save report.json
    - name: Check results
      run: php check-accessibility.php report.json

使用Laravel Dusk（示例）

<?php
namespace Tests\Browser;
use Tests\DuskTestCase;
use Laravel\Dusk\Browser;
class AccessibilityTest extends DuskTestCase
{
    public function testPageAccessibility()
    {
        $this->browse(function (Browser $browser) {
            $browser->visit('/')
                    ->assertSee('Welcome');
            // 注入并运行axe-core
            $script = file_get_contents('node_modules/axe-core/axe.min.js');
            $browser->script($script);
            $results = $browser->script("
                return new Promise((resolve) => {
                    axe.run((err, results) => {
                        resolve(results);
                    });
                });
            ");
            $this->assertEmpty($results[0]['violations'], 
                '无障碍问题发现');
        });
    }
}

手动检查清单

<?php
class ManualAccessibilityCheck
{
    static $checklist = [
        '图片有alt文本',
        '表单元素有标签',
        '颜色对比度足够',
        '键盘可导航',
        '标题结构正确',
        'ARIA属性正确',
        '视频有字幕',
        '页面可缩放',
        '不用颜色传达信息',
        '错误提示清晰',
        '链接文本有含义',
        '表格有标题',
    ];
    public function generateReport($url)
    {
        $report = [
            'url' => $url,
            'date' => date('Y-m-d H:i:s'),
            'checks' => []
        ];
        foreach (self::$checklist as $item) {
            $report['checks'][] = [
                'name' => $item,
                'passed' => $this->checkItem($item),
                'notes' => '需要手动验证'
            ];
        }
        return $report;
    }
}

工具	用途	安装方式
axe-core	自动化测试	`npm install axe-core`
Pa11y	命令行测试	`npm install -g pa11y`
WAVE	浏览器扩展	浏览器插件
Lighthouse	性能+无障碍	Chrome DevTools
Tenon.io	API测试	Composer包

最佳实践

<?php
// 1. 编写无障碍测试用例
class WCAGComplianceTest extends TestCase
{
    protected static $wcagRules = [
        'alt-text' => '1.1.1',
        'label' => '1.3.1',
        'contrast' => '1.4.3',
        'keyboard' => '2.1.1'
    ];
    // 2. 使用数据驱动测试
    /** @dataProvider urlProvider */
    public function testPageAccessibility($url)
    {
        $results = $this->runAccessibilityCheck($url);
        $this->assertEmpty($results['critical'], 
            "页面 {$url} 有严重无障碍问题");
    }
    // 3. 自定义断言
    public function assertNoCriticalIssues($results)
    {
        $critical = array_filter($results, function($issue) {
            return $issue['impact'] === 'critical';
        });
        $this->assertEmpty($critical, '不应存在严重问题');
    }
}