Merge pull request #107 from github/accessibility/issues/1430/migrate-a11y-rubocop-rules-no-positive-tabindex

Adrián Bolonio · web-flow · commit 3e11dc90d12d · 2022-08-01T16:23:45.000+02:00
Migrate accessibility rubocop rule `NoPositiveTabindex` from dotcom to erblint-github
diff --git a/config/accessibility.yml b/config/accessibility.yml
@@ -4,6 +4,9 @@ require:
 GitHub/Accessibility/ImageHasAlt:
   Enabled: true
   StyleGuide: https://github.com/github/rubocop-github/blob/master/guides/image-has-alt.md
+GitHub/Accessibility/NoPositiveTabindex:
+  Enabled: true
+  StyleGuide: https://github.com/github/rubocop-github/blob/master/guides/no-positive-tabindex.md
 GitHub/Accessibility/NoRedundantImageAlt:
   Enabled: true
-  StyleGuide: https://github.com/github/rubocop-github/blob/master/guides/no-redundant-image-alt.md
+  StyleGuide: https://github.com/github/rubocop-github/blob/master/guides/no-redundant-image-alt.md
diff --git a/guides/no-positive-tabindex.md b/guides/no-positive-tabindex.md
@@ -0,0 +1,24 @@
+# GitHub/Accessibility/NoPositiveTabindex
+
+## Rule Details
+
+Positive tabindex is error-prone and often inaccessible.
+
+## Resources
+
+- [F44: Failure of Success Criterion 2.4.3 due to using tabindex to create a tab order that does not preserve meaning and operability](https://www.w3.org/TR/WCAG20-TECHS/F44.html)
+- [Deque University: Avoid Using Tabindex with Positive Numbers](https://dequeuniversity.com/tips/tabindex-positive-numbers)
+
+## Examples
+### **Incorrect** code for this rule 👎
+
+```erb
+<%= button_tag "Continue", :tabindex => 3 %>
+```
+
+### **Correct** code for this rule  👍
+
+```erb
+<!-- good -->
+<%= button_tag "Continue", :tabindex => -1 %>
+```
diff --git a/lib/rubocop/cop/github/accessibility/no_positive_tabindex.rb b/lib/rubocop/cop/github/accessibility/no_positive_tabindex.rb
@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+require "rubocop"
+
+module RuboCop
+  module Cop
+    module GitHub
+      module Accessibility
+        class NoPositiveTabindex < Base
+          MSG = "Positive tabindex is error-prone and often inaccessible."
+
+          def on_send(node)
+            receiver, method_name, *args = *node
+            if receiver.nil?
+              args.select do |arg|
+                arg.type == :hash
+              end.each do |hash|
+                hash.each_pair do |key, value|
+                  next if key.type == :dsym
+                  next unless key.respond_to?(:value)
+                  if key.value == :tabindex && value.source.to_i > 0
+                    add_offense(hash)
+                  end
+                end
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end
diff --git a/test/test_no_positive_tabindex.rb b/test/test_no_positive_tabindex.rb
@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+require_relative "./cop_test"
+require "minitest/autorun"
+require "rubocop/cop/github/accessibility/no_positive_tabindex"
+
+class NoPositiveTabindex < CopTest
+  def cop_class
+    RuboCop::Cop::GitHub::Accessibility::NoPositiveTabindex
+  end
+
+  def test_no_positive_tabindex_alt_offense
+    offenses = erb_investigate cop, <<-ERB, "app/views/products/index.html.erb"
+      <%= button_tag "Continue", :tabindex => 3 %>
+    ERB
+
+    assert_equal 1, offenses.count
+    assert_equal "Positive tabindex is error-prone and often inaccessible.", offenses[0].message
+  end
+
+  def test_no_positive_tabindex_alt_no_offense
+    offenses = erb_investigate cop, <<-ERB, "app/views/products/index.html.erb"
+       <%= button_tag "Continue", :tabindex => -1 %>
+    ERB
+
+    assert_equal 0, offenses.count
+  end
+end
