Back to Details

diff

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese
Default branch: !
git symbolic-ref refs/remotes/origin/HEAD --short 2>/dev/null | sed 's|.*/||' || echo main
Report only what changed. Locate; don't fix. If no URL in 
$ARGUMENTS
, ask for one.
Parse 
$ARGUMENTS
: strip 
--branch <name>
if present → branch mode. If 
--branch
has no value, use the default branch above. Remainder is the URL.
默认分支：!
git symbolic-ref refs/remotes/origin/HEAD --short 2>/dev/null | sed 's|.*/||' || echo main
仅报告变更内容。定位问题；不自动修复。如果
$ARGUMENTS
中未包含URL，则提示用户输入。
解析
$ARGUMENTS
：如果存在
--branch <name>
参数则移除该部分，进入分支模式。如果
--branch
未指定值，则使用上述默认分支。剩余部分即为URL。

1. Audit

1. 审计

bash
PORT=$(npx -y @accesslint/chrome@latest ensure | node -e 'process.stdin.on("data",d=>process.stdout.write(""+JSON.parse(d).port))')
Stash mode (default — uncommitted changes). Tell the user first: "Running in diff mode — stashing your changes to capture a baseline, then restoring. Your working tree will be fully restored." If 
git stash push
fails, warn and exit.
bash
git stash push -u -m "accesslint-diff-baseline"
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --update-snapshot
git stash pop && sleep 2
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --format json
Branch mode (
--branch <name>
). Tell the user first: "Diffing against 
<name>
— checking out that branch to capture a baseline, then restoring. Your working tree will be fully restored."
Branch switching triggers a rebuild but not a browser reload — the CLI opens a fresh tab each time so it always reads the current build. Use 
--wait-for "<selector>"
to gate the audit until the rebuild is ready; without it, warn the user that a slow build may yield a stale baseline.
bash
git diff --quiet && git diff --cached --quiet || git stash push -u -m "accesslint-diff-branch"
git checkout <branch>
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --update-snapshot [--wait-for "<selector>"]
git checkout - && git stash pop 2>/dev/null
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --format json [--wait-for "<selector>"]
Pass 
--selector
, 
--include-aaa
to both runs.
bash
PORT=$(npx -y @accesslint/chrome@latest ensure | node -e 'process.stdin.on("data",d=>process.stdout.write(""+JSON.parse(d).port))')
暂存模式（默认——针对未提交的更改）。首先告知用户：「正在运行对比模式——将暂存您的更改以获取基线，之后会恢复您的工作区。您的工作树将完全恢复。」如果
git stash push
执行失败，则发出警告并退出。
bash
git stash push -u -m "accesslint-diff-baseline"
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --update-snapshot
git stash pop && sleep 2
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --format json
分支模式（
--branch <name>
）。首先告知用户：「正在与
<name>
分支进行对比——将检出该分支以获取基线，之后会恢复您的工作区。您的工作树将完全恢复。」
分支切换会触发重建，但不会刷新浏览器——CLI每次都会打开一个新标签页，以确保始终读取当前构建结果。使用
--wait-for "<selector>"
参数来等待重建完成后再执行审计；如果未使用该参数，则需提醒用户：构建速度过慢可能会导致基线数据过时。
bash
git diff --quiet && git diff --cached --quiet || git stash push -u -m "accesslint-diff-branch"
git checkout <branch>
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --update-snapshot [--wait-for "<selector>"]
git checkout - && git stash pop 2>/dev/null
npx -y @accesslint/cli@latest "<url>" --port "$PORT" --snapshot accesslint-diff --snapshot-dir /tmp --format json [--wait-for "<selector>"]
将
--selector
、
--include-aaa
参数传递给两次审计运行。

2. Report

2. 报告

Accessibility diff — http://localhost:3000/ vs main (94 rules, live DOM)
2 new · 1 fixed · 4 pre-existing hidden

New — Critical
- color-contrast — 2.1:1 (needs 4.5:1), #bbb on #fff
    where: main > p.subtitle   fix: darken to #767676
Fixed
- img-alt — <img src="old.jpg"> (no longer present)
Each new violation: where (selector verbatim + 
file:line (symbol)
if 
source
present — never fabricate), evidence, fix (mechanical change or 
NEEDS HUMAN
).
Don't edit. For fixes: apply mechanical ones then re-run 
accesslint:diff
to verify; for bulk work hand off to 
accesslint:audit
.
Accessibility diff — http://localhost:3000/ vs main (94 rules, live DOM)
2 new · 1 fixed · 4 pre-existing hidden

New — Critical
- color-contrast — 2.1:1 (needs 4.5:1), #bbb on #fff
    where: main > p.subtitle   fix: darken to #767676
Fixed
- img-alt — <img src="old.jpg"> (no longer present)
每个新增违规需包含：位置（原始选择器 + 若存在
source
则添加
file:line (symbol)
——切勿编造）、证据、修复方案（自动修复建议或
NEEDS HUMAN
（需人工处理））。
请勿编辑结果。对于修复：先应用自动修复建议，然后重新运行
accesslint:diff
进行验证；对于批量修复工作，请使用
accesslint:audit
。

3. Tear down

3. 清理

bash
npx -y @accesslint/chrome@latest stop --all  # skip if ensure reported "managed":false
bash
npx -y @accesslint/chrome@latest stop --all  # skip if ensure reported "managed":false

Gotchas

注意事项

  • ensure
    always determines the port — never hardcode 9222.
  • CLI exit 2 = bad URL or page never loaded; check the dev server.
  • Stash mode: 
    sleep 2
    covers most HMR cases; if baseline looks identical to current, add 
    --wait-for "<selector>"
    .
  • Branch mode: no HMR — CLI opens a fresh tab each run. 
    --wait-for
    is the rebuild gate.
  • Heavy DOM changes between runs cause selector drift — re-run with 
    accesslint:scan
    for the full picture.
  • ensure
    命令会自动确定端口——切勿硬编码为9222。
  • CLI退出码2表示URL无效或页面未加载；请检查开发服务器。
  • 暂存模式：
    sleep 2
    可覆盖大多数HMR（热模块替换）场景；如果基线与当前页面看起来完全一致，请添加
    --wait-for "<selector>"
    参数。
  • 分支模式：无HMR——CLI每次运行都会打开一个新标签页。
    --wait-for
    是等待重建完成的关键参数。
  • 两次运行之间DOM发生大量变更会导致选择器偏移——请使用
    accesslint:scan
    重新运行以获取完整结果。