From 2de35c291ae98025d96d366425bed3c2f0a73435 Mon Sep 17 00:00:00 2001 From: Albina Starykova Date: Wed, 10 Jul 2024 16:11:55 +0200 Subject: [PATCH] Add underscore as an alt text antipattern --- client/src/includes/a11y-result.test.ts | 3 ++- client/src/includes/a11y-result.ts | 2 +- docs/advanced_topics/accessibility_considerations.md | 2 +- docs/releases/6.2.md | 2 +- wagtail/admin/tests/test_userbar.py | 4 ++-- wagtail/admin/userbar.py | 2 +- 6 files changed, 8 insertions(+), 7 deletions(-) diff --git a/client/src/includes/a11y-result.test.ts b/client/src/includes/a11y-result.test.ts index fee973217769..fb184d4ceb7a 100644 --- a/client/src/includes/a11y-result.test.ts +++ b/client/src/includes/a11y-result.test.ts @@ -93,13 +93,14 @@ describe('addCustomChecks', () => { // Options for checkImageAltText function const options = { - pattern: '\\.(avif|gif|jpg|jpeg|png|svg|webp)$', + pattern: '\\.(avif|gif|jpg|jpeg|png|svg|webp)$|_', }; describe.each` text | result ${'Good alt text with words like GIFted and motif'} | ${true} ${'Bad alt text.png'} | ${false} + ${'Bad_alt_text'} | ${false} ${''} | ${true} `('checkImageAltText', ({ text, result }) => { const resultText = result ? 'should not be flagged' : 'should be flagged'; diff --git a/client/src/includes/a11y-result.ts b/client/src/includes/a11y-result.ts index 45ee165c9c0c..cff531b2bc3e 100644 --- a/client/src/includes/a11y-result.ts +++ b/client/src/includes/a11y-result.ts @@ -74,7 +74,7 @@ export const getAxeConfiguration = ( /** * Custom rule for checking image alt text. This rule checks if the alt text for images - * contains poor quality text like file extensions. + * contains poor quality text like file extensions or undescores. * The rule will be added via the Axe.configure() API. * https://github.com/dequelabs/axe-core/blob/master/doc/API.md#api-name-axeconfigure */ diff --git a/docs/advanced_topics/accessibility_considerations.md b/docs/advanced_topics/accessibility_considerations.md index fdb7fe0075fe..4c922ad86c26 100644 --- a/docs/advanced_topics/accessibility_considerations.md +++ b/docs/advanced_topics/accessibility_considerations.md @@ -142,7 +142,7 @@ By default, the checker includes the following rules to find common accessibilit - `input-button-name`: `` button elements must always have a text label. - `link-name`: `` link elements must always have a text label. - `p-as-heading`: This rule checks for paragraphs that are styled as headings. Paragraphs should not be styled as headings, as they don’t help users who rely on headings to navigate content. -- `alt-text-quality`: A custom rule ensures that image alt texts don't contain anti-patterns like file extensions. +- `alt-text-quality`: A custom rule ensures that image alt texts don't contain anti-patterns like file extensions and underscores. To customize how the checker is run (such as what rules to test), you can define a custom subclass of {class}`~wagtail.admin.userbar.AccessibilityItem` and override the attributes to your liking. Then, swap the instance of the default `AccessibilityItem` with an instance of your custom class via the [`construct_wagtail_userbar`](construct_wagtail_userbar) hook. diff --git a/docs/releases/6.2.md b/docs/releases/6.2.md index 7e55794ec8d1..d98c5d1f583d 100644 --- a/docs/releases/6.2.md +++ b/docs/releases/6.2.md @@ -13,7 +13,7 @@ depth: 1 ### Alt text accessibility check -The [built-in accessibility checker](authoring_accessible_content) now enforces a new `alt-text-quality` rule, which tests alt text for the presence of known bad patterns such as file extensions. This rule is enabled by default, but can be disabled if necessary. +The [built-in accessibility checker](authoring_accessible_content) now enforces a new `alt-text-quality` rule, which tests alt text for the presence of known bad patterns such as file extensions and underscores. This rule is enabled by default, but can be disabled if necessary. This feature was implemented by Albina Starykova, with support from the Wagtail accessibility team. diff --git a/wagtail/admin/tests/test_userbar.py b/wagtail/admin/tests/test_userbar.py index 83ff4d9feb6f..54c0d206a449 100644 --- a/wagtail/admin/tests/test_userbar.py +++ b/wagtail/admin/tests/test_userbar.py @@ -347,7 +347,7 @@ class CustomRulesAndChecksAccessibilityItem(AccessibilityItem): axe_custom_checks = [ { "id": "check-image-alt-text", - "options": {"pattern": "\\.[a-z]{1,4}$"}, + "options": {"pattern": "\\.[a-z]{1,4}$|_"}, }, ] @@ -402,7 +402,7 @@ def get_axe_custom_checks(self, request): "checks": [ { "id": "check-image-alt-text", - "options": {"pattern": "\\.[a-z]{1,4}$"}, + "options": {"pattern": "\\.[a-z]{1,4}$|_"}, }, { "id": "check-link-text", diff --git a/wagtail/admin/userbar.py b/wagtail/admin/userbar.py index 0274ed4cee53..ca4b670d2fdc 100644 --- a/wagtail/admin/userbar.py +++ b/wagtail/admin/userbar.py @@ -84,7 +84,7 @@ class AccessibilityItem(BaseItem): axe_custom_checks = [ { "id": "check-image-alt-text", - "options": {"pattern": "\\.(avif|gif|jpg|jpeg|png|svg|webp)$"}, + "options": {"pattern": "\\.(avif|gif|jpg|jpeg|png|svg|webp)$|_"}, }, ]