Merge pull request #115 from github/kh-fix-visually-hidden-bug

Simplify no-visually-hidden-interactive-elements and fix bug

Author: khiga8

README.md

@@ -41,6 +41,7 @@ inherit_gem:
 - [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)
+- [GitHub::Accessibility::NoVisuallyHiddenInteractiveElements](./docs/rules/accessibility/no-visually-hidden-interactive-elements.md)
 - [GitHub::Accessibility::NoTitleAttribute](./docs/rules/accessibility/no-title-attribute.md)
 - [GitHub::Accessibility::SvgHasAccessibleText](./docs/rules/accessibility/svg-has-accessible-text.md)
 

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

@@ -14,14 +14,10 @@ class NoVisuallyHiddenInteractiveElements < Linter
           MESSAGE = "Avoid visually hidding interactive elements. Visually hiding interactive elements can be confusing to sighted keyboard users as it appears their focus has been lost when they navigate to the hidden element"
 
           def run(processed_source)
-            visually_hidden = false
-
             tags(processed_source).each do |tag|
               next if tag.closing?
               classes = possible_attribute_values(tag, "class")
-              visually_hidden = true if classes.include?("sr-only")
-              next unless classes.include?("sr-only") || visually_hidden
-              if INTERACTIVE_ELEMENTS.include?(tag.name)
+              if classes.include?("sr-only") && INTERACTIVE_ELEMENTS.include?(tag.name)
                 generate_offense(self.class, processed_source, tag)
               end
             end

test/linters/accessibility/no_visually_hidden_interactive_elements_test.rb

@@ -38,12 +38,13 @@ def test_does_not_warn_if_element_is_interactive_and_shown_on_focus
     assert_empty @linter.offenses
   end
 
-  def test_warn_if_element_is_interactive_in_a_visually_hidden_parent
-    @file = "<div class='sr-only'><button>Submit</button></div>"
+  def test_does_not_warn_on_unexpected_elements
+    @file = <<~ERB
+      <span class="sr-only"></span>
+      <button></button>
+    ERB
     @linter.run(processed_source)
 
-    assert_equal(1, @linter.offenses.count)
-    error_messages = @linter.offenses.map(&:message).sort
-    assert_match(/Avoid visually hidding interactive elements. Visually hiding interactive elements can be confusing to sighted keyboard users as it appears their focus has been lost when they navigate to the hidden element/, error_messages.last)
+    assert_empty @linter.offenses
   end
 end