From 119ada7dcaafd8e2f3b86807a80a33b6067798af Mon Sep 17 00:00:00 2001
From: octopusinvitro <octopusinvitro@users.noreply.github.com>
Date: Mon, 26 Sep 2016 17:31:57 +0100
Subject: [PATCH] Use tidy-html5 to validate the term-table page

Errors corrected:
- An "img" element must have an "alt" attribute, except under certain
conditions. For details, consult guidance on providing text alternatives
for images. (All occurrences)
---
 t/web/term_table/phillipines.rb | 38 +++++++++++++++++++++++++++++++++
 views/term_table.erb            |  9 +++++---
 2 files changed, 44 insertions(+), 3 deletions(-)
 create mode 100644 t/web/term_table/phillipines.rb

diff --git a/t/web/term_table/phillipines.rb b/t/web/term_table/phillipines.rb
new file mode 100644
index 000000000..c5a3aec24
--- /dev/null
+++ b/t/web/term_table/phillipines.rb
@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+require 'test_helper'
+require_relative '../../../app'
+
+describe 'Phillipines' do
+  subject { Nokogiri::HTML(last_response.body) }
+  let(:dina)     { subject.css('#mem-c5c42ac6-4942-4c32-baf7-3dae194f83bf') }
+  let(:dimaporo) { subject.css('#mem-236420bc-a15a-4727-a98a-75f870c5641f') }
+  let(:tiangco)  { subject.css('#mem-8fd6197f-f9fa-47a8-974f-50c54f08bbdd') }
+
+  before do
+    stub_popolo('ba933fa', 'Philippines/House')
+    get '/philippines/house/term-table/16.html'
+  end
+
+  describe 'alt attribute on avatars' do
+    it 'has the person name in a normal image' do
+      img = dina.css('img.person-card__image')
+      img.attr('alt').text.must_equal 'Member headshot for Abad, Henedina R.'
+    end
+
+    it 'has the person name in a placeholder image' do
+      img = dimaporo.css('img.person-card__image')
+      img.attr('alt').text.must_equal 'Placeholder image for Dimaporo, Abdullah D.'
+    end
+
+    it 'doesnt break for names with double quotes' do
+      img = tiangco.css('img.person-card__image')
+      img.attr('alt').text.must_equal 'Member headshot for Tiangco, Tobias "Toby" M.'
+    end
+  end
+
+  describe 'HTML validation' do
+    it 'has no errors in the term-table page' do
+      last_response_must_be_valid
+    end
+  end
+end
diff --git a/views/term_table.erb b/views/term_table.erb
index 34cd5d401..4fc2f3150 100644
--- a/views/term_table.erb
+++ b/views/term_table.erb
@@ -140,10 +140,13 @@
                             <img src="/images/person-placeholder-108px.png"
                                  data-src="<%= person.proxy_image %>"
                                  style="display: none"
-                                 class="person-card__image">
-                            <noscript><img src="<%= person.proxy_image %>" class="person-card__image"></noscript>
+                                 class="person-card__image"
+                                 alt="Member headshot for <%= h person.name %>">
+                            <noscript><img src="<%= person.proxy_image %>" class="person-card__image"
+                            alt="Member headshot for <%= h person.name %>"></noscript>
                           <% else %>
-                            <img src="/images/person-placeholder-108px.png" class="person-card__image">
+                            <img src="/images/person-placeholder-108px.png" class="person-card__image"
+                            alt="Placeholder image for <%= h person.name %>">
                           <% end %>
 
                             <h3 class="person-card__name"><%= person.name %></h3>