From 9a74c7b99bf0ac901f86bb38372a68e157cf9c73 Mon Sep 17 00:00:00 2001 From: Cameron Cundiff Date: Wed, 16 Aug 2017 14:34:02 -0400 Subject: Do not generate default alt text in image tags - Auto-generating content from the filename of an image is not suitable alternative text; alt text that isn't fully considered can be distracting and fatiguing for screen readers users (blind, low vision, dyslexic people). - Setting a filename fallback short circuits screen reader default behavior and configuration for blank descriptions. - Setting poor defaults also creates false negatives for accessibility linting and testing software, that makes it harder to improve application accessibility. *** - After this change, if authors leave images without alt text, screen readers will fallback to default behavior for missing alt text. - Also with this change, Automated linting and testing tools will correctly generate warnings. [Fixes #30096] --- actionview/CHANGELOG.md | 6 ++++ .../lib/action_view/helpers/asset_tag_helper.rb | 22 ++++++--------- actionview/test/template/asset_tag_helper_test.rb | 32 +++++++++++----------- 3 files changed, 31 insertions(+), 29 deletions(-) (limited to 'actionview') diff --git a/actionview/CHANGELOG.md b/actionview/CHANGELOG.md index 5bc93fcb5b..b22686d1d8 100644 --- a/actionview/CHANGELOG.md +++ b/actionview/CHANGELOG.md @@ -1,3 +1,9 @@ +* Remove default `alt` text generation. + + Fixes #30096 + + *Cameron Cundiff* + * Add `srcset` option to `image_tag` helper. *Roberto Miranda* diff --git a/actionview/lib/action_view/helpers/asset_tag_helper.rb b/actionview/lib/action_view/helpers/asset_tag_helper.rb index 82b0fcbf2e..4557c76dfe 100644 --- a/actionview/lib/action_view/helpers/asset_tag_helper.rb +++ b/actionview/lib/action_view/helpers/asset_tag_helper.rb @@ -13,7 +13,7 @@ module ActionView # the assets exist before linking to them: # # image_tag("rails.png") - # # => Rails + # # => # stylesheet_link_tag("application") # # => module AssetTagHelper @@ -207,8 +207,6 @@ module ActionView # You can add HTML attributes using the +options+. The +options+ supports # additional keys for convenience and conformance: # - # * :alt - If no alt text is given, the file name part of the - # +source+ is used (capitalized and without the extension) # * :size - Supplied as "{Width}x{Height}" or "{Number}", so "30x45" becomes # width="30" and height="45", and "50" becomes width="50" and height="50". # :size will be ignored if the value is not in the correct format. @@ -220,17 +218,17 @@ module ActionView # Assets (images that are part of your app): # # image_tag("icon") - # # => Icon + # # => # image_tag("icon.png") - # # => Icon + # # => # image_tag("icon.png", size: "16x10", alt: "Edit Entry") # # => Edit Entry # image_tag("/icons/icon.gif", size: "16") - # # => Icon + # # => # image_tag("/icons/icon.gif", height: '32', width: '32') - # # => Icon + # # => # image_tag("/icons/icon.gif", class: "menu_icon") - # # => Icon + # # => # image_tag("/icons/icon.gif", data: { title: 'Rails Application' }) # # => # image_tag("icon.png", srcset: { "icon_2x.png" => "2x", "icon_4x.png" => "4x" }) @@ -251,11 +249,7 @@ module ActionView check_for_image_tag_errors(options) skip_pipeline = options.delete(:skip_pipeline) - src = options[:src] = resolve_image_source(source, skip_pipeline) - - unless src.start_with?("cid:") || src.start_with?("data:") || src.blank? - options[:alt] = options.fetch(:alt) { image_alt(src) } - end + options[:src] = resolve_image_source(source, skip_pipeline) if options[:srcset] && !options[:srcset].is_a?(String) options[:srcset] = options[:srcset].map do |src_path, size| @@ -286,6 +280,8 @@ module ActionView # image_alt('underscored_file_name.png') # # => Underscored file name def image_alt(src) + ActiveSupport::Deprecation.warn("image_alt is deprecated and will be removed from Rails 6.0. You must explicitly set alt text on images.") + File.basename(src, ".*".freeze).sub(/-[[:xdigit:]]{32,64}\z/, "".freeze).tr("-_".freeze, " ".freeze).capitalize end diff --git a/actionview/test/template/asset_tag_helper_test.rb b/actionview/test/template/asset_tag_helper_test.rb index 5b8e50cc5e..d5d4925f54 100644 --- a/actionview/test/template/asset_tag_helper_test.rb +++ b/actionview/test/template/asset_tag_helper_test.rb @@ -183,26 +183,26 @@ class AssetTagHelperTest < ActionView::TestCase } ImageLinkToTag = { - %(image_tag("xml.png")) => %(Xml), + %(image_tag("xml.png")) => %(), %(image_tag("rss.gif", :alt => "rss syndication")) => %(rss syndication), - %(image_tag("gold.png", :size => "20")) => %(Gold), - %(image_tag("gold.png", :size => 20)) => %(Gold), - %(image_tag("gold.png", :size => "45x70")) => %(Gold), - %(image_tag("gold.png", "size" => "45x70")) => %(Gold), - %(image_tag("error.png", "size" => "45 x 70")) => %(Error), - %(image_tag("error.png", "size" => "x")) => %(Error), - %(image_tag("google.com.png")) => %(Google.com), - %(image_tag("slash..png")) => %(Slash.), - %(image_tag(".pdf.png")) => %(.pdf), - %(image_tag("http://www.rubyonrails.com/images/rails.png")) => %(Rails), - %(image_tag("//www.rubyonrails.com/images/rails.png")) => %(Rails), + %(image_tag("gold.png", :size => "20")) => %(), + %(image_tag("gold.png", :size => 20)) => %(), + %(image_tag("gold.png", :size => "45x70")) => %(), + %(image_tag("gold.png", "size" => "45x70")) => %(), + %(image_tag("error.png", "size" => "45 x 70")) => %(), + %(image_tag("error.png", "size" => "x")) => %(), + %(image_tag("google.com.png")) => %(), + %(image_tag("slash..png")) => %(), + %(image_tag(".pdf.png")) => %(), + %(image_tag("http://www.rubyonrails.com/images/rails.png")) => %(), + %(image_tag("//www.rubyonrails.com/images/rails.png")) => %(), %(image_tag("mouse.png", :alt => nil)) => %(), %(image_tag("data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==", :alt => nil)) => %(), %(image_tag("")) => %(), - %(image_tag("gold.png", data: { title: 'Rails Application' })) => %(Gold), - %(image_tag("rss.gif", srcset: "/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w")) => %(Rss), - %(image_tag("rss.gif", srcset: { "pic_640.jpg" => "640w", "pic_1024.jpg" => "1024w" })) => %(Rss), - %(image_tag("rss.gif", srcset: [["pic_640.jpg", "640w"], ["pic_1024.jpg", "1024w"]])) => %(Rss) + %(image_tag("gold.png", data: { title: 'Rails Application' })) => %(), + %(image_tag("rss.gif", srcset: "/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w")) => %(), + %(image_tag("rss.gif", srcset: { "pic_640.jpg" => "640w", "pic_1024.jpg" => "1024w" })) => %(), + %(image_tag("rss.gif", srcset: [["pic_640.jpg", "640w"], ["pic_1024.jpg", "1024w"]])) => %() } FaviconLinkToTag = { -- cgit v1.2.3