Port over no positive tabindex rule

Add tests and documentation

Author: khiga8

README.md

@@ -31,6 +31,8 @@ linters:
     enabled: true
   GitHub::Accessibility::NoAriaLabelMisuse:
     enabled: true
+  GitHub::Accessibility::NoPositiveTabIndex:
+    enabled: true
   GitHub::Accessibility::NoRedundantImageAlt:
     enabled: true
 ```
@@ -41,6 +43,7 @@ linters:
 - [GitHub::Accessibility::IframeHasTitle](./docs/rules/accessibility/iframe-has-title.md)
 - [GitHub::Accessibility::ImageHasAlt](./docs/rules/accessibility/image-has-alt.md)
 - [GitHub::Accessibility::NoAriaLabelMisuse](./docs/rules/accessibility/no-aria-label-misuse.md)
+- [GitHub::Accessibility::NoPositiveTabIndex](./docs/rules/accessibility/no-positive-tab-index.md)
 - [GitHub::Accessibility::NoRedundantImageAlt](./docs/rules/accessibility/no-redundant-image-alt.md)
 
 ## Testing

docs/rules/accessibility/no-positive-tab-index.md

@@ -0,0 +1,29 @@
+# No positive tab index
+
+## Rule Details
+
+Do not positive tabindex as it is error prone and can severely disrupt navigation experience for keyboard users.
+
+Learn more at:
+
+- [A11yProject: Use the tabindex attribute](https://www.a11yproject.com/posts/how-to-use-the-tabindex-attribute/)
+- [Deque: Avoid using Tabindex with positive numbers](https://dequeuniversity.com/tips/tabindex-positive-numbers)
+
+### 👎 Examples of **incorrect** code for this rule:
+
+```erb
+<button tabindex="3"></button>
+<button tabindex="1"></button>
+```
+
+### 👍 Examples of **correct** code for this rule:
+
+```erb
+<!-- good -->
+<button tabindex="0"></button>
+```
+
+```erb
+<!-- also good -->
+<button tabindex="-1"></button>
+```

lib/erblint-github/linters/github/accessibility/no_positive_tab_index.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+require_relative "../../custom_helpers"
+
+module ERBLint
+  module Linters
+    module GitHub
+      module Accessibility
+        class NoPositiveTabIndex < Linter
+          include ERBLint::Linters::CustomHelpers
+          include LinterRegistry
+
+          MESSAGE = "Do not use positive tabindex as it is error prone and can severely disrupt navigation experience for keyboard users"
+
+          def run(processed_source)
+            tags(processed_source).each do |tag|
+              next if tag.closing?
+              next unless tag.attributes["tabindex"]&.value.to_i.positive?
+
+              generate_offense(self.class, processed_source, tag)
+            end
+
+            rule_disabled?(processed_source)
+          end
+        end
+      end
+    end
+  end
+end

test/linters/accessibility/no_positive_tab_index_test.rb

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+require "test_helper"
+
+class NoPositiveTabIndexTest < LinterTestCase
+  def linter_class
+    ERBLint::Linters::GitHub::Accessibility::NoPositiveTabIndex
+  end
+
+  def test_warns_if_positive_tabindex_is_used
+    @file = "<button tabindex='1'></button>"
+    @linter.run(processed_source)
+
+    refute_empty @linter.offenses
+  end
+
+  def test_does_not_warn_if_negative_tabindex_is_used
+    @file = "<button tabindex='-1'></button>"
+    @linter.run(processed_source)
+
+    assert_empty @linter.offenses
+  end
+
+  def test_does_not_warn_if_zero_tabindex_is_used
+    @file = "<button tabindex='0'></button>"
+    @linter.run(processed_source)
+
+    assert_empty @linter.offenses
+  end
+end