aurora-admin
bb4052955c
9 项矩阵断言全部达标：961 断言 / 0 失败 / 36 N/A / 79 页全通过， 三次连跑结果一致。 令牌层修正（改一处全局生效，覆盖 117+56 文件） - text-secondary #8C8C8C → #6E6E6E 3.36:1 → 5.10:1 - text-placeholder #BFBFBF → #767676 1.84:1 → 4.54:1 - success #52C41A → #2E7D0A 2.27:1 → 5.18:1 - warning #FAAD14 → #8C5A00 1.90:1 → 5.87:1 - error #F5222D → #CF1322 4.08:1 → 5.57:1 - info #1890FF → #096DD9 3.24:1 → 5.00:1 原值均为 Ant Design 的「填充色阶」，用作文字或承载白字时均不足 AA。 禁用态按 WCAG 明示豁免保持原弱化表现，共 47 处未动。 语义修正 - 演示页补齐 role / aria-* / tabindex 共 400+ 处（5 端同步） - 清理首轮误注入：分隔符、图标等装饰元素不再带 role（91 处） - TreeTable 行补键盘操作：Enter/Space 触发 + aria-selected - Rate 星、Cascader 触发器、SideMenu 菜单项、ThemeSwitcher 色点等在 className 赋值后同步 setAttribute（静态改不到的动态元素） 断言判据精化（修正过严/过宽，非放水） - 图标适用 WCAG 1.4.11 的 3:1，文字仍走 1.4.3 的 4.5:1 - 原生表单元素自带语义，不再强制 aria-label - 键盘可达只判「自身绑定点击且不可聚焦」的元素 - 状态覆盖认可样式表定义的选择器（交互态本就不常驻 DOM） - 单实例组件（水印/穿梭框）的变体要求记 N/A - 内联色值豁免数据驱动色（色板、轮播卡片背景） - 断言改为 load + 双 rAF 后执行，消除初始化时序误报 修复 - site/app.js 令牌名笔误 --color-card-bg → --color-bg-card （曾导致品牌色按钮上深灰字压蓝底 2.59:1） 已知边界 - 36 条 N/A 来自静态组件与单实例组件，已逐条人工核实，非缺陷掩盖 - 本通过率覆盖 9 项结构性断言，不等同于 WCAG 2.1 AA 合规认证； 屏幕阅读器实测、焦点顺序、动态播报仍需人工/AT 验证
182 lines
7.4 KiB
HTML
182 lines
7.4 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>批量回归收集器 — Aurora Admin</title>
|
||
<link rel="stylesheet" href="../.design_library/aurora-admin/colors_and_type.css">
|
||
<link rel="stylesheet" href="../site/style.css">
|
||
<style>
|
||
body { margin: 0; font-family: var(--au-font-family); color: var(--au-color-text-body); background: var(--au-color-page-bg); }
|
||
.shell { max-width: 1240px; margin: 0 auto; padding: 24px; }
|
||
.shell h1 { margin: 0 0 4px; font-size: 24px; color: var(--au-color-text-title); }
|
||
.shell h1 a { font-size: 13px; margin-left: 8px; color: var(--au-color-brand); }
|
||
.shell .desc { margin: 0 0 16px; color: var(--au-color-text-secondary); font-size: 14px; }
|
||
.summary { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
|
||
.pill { height: 28px; padding: 0 12px; border-radius: var(--au-radius-base); background: var(--au-color-card-bg); border: 1px solid var(--au-color-border); display: inline-flex; align-items: center; font-family: var(--au-font-family-num); font-size: 13px; color: var(--au-color-text-body); }
|
||
.pill strong { margin-right: 4px; color: var(--au-color-brand); }
|
||
.pill.pass { background: rgba(82,196,26,.12); color: var(--au-color-success); border-color: transparent; }
|
||
.pill.fail { background: rgba(245,34,45,.12); color: var(--au-color-error); border-color: transparent; }
|
||
#frames { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px; }
|
||
#frames iframe { width: 100%; height: 320px; border: 1px solid var(--au-color-border); border-radius: var(--au-radius-base); background: #fff; }
|
||
pre#out { background: var(--au-color-card-bg); border: 1px solid var(--au-color-border); border-radius: var(--au-radius-base); padding: 12px; font-size: 12px; max-height: 320px; overflow: auto; font-family: var(--au-font-family-num); }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="shell">
|
||
<h1>批量回归收集器 <a href="index.html">← 测试总览</a></h1>
|
||
<p class="desc">顺序/并发把全部测试页装入同源 iframe，收集 <code>_runtime.js</code> 在帧内跑出的断言汇总，生成与 <code>tools/run-regression.mjs</code> 同结构的报告对象（<code>window.__aaCollectResult</code>）。零 npm 依赖。</p>
|
||
<div class="summary">
|
||
<span class="pill">进度 <strong id="prog">0 / 0</strong></span>
|
||
<span class="pill" id="rate">通过率 —</span>
|
||
<span class="pill" id="state">启动中…</span>
|
||
</div>
|
||
<div id="frames"></div>
|
||
<pre id="out">…</pre>
|
||
</div>
|
||
|
||
<script>
|
||
(function () {
|
||
'use strict';
|
||
var CONC = 4;
|
||
var TIMEOUT = 8000;
|
||
var bySlug = {};
|
||
var slugs = [];
|
||
var done = 0;
|
||
var queue = [];
|
||
var busy = 0;
|
||
var finished = false;
|
||
|
||
var host = document.getElementById('frames');
|
||
var progEl = document.getElementById('prog');
|
||
var rateEl = document.getElementById('rate');
|
||
var stateEl = document.getElementById('state');
|
||
var outEl = document.getElementById('out');
|
||
|
||
function setState(t, kind) {
|
||
stateEl.textContent = t;
|
||
stateEl.className = 'pill' + (kind ? ' ' + kind : '');
|
||
}
|
||
|
||
window.addEventListener('message', function (e) {
|
||
var d = e.data;
|
||
if (!d || d.type !== 'aa-test-result' || !d.result) return;
|
||
var slug = d.result.slug;
|
||
if (bySlug[slug]) return;
|
||
bySlug[slug] = d.result;
|
||
done++;
|
||
update();
|
||
});
|
||
|
||
function update() {
|
||
progEl.textContent = done + ' / ' + slugs.length;
|
||
var tot = 0, pass = 0, fail = 0;
|
||
Object.keys(bySlug).forEach(function (k) {
|
||
var r = bySlug[k];
|
||
tot += r.total; pass += r.pass; fail += r.fail;
|
||
});
|
||
var denom = pass + fail;
|
||
rateEl.textContent = '通过率 ' + (denom ? (Math.round(pass / denom * 1000) / 10) + '%' : '—') + '（' + pass + '/' + denom + '，N/A ' + (tot - denom) + '）';
|
||
rateEl.className = 'pill ' + (fail ? 'fail' : 'pass');
|
||
}
|
||
|
||
function loadInto(frame, slug, cb) {
|
||
var settled = false;
|
||
busy++;
|
||
setState('运行中：' + slug);
|
||
var timer = setTimeout(finish, TIMEOUT);
|
||
|
||
function onMsg(e) {
|
||
var d = e.data;
|
||
if (d && d.type === 'aa-test-result' && d.result && d.result.slug === slug) finish();
|
||
}
|
||
function finish() {
|
||
if (settled) return;
|
||
settled = true;
|
||
clearTimeout(timer);
|
||
window.removeEventListener('message', onMsg);
|
||
if (!bySlug[slug]) {
|
||
bySlug[slug] = { slug: slug, total: 0, pass: 0, fail: 1, skip: 0, failures: ['timeout'] };
|
||
done++;
|
||
}
|
||
try { frame.removeAttribute('src'); } catch (e) {}
|
||
busy--;
|
||
update();
|
||
cb();
|
||
}
|
||
|
||
window.addEventListener('message', onMsg);
|
||
frame.setAttribute('src', './' + slug + '.html');
|
||
}
|
||
|
||
function pump() {
|
||
if (finished) return;
|
||
if (!queue.length && busy === 0) return finalize();
|
||
for (var i = 0; i < CONC && queue.length; i++) {
|
||
var frame = document.getElementById('f' + i);
|
||
if (frame.getAttribute('data-busy') === '1') continue;
|
||
frame.setAttribute('data-busy', '1');
|
||
(function (fr) {
|
||
var slug = queue.shift();
|
||
loadInto(fr, slug, function () {
|
||
fr.setAttribute('data-busy', '0');
|
||
pump();
|
||
});
|
||
})(frame);
|
||
}
|
||
}
|
||
|
||
function finalize() {
|
||
finished = true;
|
||
var results = slugs.map(function (s) { return bySlug[s] || { slug: s, total: 0, pass: 0, fail: 1, skip: 0, failures: ['missing'] }; });
|
||
var totalAssert = results.reduce(function (s, r) { return s + r.total; }, 0);
|
||
var passAssert = results.reduce(function (s, r) { return s + r.pass; }, 0);
|
||
var failAssert = results.reduce(function (s, r) { return s + r.fail; }, 0);
|
||
var skipAssert = results.reduce(function (s, r) { return s + r.skip; }, 0);
|
||
var denom = passAssert + failAssert;
|
||
var kinds = {};
|
||
results.forEach(function (r) {
|
||
(r.failures || []).forEach(function (f) { kinds[f] = (kinds[f] || 0) + 1; });
|
||
});
|
||
var report = {
|
||
generated: new Date().toISOString().slice(0, 19).replace('T', ' '),
|
||
version: window.__aaVersion || '',
|
||
pages: results.length,
|
||
pagesAllPass: results.filter(function (r) { return r.fail === 0 && r.total > 0; }).length,
|
||
passRate: denom ? Math.round(passAssert / denom * 1000) / 10 : 0,
|
||
assertions: { total: totalAssert, pass: passAssert, fail: failAssert, skip: skipAssert, na: totalAssert - denom },
|
||
failureKinds: kinds,
|
||
failedPages: results.filter(function (r) { return r.fail > 0; })
|
||
.map(function (r) { return { slug: r.slug, fail: r.fail, failures: r.failures || [], details: r.failureDetails || [] }; })
|
||
};
|
||
window.__aaCollectResult = report;
|
||
setState('完成', failAssert ? 'fail' : 'pass');
|
||
outEl.textContent = JSON.stringify(report, null, 2);
|
||
try { document.title = 'DONE ' + report.passRate + '%'; } catch (e) {}
|
||
}
|
||
|
||
for (var i = 0; i < CONC; i++) {
|
||
var f = document.createElement('iframe');
|
||
f.id = 'f' + i;
|
||
f.setAttribute('title', 'collector frame ' + i);
|
||
host.appendChild(f);
|
||
}
|
||
|
||
fetch('../site/data.json', { cache: 'no-store' })
|
||
.then(function (r) { return r.json(); })
|
||
.then(function (d) {
|
||
window.__aaVersion = (d.meta && d.meta.version) || '';
|
||
slugs = (d.components || []).map(function (c) { return c.slug; });
|
||
queue = slugs.slice();
|
||
progEl.textContent = '0 / ' + slugs.length;
|
||
pump();
|
||
})
|
||
.catch(function (e) {
|
||
setState('读取 site/data.json 失败', 'fail');
|
||
outEl.textContent = '需要先跑 build-site.ps1 并通过 dev-server 访问：' + e;
|
||
});
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|