rails_accessibility_testing 1.5.10 → 1.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9f8824e08bc8db71c7a6598998b44c6b39826f367398c8c98a1ef85366a044e2
-  data.tar.gz: bd9337c4b6b89deae25b1adfc9dbec92645c934703e930d5f5048c71a59117b5
+  metadata.gz: 232d290bc12c422c56aacad24fa16660eb12b3e106939fc6b4cac0a639740532
+  data.tar.gz: 2b5a248555626127007ef893c84bd10f8aac41e195dba54c86bebd7b1f4e1448
 SHA512:
-  metadata.gz: cd9fdfced6342b861ae5d1db4ee852b4c566c9572d62dac463fdc0d7566d37ef1201201c36c3af4d45393d24af7f0a504f76f7eaf25322e7025a577eeb3d94dc
-  data.tar.gz: a2672850fd85a29fb3a304243f1367215c282a34e63df58f5878d274dd31176465afaad23734699124bd6649032b68ff578f0d6a1ae4b6ec853d2f4ffd7ef23c
+  metadata.gz: 566c195bcf20d08247c58c97f11e8fe1158488d998a78eb12e293f9e70451db5076c0e314c1a383a2cdcdf5f50f9dd6c291665f2516c070cbf972de6c25ee186
+  data.tar.gz: 71e9fb76ac0b894e872397a7cc822a874acf33a32bf128c1a8ca7932a0ca283389b23534b567a5929652470239d565777de7d6a0113469eb1ac688331cbd8491

data/CHANGELOG.md

@@ -5,6 +5,33 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.6.0] - 2024-12-XX
+
+### Added
+- **Intelligent ERB Template Handling**: Enhanced ERB extractor to preserve dynamic ID structure from ERB templates
+- **Dynamic ID Support**: Static scanner now correctly handles checkbox/radio inputs with ERB-generated IDs (e.g., `collection_answers_<%= question.id %>_<%= option.id %>_`)
+- **Label Matching for Dynamic IDs**: Form labels check now correctly matches labels to inputs with dynamic IDs by preserving ERB placeholder structure
+- **Smart Duplicate ID Detection**: Duplicate ID check now excludes dynamic IDs with ERB placeholders, preventing false positives for checkbox/radio groups in loops
+
+### Fixed
+- Fixed false positive "Form input missing label [id: collection_answers]" for checkbox groups with dynamic IDs
+- Fixed false positive "Duplicate ID 'collection_answers' found" when IDs contain ERB expressions
+- Fixed missing accessible name detection for links with `href="#"` - now only flags links that truly lack accessible names (visible text, aria-label, or aria-labelledby)
+- Improved `label_tag` helper conversion to handle string interpolation in ID arguments
+- Enhanced raw HTML input element processing to preserve ERB structure in attributes
+
+### Changed
+- **ERB Extractor**: Now processes raw HTML elements with ERB in attributes before removing ERB tags, preserving dynamic ID structure
+- **Form Labels Check**: Updated to handle ERB placeholders in IDs when checking for associated labels
+- **Duplicate IDs Check**: Now filters out IDs containing `ERB_CONTENT` placeholders from duplicate detection
+- **Interactive Elements Check**: Enhanced to correctly detect accessible names for links with `href="#"`, avoiding false positives
+- **RSpec Test File**: Refactored `all_pages_accessibility_spec.rb` to extract formatting helper and add proper assertions that fail tests when errors are found
+
+### Documentation
+- Added comprehensive documentation on ERB template handling and dynamic ID processing
+- Updated architecture documentation with details on how dynamic IDs are preserved
+- Added examples and explanations for checkbox/radio groups with ERB-generated IDs
+
 ## [1.5.10] - 2024-12-01
 
 ### Changed

data/docs_site/architecture.md

