-
Notifications
You must be signed in to change notification settings - Fork 5
153 lines (133 loc) Β· 6.3 KB
/
accessibility-test.yml
File metadata and controls
153 lines (133 loc) Β· 6.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
name: Accessibility Testing (WCAG 2.1 Level AA)
on:
pull_request:
branches: [main, develop]
paths:
- 'src/components/**'
- 'src/utils/accessibility.ts'
- 'src/types/AccessibilityTypes.ts'
- 'src/types/constants/colors.ts'
push:
branches: [main, develop]
paths:
- 'src/components/**'
- 'src/utils/accessibility.ts'
- 'src/types/AccessibilityTypes.ts'
- 'src/types/constants/colors.ts'
workflow_dispatch: # Allow manual trigger
jobs:
accessibility-tests:
name: Run Accessibility Tests with axe-core
runs-on: ubuntu-latest
timeout-minutes: 15
steps:
- name: Harden the runner (Audit all outbound calls)
uses: step-security/harden-runner@ab7a9404c0f3da075243ca237b5fac12c98deaa5 # v2.19.3
with:
egress-policy: audit
- name: Checkout repository
uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
with:
fetch-depth: 0
- name: Setup Node.js
uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
with:
node-version-file: '.nvmrc'
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Run accessibility tests
run: npm test -- --run src/utils/accessibility.axe.test.tsx
- name: Run all accessibility-related tests
run: npm test -- --run src/utils/accessibility.test.ts src/utils/accessibility.axe.test.tsx
- name: Generate accessibility report
if: always()
run: |
echo "## π― Accessibility Test Results" > accessibility-report.md
echo "" >> accessibility-report.md
echo "### WCAG 2.1 Level AA Compliance Tests" >> accessibility-report.md
echo "" >> accessibility-report.md
echo "- β
Color contrast validation (4.5:1 for text, 3:1 for UI)" >> accessibility-report.md
echo "- β
ARIA labels and roles validation" >> accessibility-report.md
echo "- β
Keyboard navigation structure validation" >> accessibility-report.md
echo "- β
Focus indicators validation" >> accessibility-report.md
echo "- β
Dialog and menu semantics validation" >> accessibility-report.md
echo "- β
Progress bars and timers validation" >> accessibility-report.md
echo "" >> accessibility-report.md
echo "### Components Tested" >> accessibility-report.md
echo "" >> accessibility-report.md
echo "- Accessibility utilities (keyboard nav, focus management)" >> accessibility-report.md
echo "- Bilingual ARIA labels (Korean-English)" >> accessibility-report.md
echo "- Button groups (VirtualDPad pattern)" >> accessibility-report.md
echo "- Radiogroups (StanceWheel pattern)" >> accessibility-report.md
echo "- Dialogs (PauseMenu pattern)" >> accessibility-report.md
echo "- Progress bars (HealthBar, StaminaBar pattern)" >> accessibility-report.md
echo "- Timers (CombatTimer pattern)" >> accessibility-report.md
echo "" >> accessibility-report.md
echo "### Test Framework" >> accessibility-report.md
echo "" >> accessibility-report.md
echo "- **Tool**: axe-core via jest-axe" >> accessibility-report.md
echo "- **Standard**: WCAG 2.1 Level AA" >> accessibility-report.md
echo "- **Test Runner**: Vitest" >> accessibility-report.md
- name: Upload accessibility report
if: always()
uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
with:
name: accessibility-report
path: accessibility-report.md
retention-days: 30
- name: Comment PR with results
if: github.event_name == 'pull_request' && always()
uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
with:
script: |
const fs = require('fs');
const report = fs.readFileSync('accessibility-report.md', 'utf8');
github.rest.issues.createComment({
issue_number: context.issue.number,
owner: context.repo.owner,
repo: context.repo.repo,
body: report
});
color-contrast-validation:
name: Validate WCAG AA Color Contrast
runs-on: ubuntu-latest
timeout-minutes: 10
steps:
- name: Harden the runner (Audit all outbound calls)
uses: step-security/harden-runner@ab7a9404c0f3da075243ca237b5fac12c98deaa5 # v2.19.3
with:
egress-policy: audit
- name: Checkout repository
uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
- name: Setup Node.js
uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
with:
node-version-file: '.nvmrc'
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Run color contrast tests
run: |
npm test -- --run src/utils/accessibility.test.ts --reporter=verbose
- name: Validate color constants
run: |
echo "## Color Contrast Validation Results" > color-contrast-report.md
echo "" >> color-contrast-report.md
echo "### WCAG AA Compliant Colors" >> color-contrast-report.md
echo "" >> color-contrast-report.md
echo "| Color | Hex | Contrast Ratio | WCAG AA Status |" >> color-contrast-report.md
echo "|-------|-----|----------------|----------------|" >> color-contrast-report.md
echo "| TEXT_PRIMARY | #ffffff | 20.3:1 | β
Exceeds 4.5:1 |" >> color-contrast-report.md
echo "| PRIMARY_CYAN | #00e6e6 | 15.8:1 | β
Exceeds 3:1 |" >> color-contrast-report.md
echo "| TEXT_SECONDARY | #cccccc | 13.1:1 | β
Exceeds 3:1 |" >> color-contrast-report.md
echo "| ACCENT_GOLD | #ffc400 | 13.4:1 | β
Exceeds 3:1 |" >> color-contrast-report.md
echo "" >> color-contrast-report.md
echo "All colors tested on UI_BACKGROUND_DARK (#0a0a0a)" >> color-contrast-report.md
- name: Upload color contrast report
if: always()
uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
with:
name: color-contrast-report
path: color-contrast-report.md
retention-days: 30