rails_accessibility_testing 1.4.3 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/ARCHITECTURE.md +212 -53
- data/CHANGELOG.md +118 -0
- data/GUIDES/getting_started.md +105 -77
- data/GUIDES/system_specs_for_accessibility.md +13 -12
- data/README.md +136 -36
- data/docs_site/getting_started.md +59 -69
- data/exe/a11y_live_scanner +361 -0
- data/exe/rails_server_safe +18 -1
- data/lib/generators/rails_a11y/install/install_generator.rb +137 -0
- data/lib/rails_accessibility_testing/accessibility_helper.rb +547 -24
- data/lib/rails_accessibility_testing/change_detector.rb +17 -104
- data/lib/rails_accessibility_testing/checks/base_check.rb +56 -7
- data/lib/rails_accessibility_testing/checks/heading_check.rb +138 -0
- data/lib/rails_accessibility_testing/checks/image_alt_text_check.rb +7 -7
- data/lib/rails_accessibility_testing/checks/interactive_elements_check.rb +11 -1
- data/lib/rails_accessibility_testing/cli/command.rb +3 -1
- data/lib/rails_accessibility_testing/config/yaml_loader.rb +1 -1
- data/lib/rails_accessibility_testing/engine/rule_engine.rb +49 -5
- data/lib/rails_accessibility_testing/error_message_builder.rb +63 -7
- data/lib/rails_accessibility_testing/middleware/page_visit_logger.rb +81 -0
- data/lib/rails_accessibility_testing/railtie.rb +22 -0
- data/lib/rails_accessibility_testing/rspec_integration.rb +176 -10
- data/lib/rails_accessibility_testing/version.rb +1 -1
- data/lib/rails_accessibility_testing.rb +8 -3
- metadata +7 -3
- data/lib/generators/rails_a11y/install/generator.rb +0 -51
- data/lib/rails_accessibility_testing/checks/heading_hierarchy_check.rb +0 -53
data/GUIDES/getting_started.md
CHANGED
|
@@ -15,6 +15,7 @@ Add to your `Gemfile`:
|
|
|
15
15
|
```ruby
|
|
16
16
|
group :development, :test do
|
|
17
17
|
gem 'rails_accessibility_testing'
|
|
18
|
+
gem 'rspec-rails', '~> 8.0' # Required for system specs
|
|
18
19
|
gem 'axe-core-capybara', '~> 4.0'
|
|
19
20
|
gem 'capybara', '~> 3.40'
|
|
20
21
|
gem 'selenium-webdriver', '~> 4.0'
|
|
@@ -22,7 +23,9 @@ group :development, :test do
|
|
|
22
23
|
end
|
|
23
24
|
```
|
|
24
25
|
|
|
25
|
-
**Important:**
|
|
26
|
+
**Important:**
|
|
27
|
+
- You must explicitly add `selenium-webdriver` to your Gemfile. It's not automatically included as a dependency.
|
|
28
|
+
- **RSpec Rails is required** - The generator creates system specs that require `rspec-rails`. If you're using Minitest, you'll need to manually create your accessibility tests.
|
|
26
29
|
|
|
27
30
|
Then run:
|
|
28
31
|
|
|
@@ -41,70 +44,13 @@ rails generate rails_a11y:install
|
|
|
41
44
|
This creates:
|
|
42
45
|
- `config/initializers/rails_a11y.rb` - Configuration
|
|
43
46
|
- `config/accessibility.yml` - Check settings
|
|
47
|
+
- `spec/system/all_pages_accessibility_spec.rb` - Comprehensive spec that tests all GET routes with smart change detection
|
|
44
48
|
- Updates `spec/rails_helper.rb` (if using RSpec)
|
|
49
|
+
- Updates `Procfile.dev` - Adds accessibility watch command (optional)
|
|
45
50
|
|
|
46
|
-
|
|
51
|
+
**Note:** If you already have system tests set up in your Rails application, you can skip to Step 3. If you need help configuring Capybara or installing Chrome, see the [FAQ section](#troubleshooting) below.
|
|
47
52
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
```ruby
|
|
51
|
-
# spec/support/driver.rb
|
|
52
|
-
require 'selenium-webdriver'
|
|
53
|
-
require 'capybara/rails'
|
|
54
|
-
require 'capybara/rspec'
|
|
55
|
-
|
|
56
|
-
# Configure Chrome options
|
|
57
|
-
browser_options = Selenium::WebDriver::Chrome::Options.new
|
|
58
|
-
browser_options.add_argument('--window-size=1920,1080')
|
|
59
|
-
browser_options.add_argument('--headless') unless ENV['SHOW_TEST_BROWSER']
|
|
60
|
-
|
|
61
|
-
# Register the driver
|
|
62
|
-
Capybara.register_driver :selenium_chrome_headless do |app|
|
|
63
|
-
Capybara::Selenium::Driver.new(
|
|
64
|
-
app,
|
|
65
|
-
browser: :chrome,
|
|
66
|
-
options: browser_options
|
|
67
|
-
)
|
|
68
|
-
end
|
|
69
|
-
|
|
70
|
-
# Set as default JavaScript driver
|
|
71
|
-
Capybara.javascript_driver = :selenium_chrome_headless
|
|
72
|
-
|
|
73
|
-
# Configure RSpec to use the driver for system tests
|
|
74
|
-
RSpec.configure do |config|
|
|
75
|
-
config.before(:each, type: :system) do
|
|
76
|
-
driven_by :selenium_chrome_headless
|
|
77
|
-
end
|
|
78
|
-
end
|
|
79
|
-
```
|
|
80
|
-
|
|
81
|
-
**Note for Rails 8:** Rails 8 uses `driven_by` to configure system tests. Make sure your `spec/support/driver.rb` is loaded by `rails_helper.rb` (it should be automatically loaded if it's in the `spec/support/` directory).
|
|
82
|
-
|
|
83
|
-
### Step 3: Install Chrome/Chromium (Required)
|
|
84
|
-
|
|
85
|
-
System tests require Chrome or Chromium to be installed on your system:
|
|
86
|
-
|
|
87
|
-
**macOS:**
|
|
88
|
-
```bash
|
|
89
|
-
brew install --cask google-chrome
|
|
90
|
-
# or for Chromium:
|
|
91
|
-
brew install --cask chromium
|
|
92
|
-
```
|
|
93
|
-
|
|
94
|
-
**Linux (Ubuntu/Debian):**
|
|
95
|
-
```bash
|
|
96
|
-
sudo apt-get update
|
|
97
|
-
sudo apt-get install -y google-chrome-stable
|
|
98
|
-
# or for Chromium:
|
|
99
|
-
sudo apt-get install -y chromium-browser
|
|
100
|
-
```
|
|
101
|
-
|
|
102
|
-
**Windows:**
|
|
103
|
-
Download and install Chrome from [google.com/chrome](https://www.google.com/chrome/)
|
|
104
|
-
|
|
105
|
-
The `webdrivers` gem will automatically download and manage the ChromeDriver binary for you.
|
|
106
|
-
|
|
107
|
-
### Step 4: Run Your Tests
|
|
53
|
+
### Step 3: Run Your Tests
|
|
108
54
|
|
|
109
55
|
You can run accessibility checks in several ways:
|
|
110
56
|
|
|
@@ -118,7 +64,7 @@ Accessibility checks run automatically on every system test that visits a page.
|
|
|
118
64
|
|
|
119
65
|
#### Option B: Run Continuously with Procfile (Recommended for Development)
|
|
120
66
|
|
|
121
|
-
|
|
67
|
+
The generator automatically adds an accessibility watch command to your `Procfile.dev`:
|
|
122
68
|
|
|
123
69
|
```procfile
|
|
124
70
|
web: bin/rails server
|
|
@@ -139,6 +85,28 @@ This will:
|
|
|
139
85
|
|
|
140
86
|
The accessibility checker will continuously monitor your pages and alert you to any issues as you develop!
|
|
141
87
|
|
|
88
|
+
#### Option C: All Pages Spec with Smart Change Detection
|
|
89
|
+
|
|
90
|
+
The generator creates `spec/system/all_pages_accessibility_spec.rb` which automatically tests all GET routes in your application. This spec includes **smart change detection**:
|
|
91
|
+
|
|
92
|
+
- **Only tests pages when their related files change** - Views, controllers, or helpers
|
|
93
|
+
- **Detects changes via Git** - Uncommitted changes in monitored directories (`app/views`, `app/controllers`, `app/helpers`)
|
|
94
|
+
- **File modification tracking** - Files changed in the last 5 minutes
|
|
95
|
+
- **Layout/helper changes** - Automatically tests all pages when layouts or helpers change (they affect everything)
|
|
96
|
+
- **First run** - Tests all pages on first run (when no changes detected)
|
|
97
|
+
- **Manual override** - Set `TEST_ALL_PAGES=true` to force testing all pages regardless of changes
|
|
98
|
+
|
|
99
|
+
This makes your test suite faster and more focused, only running checks when relevant code changes. The spec automatically:
|
|
100
|
+
- Skips routes that require authentication
|
|
101
|
+
- Handles routes with parameters
|
|
102
|
+
- Filters out API routes and Rails internal routes
|
|
103
|
+
- Provides clear skip messages when pages aren't affected by changes
|
|
104
|
+
|
|
105
|
+
Run it manually:
|
|
106
|
+
```bash
|
|
107
|
+
bundle exec rspec spec/system/all_pages_accessibility_spec.rb
|
|
108
|
+
```
|
|
109
|
+
|
|
142
110
|
## Your First Accessibility Check
|
|
143
111
|
|
|
144
112
|
Let's see it in action. Create a simple system spec:
|
|
@@ -159,13 +127,12 @@ end
|
|
|
159
127
|
While checks run automatically after each `visit`, you can also run comprehensive checks explicitly at any point in your test:
|
|
160
128
|
|
|
161
129
|
```ruby
|
|
162
|
-
# spec/system/
|
|
130
|
+
# spec/system/my_page_accessibility_spec.rb
|
|
163
131
|
require 'rails_helper'
|
|
164
132
|
|
|
165
|
-
RSpec.describe '
|
|
133
|
+
RSpec.describe 'My Page Accessibility', type: :system do
|
|
166
134
|
it 'loads the page and runs comprehensive accessibility checks' do
|
|
167
135
|
visit root_path
|
|
168
|
-
expect(page).to have_content('Welcome')
|
|
169
136
|
|
|
170
137
|
# Run comprehensive accessibility checks explicitly
|
|
171
138
|
# This will fail the test if any accessibility issues are found
|
|
@@ -226,14 +193,14 @@ Rails A11y runs **11 comprehensive checks** automatically. These checks are WCAG
|
|
|
226
193
|
|
|
227
194
|
1. **Form Labels** - All form inputs have associated labels
|
|
228
195
|
2. **Image Alt Text** - All images have descriptive alt attributes (including empty alt="" detection)
|
|
229
|
-
3. **Interactive Elements** - Buttons, links, and other interactive elements have accessible names
|
|
230
|
-
4. **Heading Hierarchy** - Proper h1-h6 structure without skipping levels
|
|
196
|
+
3. **Interactive Elements** - Buttons, links, and other interactive elements have accessible names (including links with images that have alt text)
|
|
197
|
+
4. **Heading Hierarchy** - Proper h1-h6 structure without skipping levels (detects missing h1, skipped levels, and h2+ without h1)
|
|
231
198
|
5. **Keyboard Accessibility** - All interactive elements are keyboard accessible
|
|
232
199
|
6. **ARIA Landmarks** - Proper use of ARIA landmark roles for page structure
|
|
233
200
|
7. **Form Error Associations** - Form errors are properly linked to their form fields
|
|
234
201
|
8. **Table Structure** - Tables have proper headers and structure
|
|
235
202
|
9. **Duplicate IDs** - No duplicate ID attributes on the page
|
|
236
|
-
10. **Skip Links** - Skip navigation links are present for keyboard users
|
|
203
|
+
10. **Skip Links** - Skip navigation links are present for keyboard users (detects various patterns: `skip-link`, `skiplink`, `href="#main"`, `href="#maincontent"`, etc.)
|
|
237
204
|
11. **Color Contrast** - Text meets WCAG contrast requirements (optional, disabled by default for performance)
|
|
238
205
|
|
|
239
206
|
### What `check_comprehensive_accessibility` Does
|
|
@@ -318,6 +285,67 @@ end
|
|
|
318
285
|
|
|
319
286
|
## Troubleshooting
|
|
320
287
|
|
|
288
|
+
### How do I configure Capybara for system tests?
|
|
289
|
+
|
|
290
|
+
If you don't already have system tests configured, you need to set up Capybara with a Selenium driver. Create `spec/support/driver.rb`:
|
|
291
|
+
|
|
292
|
+
```ruby
|
|
293
|
+
# spec/support/driver.rb
|
|
294
|
+
require 'selenium-webdriver'
|
|
295
|
+
require 'capybara/rails'
|
|
296
|
+
require 'capybara/rspec'
|
|
297
|
+
|
|
298
|
+
# Configure Chrome options
|
|
299
|
+
browser_options = Selenium::WebDriver::Chrome::Options.new
|
|
300
|
+
browser_options.add_argument('--window-size=1920,1080')
|
|
301
|
+
browser_options.add_argument('--headless') unless ENV['SHOW_TEST_BROWSER']
|
|
302
|
+
|
|
303
|
+
# Register the driver
|
|
304
|
+
Capybara.register_driver :selenium_chrome_headless do |app|
|
|
305
|
+
Capybara::Selenium::Driver.new(
|
|
306
|
+
app,
|
|
307
|
+
browser: :chrome,
|
|
308
|
+
options: browser_options
|
|
309
|
+
)
|
|
310
|
+
end
|
|
311
|
+
|
|
312
|
+
# Set as default JavaScript driver
|
|
313
|
+
Capybara.javascript_driver = :selenium_chrome_headless
|
|
314
|
+
|
|
315
|
+
# Configure RSpec to use the driver for system tests
|
|
316
|
+
RSpec.configure do |config|
|
|
317
|
+
config.before(:each, type: :system) do
|
|
318
|
+
driven_by :selenium_chrome_headless
|
|
319
|
+
end
|
|
320
|
+
end
|
|
321
|
+
```
|
|
322
|
+
|
|
323
|
+
**Note for Rails 8:** Rails 8 uses `driven_by` to configure system tests. Make sure your `spec/support/driver.rb` is loaded by `rails_helper.rb` (it should be automatically loaded if it's in the `spec/support/` directory).
|
|
324
|
+
|
|
325
|
+
### How do I install Chrome/Chromium?
|
|
326
|
+
|
|
327
|
+
System tests require Chrome or Chromium to be installed on your system:
|
|
328
|
+
|
|
329
|
+
**macOS:**
|
|
330
|
+
```bash
|
|
331
|
+
brew install --cask google-chrome
|
|
332
|
+
# or for Chromium:
|
|
333
|
+
brew install --cask chromium
|
|
334
|
+
```
|
|
335
|
+
|
|
336
|
+
**Linux (Ubuntu/Debian):**
|
|
337
|
+
```bash
|
|
338
|
+
sudo apt-get update
|
|
339
|
+
sudo apt-get install -y google-chrome-stable
|
|
340
|
+
# or for Chromium:
|
|
341
|
+
sudo apt-get install -y chromium-browser
|
|
342
|
+
```
|
|
343
|
+
|
|
344
|
+
**Windows:**
|
|
345
|
+
Download and install Chrome from [google.com/chrome](https://www.google.com/chrome/)
|
|
346
|
+
|
|
347
|
+
The `webdrivers` gem will automatically download and manage the ChromeDriver binary for you.
|
|
348
|
+
|
|
321
349
|
### Error: `uninitialized constant Selenium::WebDriver::DriverFinder`
|
|
322
350
|
|
|
323
351
|
This error typically occurs when:
|
|
@@ -370,14 +398,14 @@ development:
|
|
|
370
398
|
|
|
371
399
|
For best results, use these compatible versions:
|
|
372
400
|
|
|
373
|
-
| Component | Recommended Version | Minimum Version |
|
|
374
|
-
|
|
375
|
-
| Ruby | 3.1+ | 3.0+ |
|
|
376
|
-
| Rails | 7.1+ / 8.0+ | 6.0+ |
|
|
377
|
-
| RSpec Rails |
|
|
378
|
-
| Capybara | ~> 3.40 | 3.0+ |
|
|
379
|
-
| selenium-webdriver | ~> 4.10 | 4.0+ |
|
|
380
|
-
| webdrivers | ~> 5.3 | 5.0+ |
|
|
401
|
+
| Component | Recommended Version | Minimum Version | Required |
|
|
402
|
+
|-----------|-------------------|-----------------|----------|
|
|
403
|
+
| Ruby | 3.1+ | 3.0+ | Yes |
|
|
404
|
+
| Rails | 7.1+ / 8.0+ | 6.0+ | Yes |
|
|
405
|
+
| **RSpec Rails** | **8.0+** | **6.0+** | **Yes (for system specs)** |
|
|
406
|
+
| Capybara | ~> 3.40 | 3.0+ | Yes |
|
|
407
|
+
| selenium-webdriver | ~> 4.10 | 4.0+ | Yes |
|
|
408
|
+
| webdrivers | ~> 5.3 | 5.0+ | Optional |
|
|
381
409
|
|
|
382
410
|
**Rails 8 Notes:**
|
|
383
411
|
- Rails 8 requires `selenium-webdriver` 4.6.0+ for `DriverFinder` support
|
|
@@ -12,18 +12,19 @@ System specs are the **recommended and most reliable** way to run accessibility
|
|
|
12
12
|
|
|
13
13
|
## Quick Setup
|
|
14
14
|
|
|
15
|
-
### 1.
|
|
15
|
+
### 1. Use the Generated Specs
|
|
16
16
|
|
|
17
|
-
|
|
17
|
+
The generator creates `spec/system/all_pages_accessibility_spec.rb` which automatically tests all GET routes in your application with **smart change detection**. This spec only tests pages when their related files (views, controllers, helpers) have changed, making it fast and focused.
|
|
18
|
+
|
|
19
|
+
You can also create custom system specs for specific pages. Name them with `_accessibility_spec.rb` suffix for clarity:
|
|
18
20
|
|
|
19
21
|
```ruby
|
|
20
|
-
# spec/system/
|
|
22
|
+
# spec/system/my_page_accessibility_spec.rb
|
|
21
23
|
require 'rails_helper'
|
|
22
24
|
|
|
23
|
-
RSpec.describe '
|
|
25
|
+
RSpec.describe 'My Page Accessibility', type: :system do
|
|
24
26
|
it 'loads the page and runs comprehensive accessibility checks' do
|
|
25
27
|
visit root_path
|
|
26
|
-
expect(page).to have_content('Biorepository').or have_content('Welcome')
|
|
27
28
|
|
|
28
29
|
# Run comprehensive accessibility checks
|
|
29
30
|
# This will fail the test if any accessibility issues are found
|
|
@@ -37,27 +38,27 @@ end
|
|
|
37
38
|
|
|
38
39
|
The gem automatically runs comprehensive accessibility checks after each `visit` in system specs. You don't need to call `check_comprehensive_accessibility` manually unless you want to run checks at a specific point in your test.
|
|
39
40
|
|
|
40
|
-
### 3.
|
|
41
|
+
### 3. Continuous Testing with Procfile (Optional)
|
|
41
42
|
|
|
42
|
-
|
|
43
|
+
The generator automatically adds an accessibility watch command to your `Procfile.dev`:
|
|
43
44
|
|
|
44
45
|
```ruby
|
|
45
|
-
web:
|
|
46
|
+
web: bin/rails server
|
|
46
47
|
css: bin/rails dartsass:watch
|
|
47
48
|
a11y: while true; do bundle exec rspec spec/system/*_accessibility_spec.rb; sleep 30; done
|
|
48
49
|
```
|
|
49
50
|
|
|
50
|
-
This will run your accessibility specs every 30 seconds while you develop.
|
|
51
|
+
This will run your accessibility specs every 30 seconds while you develop. The `all_pages_accessibility_spec.rb` uses smart change detection to only test pages when their related files change, making it fast and focused.
|
|
51
52
|
|
|
52
53
|
## Example Specs
|
|
53
54
|
|
|
54
55
|
### Basic Page Check
|
|
55
56
|
|
|
56
57
|
```ruby
|
|
57
|
-
# spec/system/
|
|
58
|
+
# spec/system/my_page_accessibility_spec.rb
|
|
58
59
|
require 'rails_helper'
|
|
59
60
|
|
|
60
|
-
RSpec.describe '
|
|
61
|
+
RSpec.describe 'My Page Accessibility', type: :system do
|
|
61
62
|
it 'runs accessibility checks on the home page' do
|
|
62
63
|
visit root_path
|
|
63
64
|
# ✅ Comprehensive accessibility checks run automatically after this test!
|
|
@@ -189,7 +190,7 @@ bundle exec rspec spec/system/*_accessibility_spec.rb
|
|
|
189
190
|
### Run Specific Spec
|
|
190
191
|
|
|
191
192
|
```bash
|
|
192
|
-
bundle exec rspec spec/system/
|
|
193
|
+
bundle exec rspec spec/system/all_pages_accessibility_spec.rb
|
|
193
194
|
```
|
|
194
195
|
|
|
195
196
|
### Run with Documentation Format
|
data/README.md
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
**The RSpec + RuboCop of accessibility for Rails. Catch WCAG violations before they reach production.**
|
|
9
9
|
|
|
10
|
-
**Current Version:** 1.
|
|
10
|
+
**Current Version:** 1.5.0
|
|
11
11
|
|
|
12
12
|
📖 **[📚 Full Documentation](https://rayraycodes.github.io/rails-accessibility-testing/)** | [💻 GitHub](https://github.com/rayraycodes/rails-accessibility-testing) | [💎 RubyGems](https://rubygems.org/gems/rails_accessibility_testing)
|
|
13
13
|
|
|
@@ -19,16 +19,40 @@ Rails Accessibility Testing fills a critical gap in the Rails testing ecosystem.
|
|
|
19
19
|
|
|
20
20
|
## ✨ Features
|
|
21
21
|
|
|
22
|
+
### Core Capabilities
|
|
22
23
|
- 🚀 **Zero Configuration** - Works out of the box with smart defaults
|
|
23
24
|
- 🎯 **11+ Comprehensive Checks** - WCAG 2.1 AA aligned
|
|
24
|
-
- 📍 **File Location
|
|
25
|
+
- 📍 **Precise File Location** - Know exactly which view file or partial to fix
|
|
25
26
|
- 🔧 **Actionable Error Messages** - Code examples showing how to fix issues
|
|
26
|
-
- ⚡ **Smart Change Detection** - Only runs when relevant code changes
|
|
27
27
|
- 🎨 **Beautiful CLI** - Human-readable and JSON reports
|
|
28
28
|
- 🔌 **Rails Generator** - One command setup
|
|
29
29
|
- 🧪 **RSpec & Minitest** - Works with both test frameworks
|
|
30
30
|
- ⚙️ **YAML Configuration** - Profile-based config (dev/test/CI)
|
|
31
|
-
|
|
31
|
+
|
|
32
|
+
### 🆕 Version 1.5.0 Highlights
|
|
33
|
+
|
|
34
|
+
#### Smart View File Detection
|
|
35
|
+
- **Intelligent matching**: Automatically finds view files even when action names don't match (e.g., `search` action → `search_result.html.erb`)
|
|
36
|
+
- **Controller directory scanning**: Searches all view files to find the correct template
|
|
37
|
+
- **Fuzzy matching**: Handles variations and naming conventions
|
|
38
|
+
|
|
39
|
+
#### Advanced Partial Detection
|
|
40
|
+
- **Automatic partial discovery**: Scans view files to detect all rendered partials
|
|
41
|
+
- **Multi-location search**: Finds partials in controller dirs, `shared/`, and `layouts/`
|
|
42
|
+
- **Namespaced support**: Handles paths like `layouts/navbar` or `shared/forms/input`
|
|
43
|
+
- **Element-to-partial mapping**: Shows exact partial file when issues are found
|
|
44
|
+
|
|
45
|
+
#### Performance Optimizations
|
|
46
|
+
- **Page scanning cache**: Prevents duplicate scans of the same page
|
|
47
|
+
- **Smart change detection**: Only tests pages when relevant files change
|
|
48
|
+
- **First-run optimization**: Tests all pages initially, then only changed files
|
|
49
|
+
- **Asset change detection**: Detects CSS/JS changes and their impact
|
|
50
|
+
|
|
51
|
+
#### Enhanced Developer Experience
|
|
52
|
+
- **Friendly test summaries**: Clear passed/failed/skipped counts with reasons
|
|
53
|
+
- **Progress indicators**: Real-time feedback during checks
|
|
54
|
+
- **Cleaner output**: Suppressed verbose skipped test messages
|
|
55
|
+
- **Better error context**: Shows view files, partials, and element details
|
|
32
56
|
|
|
33
57
|
## 🚀 Quick Start
|
|
34
58
|
|
|
@@ -39,14 +63,16 @@ Add to your `Gemfile`:
|
|
|
39
63
|
```ruby
|
|
40
64
|
group :development, :test do
|
|
41
65
|
gem 'rails_accessibility_testing'
|
|
66
|
+
gem 'rspec-rails', '~> 8.0' # Required for system specs
|
|
42
67
|
gem 'axe-core-capybara', '~> 4.0'
|
|
43
68
|
gem 'capybara', '~> 3.40'
|
|
44
69
|
gem 'selenium-webdriver', '~> 4.0'
|
|
45
|
-
gem 'webdrivers', '~> 5.0' # Optional but recommended
|
|
70
|
+
gem 'webdrivers', '~> 5.0' # Optional but recommended
|
|
71
|
+
gem 'csv' # Required for Ruby 3.3+ (CSV removed from standard library in Ruby 3.4)
|
|
46
72
|
end
|
|
47
73
|
```
|
|
48
74
|
|
|
49
|
-
**Important:** You must explicitly add `selenium-webdriver`
|
|
75
|
+
**Important:** You must explicitly add `selenium-webdriver` and `csv` (for Ruby 3.3+) to your Gemfile. The gem has minimal dependencies - you control your own driver setup.
|
|
50
76
|
|
|
51
77
|
Then run:
|
|
52
78
|
|
|
@@ -65,7 +91,9 @@ rails generate rails_a11y:install
|
|
|
65
91
|
This creates:
|
|
66
92
|
- `config/initializers/rails_a11y.rb` - Configuration
|
|
67
93
|
- `config/accessibility.yml` - Check settings
|
|
94
|
+
- `spec/system/all_pages_accessibility_spec.rb` - Comprehensive spec that dynamically tests all GET routes
|
|
68
95
|
- Updates `spec/rails_helper.rb` (if using RSpec)
|
|
96
|
+
- Updates `Procfile.dev` with accessibility watch command (if present)
|
|
69
97
|
|
|
70
98
|
### Setup (Option 2: Manual)
|
|
71
99
|
|
|
@@ -100,7 +128,7 @@ require 'rails_helper'
|
|
|
100
128
|
RSpec.describe 'Home Page Accessibility', type: :system do
|
|
101
129
|
it 'loads successfully and passes comprehensive accessibility checks' do
|
|
102
130
|
visit root_path
|
|
103
|
-
expect(page).to have_content('
|
|
131
|
+
expect(page).to have_content('Welcome')
|
|
104
132
|
|
|
105
133
|
# Run comprehensive accessibility checks
|
|
106
134
|
check_comprehensive_accessibility
|
|
@@ -111,25 +139,22 @@ end
|
|
|
111
139
|
|
|
112
140
|
**Accessibility checks run automatically after each `visit` in system specs!**
|
|
113
141
|
|
|
114
|
-
|
|
142
|
+
### All Pages Accessibility Spec
|
|
115
143
|
|
|
116
|
-
|
|
144
|
+
The generator creates `spec/system/all_pages_accessibility_spec.rb` which automatically tests all GET routes in your application. The spec:
|
|
117
145
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
146
|
+
- **Dynamically discovers routes** at runtime - works for any Rails app
|
|
147
|
+
- **Smart change detection** - Only tests pages when their related files (views, controllers, helpers, CSS/JS) have changed
|
|
148
|
+
- **First-run optimization** - Tests all pages on first run, then only changed files
|
|
149
|
+
- **Intelligent skipping** - Skips routes that require authentication, have errors, or aren't accessible
|
|
150
|
+
- **Friendly summaries** - Shows passed/failed/skipped counts with clear reasons
|
|
123
151
|
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
This will automatically run accessibility checks every 30 seconds on all `*_accessibility_spec.rb` files, giving you continuous feedback as you develop!
|
|
131
|
-
|
|
132
|
-
📖 **[See the full System Specs Guide](GUIDES/system_specs_for_accessibility.md)** for detailed examples and best practices.
|
|
152
|
+
The spec automatically:
|
|
153
|
+
- Tests all GET routes (filters out API, internal Rails routes)
|
|
154
|
+
- Handles routes with parameters by substituting test values
|
|
155
|
+
- Detects view files even when action names don't match
|
|
156
|
+
- Shows which files changed and which pages are affected
|
|
157
|
+
- Provides helpful tips and next steps
|
|
133
158
|
|
|
134
159
|
### Automatic Checks
|
|
135
160
|
|
|
@@ -169,6 +194,18 @@ it "meets all accessibility standards" do
|
|
|
169
194
|
end
|
|
170
195
|
```
|
|
171
196
|
|
|
197
|
+
### Continuous Development Testing
|
|
198
|
+
|
|
199
|
+
Add to your `Procfile.dev`:
|
|
200
|
+
|
|
201
|
+
```ruby
|
|
202
|
+
web: $(bundle show rails_accessibility_testing)/exe/rails_server_safe
|
|
203
|
+
css: bin/rails dartsass:watch
|
|
204
|
+
a11y: while true; do bin/check_a11y_changes && (test -f bin/rspec && bin/rspec spec/system/*_accessibility_spec.rb --format progress --no-profile || bundle exec rspec spec/system/*_accessibility_spec.rb --format progress --no-profile) 2>&1 | grep -v "^[[:space:]]*[0-9]*)[[:space:]]*All Pages Accessibility checks accessibility" | grep -v "# Skipping" || echo '⏭️ No changes detected, skipping tests'; sleep 30; done
|
|
205
|
+
```
|
|
206
|
+
|
|
207
|
+
This runs accessibility tests every 30 seconds, but only when files have changed!
|
|
208
|
+
|
|
172
209
|
### CLI Usage
|
|
173
210
|
|
|
174
211
|
Run checks against URLs or Rails routes:
|
|
@@ -196,14 +233,14 @@ The gem automatically runs **11 comprehensive accessibility checks**:
|
|
|
196
233
|
|
|
197
234
|
1. ✅ **Form Labels** - All form inputs have associated labels
|
|
198
235
|
2. ✅ **Image Alt Text** - All images have descriptive alt attributes
|
|
199
|
-
3. ✅ **Interactive Elements** - Buttons, links have accessible names
|
|
200
|
-
4. ✅ **Heading Hierarchy** - Proper h1-h6 structure
|
|
236
|
+
3. ✅ **Interactive Elements** - Buttons, links have accessible names (including links with images that have alt text)
|
|
237
|
+
4. ✅ **Heading Hierarchy** - Proper h1-h6 structure (detects missing h1, multiple h1s, skipped levels, and h2+ without h1)
|
|
201
238
|
5. ✅ **Keyboard Accessibility** - All interactive elements keyboard accessible
|
|
202
239
|
6. ✅ **ARIA Landmarks** - Proper use of ARIA landmark roles
|
|
203
240
|
7. ✅ **Form Error Associations** - Errors linked to form fields
|
|
204
241
|
8. ✅ **Table Structure** - Tables have proper headers
|
|
205
242
|
9. ✅ **Duplicate IDs** - No duplicate ID attributes
|
|
206
|
-
10. ✅ **Skip Links** - Skip navigation links present
|
|
243
|
+
10. ✅ **Skip Links** - Skip navigation links present (detects various patterns)
|
|
207
244
|
11. ✅ **Color Contrast** - Text meets contrast requirements (optional)
|
|
208
245
|
|
|
209
246
|
## ⚙️ Configuration
|
|
@@ -221,7 +258,7 @@ checks:
|
|
|
221
258
|
form_labels: true
|
|
222
259
|
image_alt_text: true
|
|
223
260
|
interactive_elements: true
|
|
224
|
-
|
|
261
|
+
heading: true # Note: renamed from heading_hierarchy in 1.5.0
|
|
225
262
|
keyboard_accessibility: true
|
|
226
263
|
aria_landmarks: true
|
|
227
264
|
form_errors: true
|
|
@@ -268,7 +305,7 @@ end
|
|
|
268
305
|
|
|
269
306
|
## 📋 Example Error Output
|
|
270
307
|
|
|
271
|
-
When accessibility issues are found, you get detailed, actionable errors:
|
|
308
|
+
When accessibility issues are found, you get detailed, actionable errors with precise file locations:
|
|
272
309
|
|
|
273
310
|
```
|
|
274
311
|
======================================================================
|
|
@@ -276,9 +313,10 @@ When accessibility issues are found, you get detailed, actionable errors:
|
|
|
276
313
|
======================================================================
|
|
277
314
|
|
|
278
315
|
📄 Page Being Tested:
|
|
279
|
-
URL: http://localhost:3000/
|
|
280
|
-
Path: /
|
|
281
|
-
📝
|
|
316
|
+
URL: http://localhost:3000/items/search
|
|
317
|
+
Path: /items/search
|
|
318
|
+
📝 View File: app/views/items/search_result.html.erb
|
|
319
|
+
📝 Partial: app/views/layouts/_advance_search.html.erb
|
|
282
320
|
|
|
283
321
|
📍 Element Details:
|
|
284
322
|
Tag: <img>
|
|
@@ -298,10 +336,40 @@ When accessibility issues are found, you get detailed, actionable errors:
|
|
|
298
336
|
💡 Best Practice: All images must have alt attribute.
|
|
299
337
|
Use empty alt="" only for purely decorative images.
|
|
300
338
|
|
|
301
|
-
📖 WCAG Reference: https://www.w3.org/WAI/WCAG21/Understanding/
|
|
339
|
+
📖 WCAG Reference: https://www.w3.org/WAI/WCAG21/Understanding/non-text-content.html
|
|
302
340
|
======================================================================
|
|
303
341
|
```
|
|
304
342
|
|
|
343
|
+
**Notice:** The error shows both the main view file (`search_result.html.erb`) and the partial where the issue actually occurs (`_advance_search.html.erb`). This makes fixing issues much faster!
|
|
344
|
+
|
|
345
|
+
## 🚀 Performance Features
|
|
346
|
+
|
|
347
|
+
### Smart Change Detection
|
|
348
|
+
|
|
349
|
+
The gem automatically detects when files change and only tests affected pages:
|
|
350
|
+
|
|
351
|
+
- **View files**: Tests pages when their view files change
|
|
352
|
+
- **Partials**: Tests pages that render changed partials
|
|
353
|
+
- **Controllers**: Tests all routes for a controller when the controller changes
|
|
354
|
+
- **Helpers**: Tests all pages when helpers change (they can affect any view)
|
|
355
|
+
- **Assets**: Tests all pages when CSS/JS changes (can affect accessibility globally)
|
|
356
|
+
|
|
357
|
+
### Page Scanning Cache
|
|
358
|
+
|
|
359
|
+
Prevents duplicate scans of the same page during a test run:
|
|
360
|
+
|
|
361
|
+
- **Automatic caching**: Each page is scanned once per test suite execution
|
|
362
|
+
- **Efficient tracking**: Uses page path or URL as cache key
|
|
363
|
+
- **Silent skipping**: Already-scanned pages are skipped without output
|
|
364
|
+
- **Manual reset**: Use `reset_scanned_pages_cache` if needed
|
|
365
|
+
|
|
366
|
+
### First-Run Optimization
|
|
367
|
+
|
|
368
|
+
- **Initial baseline**: Tests all pages on first run to establish baseline
|
|
369
|
+
- **Subsequent runs**: Only tests changed files for faster feedback
|
|
370
|
+
- **Marker file**: Creates `.rails_a11y_initialized` to track first run
|
|
371
|
+
- **Force all pages**: Set `TEST_ALL_PAGES=true` to test all pages anytime
|
|
372
|
+
|
|
305
373
|
## 📚 Documentation
|
|
306
374
|
|
|
307
375
|
### 🌐 Online Documentation
|
|
@@ -337,9 +405,12 @@ View at `doc/index.html`
|
|
|
337
405
|
|
|
338
406
|
Rails Accessibility Testing is built with a clean, modular architecture:
|
|
339
407
|
|
|
340
|
-
- **Rule Engine** - Evaluates accessibility checks
|
|
341
|
-
- **Check Definitions** - WCAG-aligned check implementations
|
|
408
|
+
- **Rule Engine** - Evaluates accessibility checks with configurable profiles
|
|
409
|
+
- **Check Definitions** - WCAG-aligned check implementations (11+ checks)
|
|
342
410
|
- **Violation Collector** - Aggregates and formats violations
|
|
411
|
+
- **View File Detection** - Intelligent detection of view files and partials
|
|
412
|
+
- **Change Detector** - Smart detection of file changes and their impact
|
|
413
|
+
- **Page Scanning Cache** - Prevents duplicate scans for performance
|
|
343
414
|
- **Rails Integration** - Railtie, RSpec, Minitest helpers
|
|
344
415
|
- **CLI** - Command-line interface for URL/route scanning
|
|
345
416
|
- **Configuration** - YAML-based config with profiles
|
|
@@ -350,13 +421,42 @@ See [ARCHITECTURE.md](ARCHITECTURE.md) for detailed architecture documentation.
|
|
|
350
421
|
|
|
351
422
|
- Ruby 3.0+ (3.1+ recommended)
|
|
352
423
|
- Rails 6.0+ (7.1+ recommended)
|
|
353
|
-
- RSpec Rails 6.0+ (for
|
|
424
|
+
- **RSpec Rails 6.0+ (required for system specs)** or Minitest (for Minitest)
|
|
354
425
|
- Capybara 3.0+ (provided by your project)
|
|
355
426
|
- selenium-webdriver 4.0+ (provided by your project, for system specs)
|
|
356
427
|
- webdrivers (optional, provided by your project, for automatic driver management)
|
|
428
|
+
- **csv gem** (required for Ruby 3.3+, as CSV is removed from standard library in Ruby 3.4)
|
|
357
429
|
- Chrome/Chromium browser
|
|
358
430
|
|
|
359
|
-
**Note:**
|
|
431
|
+
**Note:** The generator creates system specs that require `rspec-rails`. If you're using Minitest, you'll need to manually create your accessibility tests.
|
|
432
|
+
|
|
433
|
+
**Note:** As of version 1.2.0, the gem has minimal dependencies. You provide and configure Capybara, selenium-webdriver, webdrivers, and csv in your own Gemfile, giving you full control over your test driver setup.
|
|
434
|
+
|
|
435
|
+
## 🆕 What's New in 1.5.0
|
|
436
|
+
|
|
437
|
+
### Major Improvements
|
|
438
|
+
|
|
439
|
+
1. **Smart View File Detection**
|
|
440
|
+
- Automatically finds view files even when action names don't match
|
|
441
|
+
- Scans controller directories intelligently
|
|
442
|
+
- Handles edge cases and naming variations
|
|
443
|
+
|
|
444
|
+
2. **Advanced Partial Detection**
|
|
445
|
+
- Scans view files to discover all rendered partials
|
|
446
|
+
- Maps accessibility issues to exact partial files
|
|
447
|
+
- Supports namespaced partials and multiple locations
|
|
448
|
+
|
|
449
|
+
3. **Performance Optimizations**
|
|
450
|
+
- Page scanning cache prevents duplicate work
|
|
451
|
+
- Smart change detection only tests affected pages
|
|
452
|
+
- First-run optimization for faster initial setup
|
|
453
|
+
|
|
454
|
+
4. **Enhanced Developer Experience**
|
|
455
|
+
- Friendly test summaries with clear counts and reasons
|
|
456
|
+
- Better error messages with precise file locations
|
|
457
|
+
- Cleaner output with suppressed verbose messages
|
|
458
|
+
|
|
459
|
+
See [CHANGELOG.md](CHANGELOG.md) for complete details.
|
|
360
460
|
|
|
361
461
|
## 🤝 Contributing
|
|
362
462
|
|