@@ -167,6 +167,61 @@ graph TB
     style Report fill:#ffeaa7
 ```
 
+### ERB Template Handling and Dynamic IDs
+
+The static scanner intelligently handles ERB templates with dynamic content, particularly for form inputs with dynamic IDs.
+
+#### How Dynamic IDs Are Preserved
+
+When the scanner encounters ERB templates with dynamic IDs, it preserves the structure instead of collapsing them:
+
+**Example ERB Template:**
+```erb
+<% question.collection_options.each do |option| %>
+  <input type="checkbox" 
+         id="collection_answers_<%= question.id %>_<%= option.id %>_"
+         name="collection_answers[<%= question.id %>][]" />
+  <%= label_tag "collection_answers_#{question.id}_#{option.id}_", option.value %>
+<% end %>
+```
+
+**How It's Processed:**
+- ERB expressions (`<%= question.id %>`, `<%= option.id %>`) are replaced with `ERB_CONTENT` placeholders
+- The structure is preserved: `collection_answers_ERB_CONTENT_ERB_CONTENT_`
+- This allows the scanner to correctly match inputs with their labels, even when IDs are dynamic
+
+#### Label Matching with Dynamic IDs
+
+The **Form Labels Check** correctly matches labels to inputs with dynamic IDs:
+- Input: `id="collection_answers_ERB_CONTENT_ERB_CONTENT_"`
+- Label: `for="collection_answers_ERB_CONTENT_ERB_CONTENT_"`
+- ✅ **Match found** - The scanner recognizes these as matching pairs
+
+#### Duplicate ID Detection
+
+The **Duplicate IDs Check** intelligently handles dynamic IDs:
+- IDs containing `ERB_CONTENT` are excluded from duplicate checking
+- These represent dynamic IDs that will have different values at runtime
+- Only static IDs (without ERB placeholders) are checked for duplicates
+- This prevents false positives for checkbox/radio groups in loops
+
+#### Links with href="#"
+
+The **Interactive Elements Check** correctly handles anchor links:
+- Only flags links with `href="#"` that have **no accessible name**
+- An accessible name can be: visible text, `aria-label`, or `aria-labelledby`
+- Links with `href="#"` that have proper labeling are **not flagged** (avoids false positives)
+
+**Example - Valid (not flagged):**
+```erb
+<%= link_to "Click me", "#", aria: { label: "Navigate to section" } %>
+```
+
+**Example - Invalid (flagged):**
+```erb
+<a href="#"></a>  <!-- No text, no aria-label, no aria-labelledby -->
+```
+
 ---
 
 ## Configuration & Profiles

data/docs_site/getting_started.md

@@ -142,14 +142,20 @@ end
 Rails Accessibility Testing runs **11 comprehensive checks** automatically. These checks are WCAG 2.1 AA aligned:
 
 1. **Form Labels** - All form inputs have associated labels
+   - ✅ Correctly handles dynamic IDs from ERB templates (e.g., `collection_answers_<%= question.id %>_<%= option.id %>_`)
+   - ✅ Matches labels to inputs even when IDs contain ERB expressions
 2. **Image Alt Text** - All images have descriptive alt attributes
 3. **Interactive Elements** - Buttons, links have accessible names
+   - ✅ Only flags links with `href="#"` that have no accessible name (visible text, `aria-label`, or `aria-labelledby`)
+   - ✅ Avoids false positives for valid anchor links with proper labeling
 4. **Heading Hierarchy** - Proper h1-h6 structure without skipping levels (checked across complete page: layout + view + partials)
 5. **Keyboard Accessibility** - All interactive elements are keyboard accessible
 6. **ARIA Landmarks** - Proper use of ARIA landmark roles (checked across complete page: layout + view + partials)
 7. **Form Error Associations** - Form errors are properly linked to form fields
 8. **Table Structure** - Tables have proper headers
 9. **Duplicate IDs** - No duplicate ID attributes (checked across complete page: layout + view + partials)
+   - ✅ Intelligently excludes dynamic IDs with ERB placeholders from duplicate checking
+   - ✅ Prevents false positives for checkbox/radio groups in loops
 10. **Skip Links** - Skip navigation links present
 11. **Color Contrast** - Text meets WCAG contrast requirements (optional, disabled by default)
 

data/docs_site/index.md

@@ -7,7 +7,7 @@ title: Home
 
 **The RSpec + RuboCop of accessibility for Rails. Catch WCAG violations before they reach production.**
 
-**Version:** 1.5.9
+**Version:** 1.6.0
 
 Rails Accessibility Testing is a comprehensive, opinionated but configurable gem that makes accessibility testing as natural as unit testing. It integrates seamlessly into your Rails workflow, catching accessibility issues as you code—not after deployment.
 
@@ -36,6 +36,10 @@ Rails Accessibility Testing fills a critical gap in the Rails testing ecosystem.
 - **Continuous monitoring**: Watches for file changes and re-scans automatically
 - **YAML configuration**: Fully configurable via `config/accessibility.yml`
 - **Reuses existing checks**: Leverages all 11 accessibility checks via RuleEngine
+- **Intelligent ERB handling**: Correctly processes dynamic IDs and ERB expressions
+  - Preserves structure of dynamic IDs (e.g., `collection_answers_<%= question.id %>_<%= option.id %>_`)
+  - Matches labels to inputs with dynamic IDs
+  - Excludes dynamic IDs from duplicate checking (prevents false positives)
 
 #### 🎯 Live Accessibility Scanner
 - **Real-time scanning**: Automatically scans pages as you browse during development
@@ -140,15 +144,15 @@ This will:
 
 The gem automatically runs **11 comprehensive accessibility checks**:
 
-1. ✅ **Form Labels** - All form inputs have associated labels
+1. ✅ **Form Labels** - All form inputs have associated labels (handles dynamic IDs from ERB templates)
 2. ✅ **Image Alt Text** - All images have descriptive alt attributes
-3. ✅ **Interactive Elements** - Buttons, links have accessible names (including links with images that have alt text)
+3. ✅ **Interactive Elements** - Buttons, links have accessible names (including links with images that have alt text; correctly handles links with `href="#"`)
 4. ✅ **Heading Hierarchy** - Proper h1-h6 structure (detects missing h1, multiple h1s, skipped levels, and h2+ without h1)
 5. ✅ **Keyboard Accessibility** - All interactive elements keyboard accessible
 6. ✅ **ARIA Landmarks** - Proper use of ARIA landmark roles
 7. ✅ **Form Error Associations** - Errors linked to form fields
 8. ✅ **Table Structure** - Tables have proper headers
-9. ✅ **Duplicate IDs** - No duplicate ID attributes
+9. ✅ **Duplicate IDs** - No duplicate ID attributes (intelligently handles dynamic IDs from ERB templates)
 10. ✅ **Skip Links** - Skip navigation links present (detects various patterns)
 11. ✅ **Color Contrast** - Text meets contrast requirements (optional)
 

data/lib/rails_accessibility_testing/checks/duplicate_ids_check.rb

@@ -6,6 +6,13 @@ module RailsAccessibilityTesting
     #
     # WCAG 2.1 AA: 4.1.1 Parsing (Level A)
     #
+    # @note ERB template handling:
+    #   - IDs containing "ERB_CONTENT" placeholders are excluded from duplicate checking
+    #   - These are dynamic IDs that will have different values at runtime
+    #   - Example: "collection_answers_ERB_CONTENT_ERB_CONTENT_" represents a dynamic ID
+    #     that will be unique for each checkbox/radio option when rendered
+    #   - Static analysis cannot determine if dynamic IDs will be duplicates, so they are skipped
+    #
     # @api private
     class DuplicateIdsCheck < BaseCheck
       def self.rule_name
@@ -14,7 +21,11 @@ module RailsAccessibilityTesting
       
       def check
         violations = []
-        all_ids = page.all('[id]').map { |el| el[:id] }.compact
+        # Collect all IDs, filtering out those with ERB_CONTENT placeholders
+        # IDs with ERB_CONTENT are dynamic and can't be statically verified for duplicates
+        # Example: "collection_answers_ERB_CONTENT_ERB_CONTENT_" - the actual IDs will be different at runtime
+        # because the ERB expressions will evaluate to different values
+        all_ids = page.all('[id]').map { |el| el[:id] }.compact.reject { |id| id.include?('ERB_CONTENT') }
         duplicates = all_ids.group_by(&:itself).select { |_k, v| v.length > 1 }.keys
         
         if duplicates.any?

data/lib/rails_accessibility_testing/checks/form_labels_check.rb

@@ -6,6 +6,15 @@ module RailsAccessibilityTesting
     #
     # WCAG 2.1 AA: 1.3.1 Info and Relationships (Level A)
     #
+    # @note ERB template handling:
+    #   - Dynamic IDs with ERB placeholders (e.g., "collection_answers_ERB_CONTENT_ERB_CONTENT_")
+    #     are matched against labels with the same ERB structure
+    #   - ErbExtractor ensures that IDs and label "for" attributes with matching ERB patterns
+    #     will have the same "ERB_CONTENT" placeholder structure, allowing exact matching
+    #   - This correctly handles cases like:
+    #     <input id="collection_answers_<%= question.id %>_<%= option.id %>_">
+    #     <%= label_tag "collection_answers_#{question.id}_#{option.id}_", option.value %>
+    #
     # @api private
     class FormLabelsCheck < BaseCheck
       def self.rule_name
@@ -16,11 +25,21 @@ module RailsAccessibilityTesting
         violations = []
         page_context = self.page_context
         
-        page.all('input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="url"], input[type="search"], input[type="date"], input[type="time"], input[type="datetime-local"], textarea, select').each do |input|
+        # Also check checkbox and radio inputs (they need labels too)
+        page.all('input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="url"], input[type="search"], input[type="date"], input[type="time"], input[type="datetime-local"], input[type="checkbox"], input[type="radio"], textarea, select').each do |input|
           id = input[:id]
           next if id.nil? || id.to_s.strip.empty?
           
+          # Skip ERB_CONTENT placeholder - it's not a real ID, just a marker for dynamic content
+          next if id == 'ERB_CONTENT'
+          
+          # Check for label with matching for attribute
+          # Handle ERB placeholders in IDs: ErbExtractor preserves the structure of dynamic IDs
+          # so "collection_answers_<%= question.id %>_<%= option.id %>_" becomes
+          # "collection_answers_ERB_CONTENT_ERB_CONTENT_", and label_tag with the same pattern
+          # will also become "collection_answers_ERB_CONTENT_ERB_CONTENT_", so they should match exactly
           has_label = page.has_css?("label[for='#{id}']", wait: false)
+          
           aria_label = input[:"aria-label"]
           aria_labelledby = input[:"aria-labelledby"]
           has_aria_label = aria_label && !aria_label.to_s.strip.empty?

data/lib/rails_accessibility_testing/checks/interactive_elements_check.rb

@@ -6,6 +6,12 @@ module RailsAccessibilityTesting
     #
     # WCAG 2.1 AA: 2.4.4 Link Purpose (Level A), 4.1.2 Name, Role, Value (Level A)
     #
+    # @note Links with href="#":
+    #   - Only flags anchors with href="#" that have NO accessible name
+    #   - An accessible name can be: visible text, aria-label, or aria-labelledby
+    #   - Links with href="#" that have visible text or ARIA attributes are valid and NOT flagged
+    #   - This avoids false positives for valid anchor links that use href="#" with proper labeling
+    #
     # @api private
     class InteractiveElementsCheck < BaseCheck
       def self.rule_name
@@ -45,6 +51,7 @@ module RailsAccessibilityTesting
           aria_label = element[:"aria-label"]
           aria_labelledby = element[:"aria-labelledby"]
           title = element[:title]
+          href = element[:href]
           
           # Check if element contains ERB placeholder (for static scanning)
           # ErbExtractor replaces <%= ... %> with "ERB_CONTENT" so we can detect it
@@ -68,12 +75,24 @@ module RailsAccessibilityTesting
           aria_labelledby_empty = aria_labelledby.nil? || aria_labelledby.to_s.strip.empty?
           title_empty = title.nil? || title.to_s.strip.empty?
           
+          # Only report violation if element has no accessible name
+          # For links with href="#", we only flag if they have no text AND no aria-label AND no aria-labelledby
+          # Links with href="#" that have visible text or ARIA attributes are valid and should not be flagged
           if text_empty && aria_label_empty && aria_labelledby_empty && title_empty && !has_image_with_alt
             element_ctx = element_context(element)
             tag = element.tag_name
             
+            # Special message for empty links with href="#"
+            # This rule correctly detects anchors with href="#" that have no accessible name,
+            # but avoids false positives when they have visible text or aria-label/aria-labelledby
+            message = if tag == 'a' && (href == '#' || href.to_s.strip == '#')
+              "Link missing accessible name [href: #]"
+            else
+              "#{tag.capitalize} missing accessible name"
+            end
+            
             violations << violation(
-              message: "#{tag.capitalize} missing accessible name",
+              message: message,
               element_context: element_ctx,
               wcag_reference: tag == 'a' ? "2.4.4" : "4.1.2",
               remediation: generate_remediation(tag, element_ctx)

data/lib/rails_accessibility_testing/composed_page_scanner.rb

@@ -203,6 +203,10 @@ module RailsAccessibilityTesting
           next if id.nil? || id.to_s.strip.empty?
           # Skip ERB_CONTENT placeholder - it's not a real ID
           next if id == 'ERB_CONTENT'
+          # Skip IDs that contain ERB_CONTENT - these are dynamic IDs that can't be statically verified
+          # Example: "collection_answers_ERB_CONTENT_ERB_CONTENT_" - the actual IDs will be different at runtime
+          # because the ERB expressions will evaluate to different values
+          next if id.include?('ERB_CONTENT')
           
           id_map[id] ||= []
           line = find_line_number_for_element(content, element)

data/lib/rails_accessibility_testing/erb_extractor.rb

@@ -4,6 +4,12 @@ module RailsAccessibilityTesting
   # Extracts HTML from ERB templates by converting Rails helpers to HTML
   # This allows static analysis of view files without rendering them
   #
+  # @note ERB and ID handling:
+  #   - Dynamic IDs like "collection_answers_<%= question.id %>_<%= option.id %>_" are preserved
+  #   - ERB expressions are replaced with "ERB_CONTENT" placeholder to maintain structure
+  #   - This ensures IDs like "collection_answers_ERB_CONTENT_ERB_CONTENT_" are not collapsed
+  #   - Labels with matching ERB structure will also have "ERB_CONTENT" and can be matched
+  #
   # @api private
   class ErbExtractor
     # Convert ERB template to HTML for static analysis
@@ -26,8 +32,57 @@ module RailsAccessibilityTesting
 
     private
 
+    # Convert raw HTML elements that have ERB in their attributes
+    # This handles cases like: <input id="collection_answers_<%= question.id %>_<%= option.id %>_">
+    # We need to preserve the structure of dynamic IDs so they don't get collapsed
+    # 
+    # @note This must run BEFORE remove_erb_tags to preserve ERB structure in attributes
+    def convert_raw_html_with_erb
+      # Handle input elements (checkbox, radio, text, etc.) with ERB in attributes
+      # Pattern: <input ... id="...<%= ... %>..." ... />
+      @content.gsub!(/<input\s+([^>]*?)>/i) do |match|
+        attrs = $1
+        # Replace ERB in attributes with placeholder, preserving structure
+        # This ensures "id='collection_answers_<%= question.id %>_<%= option.id %>_'" 
+        # becomes "id='collection_answers_ERB_CONTENT_ERB_CONTENT_'"
+        attrs_with_placeholders = attrs.gsub(/<%=(.*?)%>/m, 'ERB_CONTENT')
+        "<input #{attrs_with_placeholders}>"
+      end
+      
+      # Handle label_tag with string interpolation in first argument: <%= label_tag "collection_answers_#{question.id}_#{option.id}_", option.value %>
+      # This handles string interpolation like "collection_answers_#{question.id}_#{option.id}_"
+      # Must match BEFORE the simple string pattern
+      @content.gsub!(/<%=\s*label_tag\s+["']([^"']*#\{[^}]+\}[^"']*)["'],\s*([^,]+)(?:,\s*[^%]*)?%>/) do
+        id_template = $1
+        text_expr = $2
+        # Replace Ruby interpolation with placeholder
+        id_with_placeholder = id_template.gsub(/#\{[^}]+\}/, 'ERB_CONTENT')
+        # Handle text expression - could be a variable, string, or method call
+        text_placeholder = if text_expr.strip.match?(/^["']/)
+          # It's a string literal
+          text_expr.strip.gsub(/^["']|["']$/, '')
+        else
+          # It's a variable or method call - will produce content at runtime
+          'ERB_CONTENT'
+        end
+        "<label for=\"#{id_with_placeholder}\">#{text_placeholder}</label>"
+      end
+      
+      # Handle label_tag helper with simple string: <%= label_tag "id_string", "text", options %>
+      # Pattern: label_tag "id_string", "text", options
+      @content.gsub!(/<%=\s*label_tag\s+["']([^"']+)["'],\s*["']?([^"']*?)["']?[^%]*%>/) do
+        id = $1
+        text = $2
+        # Replace ERB in id string with placeholder (if any)
+        id_with_placeholder = id.gsub(/<%=(.*?)%>/m, 'ERB_CONTENT')
+        "<label for=\"#{id_with_placeholder}\">#{text}</label>"
+      end
+    end
+
     # Convert Rails helpers to placeholder HTML
     def convert_rails_helpers
+      # First, handle raw HTML elements with ERB in attributes (before removing ERB tags)
+      convert_raw_html_with_erb
       convert_form_helpers
       convert_image_helpers
       convert_link_helpers

data/lib/rails_accessibility_testing/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module RailsAccessibilityTesting
-  VERSION = "1.5.10"
+  VERSION = "1.6.0"
 end
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: rails_accessibility_testing
 version: !ruby/object:Gem::Version
-  version: 1.5.10
+  version: 1.6.0
 platform: ruby
 authors:
 - Regan Maharjan
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2025-12-01 00:00:00.000000000 Z
+date: 2025-12-11 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: axe-core-capybara