Merge pull request #3833 from pulibrary/3803-highlighting-background

Add background-color in highlighting that passes WCAG AAA with contrast ratio 8.27:1
pulibrary · Nov 15, 2023 · bbd3a95 · bbd3a95
2 parents c3806fb + 5241a4a
commit bbd3a95
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 0 deletions.
diff --git a/app/assets/stylesheets/components/search-results.scss b/app/assets/stylesheets/components/search-results.scss
@@ -89,3 +89,7 @@ dd.blacklight-electronic_access_display {
     margin: 1em 0 0.5em 0;
   }
 }
+
+em.highlight-query {
+    background-color: #FFFDD0;
+}
diff --git a/spec/features/accessibility_spec.rb b/spec/features/accessibility_spec.rb
@@ -27,4 +27,15 @@
         .excluding('.blacklight-series_display[dir="ltr"]:nth-child(1) > .more-in-series[title=""][data-toggle="tooltip"]')
     end
   end
+  context "search results page" do
+    before do
+      allow(Flipflop).to receive(:highlighting?).and_return(true)
+    end
+
+    it 'complies with wcag2aa wcag21a' do
+      visit '/catalog?q=black+teenagers'
+      expect(page).to be_axe_clean
+        .according_to(:wcag2a, :wcag2aa, :wcag21a, :wcag21aa)
+    end
+  end
 end