You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Scaffold the action — Create apps/github-action/ in the monorepo. Use TypeScript with @actions/core and @actions/github packages. Define action.yml with inputs (token file path, thresholds, fail-on-error).
Define the config format — .colorxrc.json at repo root specifying color pairs and minimum thresholds:
Build the token parser — Read CSS files (extract custom properties), JSON token files (Style Dictionary format), or raw key-value pairs. Map them to hex values.
Run the audit — Import checkContrast and checkAPCA from @colorx/core. Validate every configured pair against its threshold.
Generate the report — Markdown table with pair name, WCAG ratio, APCA Lc, pass/fail badge. Include a summary line (e.g. "11/11 pairs passing" or "2 failures found").
Post as PR comment — Use @actions/github to post the report as a comment on the pull request via github.rest.issues.createComment(). Update existing comment on re-runs instead of creating duplicates.
Set check status — Fail the CI check (core.setFailed()) if any pair drops below its configured minimum. Pass with a success summary otherwise.
Add CVD warnings — Optional: flag pairs where the simulated CVD contrast drops below thresholds even if the original passes.
Test locally — Use act (local GitHub Actions runner) to test with sample repos containing token files.
GitHub Action
Steps
Scaffold the action — Create
apps/github-action/in the monorepo. Use TypeScript with@actions/coreand@actions/githubpackages. Defineaction.ymlwith inputs (token file path, thresholds, fail-on-error).Define the config format —
.colorxrc.jsonat repo root specifying color pairs and minimum thresholds:{ "pairs": [ { "fg": "--color-text", "bg": "--color-background", "wcag": "aa", "apca": 60 } ], "tokenFile": "tokens.json" }Build the token parser — Read CSS files (extract custom properties), JSON token files (Style Dictionary format), or raw key-value pairs. Map them to hex values.
Run the audit — Import
checkContrastandcheckAPCAfrom@colorx/core. Validate every configured pair against its threshold.Generate the report — Markdown table with pair name, WCAG ratio, APCA Lc, pass/fail badge. Include a summary line (e.g. "11/11 pairs passing" or "2 failures found").
Post as PR comment — Use
@actions/githubto post the report as a comment on the pull request viagithub.rest.issues.createComment(). Update existing comment on re-runs instead of creating duplicates.Set check status — Fail the CI check (
core.setFailed()) if any pair drops below its configured minimum. Pass with a success summary otherwise.Add CVD warnings — Optional: flag pairs where the simulated CVD contrast drops below thresholds even if the original passes.
Test locally — Use
act(local GitHub Actions runner) to test with sample repos containing token files.Write action README — Usage examples, input/output docs, badge markdown.
Publish to GitHub Marketplace — Tag a release, submit via the Actions marketplace flow.