From 19eb191a0ab31f82d41c9dd418d2caad3745bdcf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adri=C3=A1n=20Bolonio?= Date: Thu, 28 Jul 2022 13:45:50 +0000 Subject: [PATCH 1/3] Add new a11y rubocop rule: NoRedundantImageAlt --- .../github/rails_no_redundant_image_alt.rb | 38 +++++++++++++++++++ test/test_rails_no_redundant_image_alt.rb | 28 ++++++++++++++ 2 files changed, 66 insertions(+) create mode 100644 lib/rubocop/cop/github/rails_no_redundant_image_alt.rb create mode 100644 test/test_rails_no_redundant_image_alt.rb diff --git a/lib/rubocop/cop/github/rails_no_redundant_image_alt.rb b/lib/rubocop/cop/github/rails_no_redundant_image_alt.rb new file mode 100644 index 00000000..0f84a872 --- /dev/null +++ b/lib/rubocop/cop/github/rails_no_redundant_image_alt.rb @@ -0,0 +1,38 @@ +# frozen_string_literal: true + +require "rubocop" + +module RuboCop + module Cop + module GitHub + module Accessibility + class NoRedundantImageAlt < Base + MSG = "Alt prop should not contain `image` or `picture` as screen readers already announce the element as an image" + REDUNDANT_ALT_WORDS = %w(image picture) + + def_node_search :redundant_alt?, "(pair (sym :alt) (str #contains_redundant_alt_text?))" + + def on_send(node) + receiver, method_name, _= *node + + if receiver.nil? && method_name == :image_tag + if redundant_alt?(node) + add_offense(node.loc.selector) + end + end + end + + private + + def contains_redundant_alt_text?(string) + return false if string.empty? + + if (string.downcase.split & REDUNDANT_ALT_WORDS).any? + return true + end + end + end + end + end + end +end diff --git a/test/test_rails_no_redundant_image_alt.rb b/test/test_rails_no_redundant_image_alt.rb new file mode 100644 index 00000000..43101bb6 --- /dev/null +++ b/test/test_rails_no_redundant_image_alt.rb @@ -0,0 +1,28 @@ +# frozen_string_literal: true + +require_relative "./cop_test" +require "minitest/autorun" +require "rubocop/cop/github/rails_no_redundant_image_alt" + +class NoRedundantImageAlt < CopTest + def cop_class + RuboCop::Cop::GitHub::Accessibility::NoRedundantImageAlt + end + + def test_no_redundant_image_alt_offense + offenses = erb_investigate cop, <<-ERB, "app/views/products/index.html.erb" + <%= image_tag "cat.gif", size: "12x12", alt: "Picture of a cat" %> + ERB + + assert_equal 1, offenses.count + assert_equal "Alt prop should not contain `image` or `picture` as screen readers already announce the element as an image", offenses[0].message + end + + def test_no_redundant_image_alt_no_offense + offenses = erb_investigate cop, <<-ERB, "app/views/products/index.html.erb" + <%= image_tag "cat.gif", size: "12x12", alt: "A black cat" %> + ERB + + assert_equal 0, offenses.count + end +end From fd729fafefdd120f9763f432b3410cd64e8d405a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adri=C3=A1n=20Bolonio?= Date: Mon, 1 Aug 2022 09:10:09 +0000 Subject: [PATCH 2/3] Add documentation, Move to accessibility folder, Add config --- config/accessibility.yml | 5 +++- guides/no-redundant-image-alt.md | 24 +++++++++++++++++++ .../no_redundant_image_alt.rb} | 0 .../test_no_redundant_image_alt.rb} | 2 +- 4 files changed, 29 insertions(+), 2 deletions(-) create mode 100644 guides/no-redundant-image-alt.md rename lib/rubocop/cop/github/{rails_no_redundant_image_alt.rb => accessibility/no_redundant_image_alt.rb} (100%) rename test/{test_rails_no_redundant_image_alt.rb => accessibility/test_no_redundant_image_alt.rb} (92%) diff --git a/config/accessibility.yml b/config/accessibility.yml index 00f871c6..0b140de7 100644 --- a/config/accessibility.yml +++ b/config/accessibility.yml @@ -3,4 +3,7 @@ require: GitHub/Accessibility/ImageHasAlt: Enabled: true - StyleGuide: https://github.com/github/rubocop-github/blob/master/guides/image-has-alt.md \ No newline at end of file + StyleGuide: https://github.com/github/rubocop-github/blob/master/guides/image-has-alt.md +GitHub/Accessibility/NoRedundantImageAlt: + Enabled: true + StyleGuide: https://github.com/github/rubocop-github/blob/master/guides/no-redundant-image-alt.md \ No newline at end of file diff --git a/guides/no-redundant-image-alt.md b/guides/no-redundant-image-alt.md new file mode 100644 index 00000000..2e4fad7f --- /dev/null +++ b/guides/no-redundant-image-alt.md @@ -0,0 +1,24 @@ +# GitHub/Accessibility/NoRedundantImageAlt + +## Rule Details + +Alt prop should not contain `image` or `picture` as screen readers already announce the element as an image + +## Resources + +- [W3C WAI Images Tutorial](https://www.w3.org/WAI/tutorials/images/) +- [Primer: Alternative text for images](https://primer.style/design/accessibility/alternative-text-for-images) + +## Examples +### **Incorrect** code for this rule 👎 + +```erb +<%= image_tag "cat.gif", size: "12x12", alt: "Picture of a cat" %> +``` + +### **Correct** code for this rule 👍 + +```erb + +<%= image_tag "cat.gif", size: "12x12", alt: "A black cat" %> +``` diff --git a/lib/rubocop/cop/github/rails_no_redundant_image_alt.rb b/lib/rubocop/cop/github/accessibility/no_redundant_image_alt.rb similarity index 100% rename from lib/rubocop/cop/github/rails_no_redundant_image_alt.rb rename to lib/rubocop/cop/github/accessibility/no_redundant_image_alt.rb diff --git a/test/test_rails_no_redundant_image_alt.rb b/test/accessibility/test_no_redundant_image_alt.rb similarity index 92% rename from test/test_rails_no_redundant_image_alt.rb rename to test/accessibility/test_no_redundant_image_alt.rb index 43101bb6..c8e91641 100644 --- a/test/test_rails_no_redundant_image_alt.rb +++ b/test/accessibility/test_no_redundant_image_alt.rb @@ -2,7 +2,7 @@ require_relative "./cop_test" require "minitest/autorun" -require "rubocop/cop/github/rails_no_redundant_image_alt" +require "rubocop/cop/github/accessibility/no_redundant_image_alt" class NoRedundantImageAlt < CopTest def cop_class From 039822b9bc527c686a70c67380322dbd9b2ee50d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adri=C3=A1n=20Bolonio?= Date: Mon, 1 Aug 2022 09:39:43 +0000 Subject: [PATCH 3/3] Move tests --- test/{accessibility => }/test_image_has_alt.rb | 0 test/{accessibility => }/test_no_redundant_image_alt.rb | 0 2 files changed, 0 insertions(+), 0 deletions(-) rename test/{accessibility => }/test_image_has_alt.rb (100%) rename test/{accessibility => }/test_no_redundant_image_alt.rb (100%) diff --git a/test/accessibility/test_image_has_alt.rb b/test/test_image_has_alt.rb similarity index 100% rename from test/accessibility/test_image_has_alt.rb rename to test/test_image_has_alt.rb diff --git a/test/accessibility/test_no_redundant_image_alt.rb b/test/test_no_redundant_image_alt.rb similarity index 100% rename from test/accessibility/test_no_redundant_image_alt.rb rename to test/test_no_redundant_image_alt.rb