From 96b62de6c52e0fe951d02d1e567cd1539bd892fc Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 23 Apr 2026 21:39:59 +0000
Subject: [PATCH 1/3] Initial plan


From f1439a740480b9b3e9198a7183baa4adfcb9ff23 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 23 Apr 2026 21:45:49 +0000
Subject: [PATCH 2/3] Add ACCESSIBILITY-REVIEW-PLAN.md and
 ACCESSIBILITY-GITHUB-PROJECT-PLAN.md

Agent-Logs-Url: https://github.com/az-digital/az_quickstart/sessions/388d36cd-bce9-4b55-93f5-5b0a4da60aa1

Co-authored-by: accesswatch <70671938+accesswatch@users.noreply.github.com>
---
 ACCESSIBILITY-GITHUB-PROJECT-PLAN.md | 477 ++++++++++++++++++++++++++
 ACCESSIBILITY-REVIEW-PLAN.md         | 489 +++++++++++++++++++++++++++
 2 files changed, 966 insertions(+)
 create mode 100644 ACCESSIBILITY-GITHUB-PROJECT-PLAN.md
 create mode 100644 ACCESSIBILITY-REVIEW-PLAN.md

diff --git a/ACCESSIBILITY-GITHUB-PROJECT-PLAN.md b/ACCESSIBILITY-GITHUB-PROJECT-PLAN.md
new file mode 100644
index 0000000000..bcebd40ce5
--- /dev/null
+++ b/ACCESSIBILITY-GITHUB-PROJECT-PLAN.md
@@ -0,0 +1,477 @@
+# Accessibility GitHub Project Plan: az_quickstart WCAG 2.2 AA
+
+## Purpose
+
+This document defines the phased delivery structure, issue taxonomy, and
+GitHub project organization for the az_quickstart accessibility program. It
+translates the findings documented in `ACCESSIBILITY-REVIEW-PLAN.md` into
+actionable, sequenced work.
+
+---
+
+## Program overview
+
+| Attribute | Value |
+|-----------|-------|
+| Standard targeted | WCAG 2.2 Level AA |
+| Primary user benefit | Keyboard and screen reader access to core user journeys |
+| Release risk approach | Phase by impact; guard against regression in CI |
+| Source of truth | `ACCESSIBILITY-REVIEW-PLAN.md` (findings) + this file (delivery) |
+
+---
+
+## Phase structure
+
+### Phase 0 — Accessibility guardrails and verification setup
+
+**Goal:** Establish baseline measurement and CI guardrails before any
+functional changes are made. Without a baseline it is impossible to verify
+that later fixes work or to detect regressions in future releases.
+
+**Deliverables:**
+
+- [ ] Configure an automated axe scan step in CI (`ci.yml`) that runs against
+  the demo site installed in the `install` job, targeting the verification
+  matrix pages defined in `ACCESSIBILITY-REVIEW-PLAN.md`.
+- [ ] Capture and commit baseline axe scan output so regressions become
+  detectable.
+- [ ] Document the manual testing procedure (keyboard walk-through steps and
+  screen reader pairings) as a reusable checklist for PR reviews.
+- [ ] Confirm the answers to the four open questions in
+  `ACCESSIBILITY-REVIEW-PLAN.md` with the team before Phase 1 work begins.
+
+**Exit criteria:**
+Automated axe scan runs on every PR without blocking merges (informational
+mode). Team has agreed answers to the four open questions.
+
+---
+
+### Phase 1 — Global user experience blockers
+
+**Goal:** Fix the highest-impact, most broadly felt barriers first. Every page
+in the site is affected by at least one Phase 1 item.
+
+**Deliverables:**
+
+#### 1.1 Fix broken skip-to-main-content link
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §1
+
+**WCAG SC:** 2.4.1 Bypass Blocks (Level A)
+
+**Files to change:**
+- `themes/custom/az_barrio/templates/layout/page.html.twig`
+
+**Change:** Add `id="content"` to the `<main>` element so the skip link
+`href="#content"` in `html.html.twig` resolves correctly.
+
+```twig
+{# Before #}
+<main{{ content_attributes }}>
+
+{# After #}
+<main id="content"{{ content_attributes }}>
+```
+
+**Acceptance test:** Activate the skip link (Tab to it, press Enter). Focus
+must move to the `<main>` element and the page must scroll to main content.
+
+---
+
+#### 1.2 Fix pager: `aria-labelledby` and `aria-current`
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §5
+
+**WCAG SC:** 1.3.1 Info and Relationships (Level A); 2.4.6 Headings and Labels
+(Level AA)
+
+**Files to change:**
+- `themes/custom/az_barrio/templates/navigation/pager.html.twig`
+
+**Changes:**
+1. Replace `aria-label="{{ heading_id }}"` with
+   `aria-labelledby="{{ heading_id }}"` on the `<nav>` element.
+2. Add `aria-current="page"` to the current page `<span>`.
+
+**Acceptance test:**
+- Screen reader announces the nav landmark as "Pagination" (from the visually
+  hidden heading), not as a raw ID string.
+- Screen reader announces `aria-current="page"` on the current page item.
+
+---
+
+#### 1.3 Remove redundant `role="contentinfo"` from footer inner div
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §2
+
+**WCAG SC:** 4.1.2 Name, Role, Value (Level AA)
+
+**Files to change:**
+- `themes/custom/az_barrio/templates/layout/page.html.twig`
+
+**Change:** Remove `role="contentinfo"` from the `<div>` inside `<footer>`.
+The `<footer>` element already carries the implicit `contentinfo` landmark.
+
+**Acceptance test:**
+Landmarks list in a screen reader shows exactly one `contentinfo` region per
+page.
+
+---
+
+### Phase 2 — High-risk interactive components
+
+**Goal:** Repair custom interaction patterns that have the highest probability
+of blocking assistive technology users mid-task.
+
+**Deliverables:**
+
+#### 2.1 Fix accordion ARIA relationships
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §4
+
+**WCAG SC:** 4.1.2 Name, Role, Value (Level AA)
+
+**Files to change:**
+- `modules/custom/az_accordion/templates/az-accordion.html.twig`
+
+**Changes:**
+1. Add a unique ID to the accordion button:
+   `id="{{ accordion_item_id }}-button"`.
+2. Change `aria-labelledby="{{ accordion_item_id }}"` on the panel to
+   `aria-labelledby="{{ accordion_item_id }}-button"`.
+3. Change `data-bs-parent="#{{ accordion_item_id }}"` to
+   `data-bs-parent="#{{ accordion_container_id }}"` so Bootstrap correctly
+   collapses siblings.
+
+**Acceptance test:**
+- Screen reader announces the accordion panel name using the heading button
+  text, not the panel body text.
+- Expanding one accordion item in a multi-item group collapses previously
+  expanded siblings.
+
+---
+
+#### 2.2 Fix alphabetical listing: nav label, live region, and href bug
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §6
+
+**WCAG SC:** 2.4.6 Headings and Labels (Level AA); 4.1.3 Status Messages
+(Level AA)
+
+**Files to change:**
+- `modules/custom/az_alphabetical_listing/templates/views-view--az-alphabetical-listing.html.twig`
+- `modules/custom/az_alphabetical_listing/js/alphabetical_listing.js`
+
+**Changes:**
+
+*Template:*
+1. Add `aria-label="{{ 'Alphabetical navigation'|t }}"` to the `<nav>`
+   element.
+2. Add a visually hidden live region adjacent to the search input:
+
+```twig
+<div id="az-js-alphabetical-listing-status"
+     role="status"
+     aria-live="polite"
+     aria-atomic="true"
+     class="visually-hidden"></div>
+```
+
+*JavaScript:*
+3. In the `azAlphabeticalListingCheckNoResults` function, update the live
+   region text when results change:
+
+```js
+const statusRegion = document.getElementById(
+  'az-js-alphabetical-listing-status',
+);
+if (statusRegion) {
+  const count = document.querySelectorAll(
+    '.az-js-alphabetical-listing-search-result:not(.hide-result)',
+  ).length;
+  statusRegion.textContent = count === 0
+    ? Drupal.t('No results found.')
+    : Drupal.t('@count results found.', { '@count': count });
+}
+```
+
+4. Fix the `href` assignment bug: prepend `#` when setting the anchor href:
+
+```js
+// Before
+navTarget.attr('href', $(element).attr('id'));
+
+// After
+navTarget.attr('href', '#' + $(element).attr('id'));
+```
+
+**Acceptance test:**
+- Landmarks list shows the alpha nav with the name "Alphabetical navigation".
+- After typing in the search field, a screen reader announces the result count.
+- Keyboard activation of an alpha letter link scrolls to and focuses the
+  corresponding section anchor on the same page without navigating to a
+  new URL.
+
+---
+
+#### 2.3 Fix select menu: accessible form name and `aria-disabled` on select
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §7
+
+**WCAG SC:** 1.3.1 Info and Relationships (Level A); 4.1.2 Name, Role, Value
+(Level AA)
+
+**Files to change:**
+- `modules/custom/az_select_menu/templates/az-select-menu.html.twig`
+- `modules/custom/az_select_menu/js/az-select-menu.js`
+
+**Changes:**
+
+*Template:*
+1. Add `aria-label` to the `<form>` element sourced from
+   `preform_text_sr_only` (falling back to `preform_text`):
+
+```twig
+<form {{ form_attributes }}
+  aria-label="{{ menu_block_configuration.az_select_menu.preform_text_sr_only
+    ?: menu_block_configuration.az_select_menu.preform_text }}">
+```
+
+*JavaScript:*
+2. Remove the `selectElement.setAttribute('aria-disabled', 'true')` line. Use
+   the native `disabled` attribute when the empty option is selected, or leave
+   the select element enabled (it is not the disabled element; the button is).
+
+**Acceptance test:**
+- Form landmark has an accessible name derived from the configured label.
+- Screen reader does not report the select element as disabled when only the
+  navigation button is disabled.
+
+---
+
+#### 2.4 Carousel — audit and remediate Slick integration
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §8
+
+**WCAG SC:** 2.1.1 Keyboard (Level A); 2.2.2 Pause, Stop, Hide (Level A)
+
+**Prerequisite:** Rendered-page audit of `/pages/photo-galleries` using a
+keyboard and screen reader to confirm current control names and auto-play
+behavior.
+
+**Files to change:** TBD pending rendered-page audit.
+
+**Minimum required outcomes:**
+- All carousel controls (previous, next, pause, slide indicators) are
+  focusable and have accessible names.
+- If auto-play is enabled, a visible pause control exists and is keyboard
+  accessible.
+- Carousel respects `prefers-reduced-motion: reduce`.
+
+---
+
+#### 2.5 Date picker — audit and remediate vanilla-calendar-pro integration
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §11
+
+**WCAG SC:** 2.1.1 Keyboard (Level A); 2.1.2 No Keyboard Trap (Level A)
+
+**Prerequisite:** Manual keyboard and screen reader walkthrough of the event
+calendar at `/calendar`.
+
+**Files to change:** TBD pending rendered-page audit.
+
+**Minimum required outcomes:**
+- Arrow keys navigate calendar grid cells.
+- Escape closes the date picker and returns focus to the triggering control.
+- Tab does not become trapped inside the date picker widget.
+
+---
+
+### Phase 3 — Content and template semantics
+
+**Goal:** Improve semantic markup in templates where meaning is currently
+reduced or lost, without changing visible UI behavior.
+
+**Deliverables:**
+
+#### 3.1 Add `<caption>` to publication type listing table
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §9
+
+**WCAG SC:** 1.3.1 Info and Relationships (Level A)
+
+**Files to change:**
+- `modules/custom/az_publication/templates/az-publication-type-listing-table.html.twig`
+
+**Change:** Add a `<caption>` inside the `<table>` element:
+
+```twig
+<table{{ attributes.addClass('responsive-enabled') }}>
+  <caption>{{ 'Publication types'|t }}</caption>
+  <thead>
+```
+
+---
+
+#### 3.2 Marketing Cloud export — scope decision and remediation
+
+**Source finding:** ACCESSIBILITY-REVIEW-PLAN.md §10
+
+**Action depends on scope decision (Phase 0 exit criterion):**
+- If browser-facing: add landmark structure, `lang` attribute, and `<title>`
+  to the export HTML template.
+- If pipeline-only: document the decision in the template comment and close
+  the finding.
+
+---
+
+### Phase 4 — Verification and release readiness
+
+**Goal:** Confirm all Phase 1–3 fixes work correctly under assistive
+technology, update CI to block regressions, and document the program outcome.
+
+**Deliverables:**
+
+- [ ] Run manual verification checklist (keyboard + screen reader) against all
+  Phase 1–3 changes on the agreed test matrix pages.
+- [ ] Promote axe CI scan from informational to blocking on the violation
+  categories addressed by Phases 1–3.
+- [ ] Update `RELEASES.md` or release notes to document accessibility
+  improvements per release.
+- [ ] Close or migrate any related GitHub issues linked to this program.
+- [ ] Tag findings that remain open (Phase 3+ scope, deferred items) as
+  `accessibility` with a clear status label.
+
+---
+
+## GitHub issue taxonomy
+
+### Labels required
+
+| Label | Color suggestion | Purpose |
+|-------|-----------------|---------|
+| `accessibility` | `#0075ca` | All accessibility issues |
+| `wcag-a` | `#e4e669` | WCAG Level A findings |
+| `wcag-aa` | `#f9c513` | WCAG Level AA findings |
+| `a11y-phase-0` | `#bfd4f2` | Phase 0 work |
+| `a11y-phase-1` | `#bfd4f2` | Phase 1 work |
+| `a11y-phase-2` | `#bfd4f2` | Phase 2 work |
+| `a11y-phase-3` | `#bfd4f2` | Phase 3 work |
+| `a11y-phase-4` | `#bfd4f2` | Phase 4 work |
+
+### Milestone mapping
+
+| Milestone | Phase | Expected release type |
+|-----------|-------|-----------------------|
+| A11Y Phase 0 — Guardrails | Phase 0 | Patch or minor |
+| A11Y Phase 1 — Global blockers | Phase 1 | Patch |
+| A11Y Phase 2 — Interactive components | Phase 2 | Minor or patch |
+| A11Y Phase 3 — Semantics | Phase 3 | Minor |
+| A11Y Phase 4 — Verification | Phase 4 | Minor |
+
+---
+
+## Delivery issue templates
+
+Use the following structure when creating delivery issues under each phase.
+
+### Delivery issue title format
+
+```
+[A11Y] <Phase N> – <Component>: <WCAG SC short name>
+```
+
+Example:
+```
+[A11Y] Phase 1 – Pager: aria-labelledby and aria-current (WCAG 1.3.1, 2.4.6)
+```
+
+### Delivery issue body template
+
+```markdown
+## Accessibility finding
+
+**Phase:** N
+**WCAG SC:** x.x.x <Name> (Level A/AA)
+**Priority:** Px
+**Source:** ACCESSIBILITY-REVIEW-PLAN.md §N
+
+## Problem
+
+<Copy the finding summary from the review plan.>
+
+## Proposed fix
+
+<Copy the required fix from the review plan.>
+
+## Files to change
+
+- `path/to/file.html.twig`
+- `path/to/file.js`
+
+## Acceptance criteria
+
+- [ ] <Specific, testable criterion 1>
+- [ ] <Specific, testable criterion 2>
+- [ ] Verified with keyboard-only navigation.
+- [ ] Verified with <screen reader> on <browser>.
+- [ ] No regressions on <test page path>.
+```
+
+---
+
+## Related issues to link into this program
+
+When creating the GitHub project dashboard, link the following types of
+existing issues:
+
+- Issues labeled `accessibility` or `a11y` in the repository.
+- Issues referencing specific components covered in this plan (accordion,
+  carousel, alphabetical listing, select menu, pager).
+- Any open issues referencing WCAG, screen reader, keyboard navigation, or
+  ARIA.
+
+---
+
+## GitHub project dashboard
+
+If repository permissions allow, create a GitHub Project (beta) board with:
+
+- **Board name:** AZ Quickstart Accessibility Program
+- **Views:** By phase (grouped by milestone), by component (grouped by label),
+  by status (To Do / In Progress / In Review / Done)
+- **Linked repository:** `az-digital/az_quickstart`
+- **Automation:** Auto-add issues labeled `accessibility` to the board
+
+---
+
+## Success measures (program-level)
+
+| Measure | How verified |
+|---------|-------------|
+| Skip link moves focus to main content | Manual keyboard test on front page |
+| Pager landmark name is "Pagination" | Screen reader landmarks list |
+| Accordion panel names match heading text | Screen reader browse mode |
+| Alphabetical listing search announces result count | Screen reader with search input active |
+| Alpha nav letter links stay on page | Keyboard activation test |
+| Select menu form has accessible name | Screen reader form mode |
+| Carousel controls are keyboard accessible | Manual keyboard test on photo gallery page |
+| Date picker does not trap focus | Manual keyboard test on calendar page |
+| Axe scan runs in CI on every PR | CI workflow log |
+| No new axe violations introduced in PR | CI workflow check |
+
+---
+
+## Conditions of satisfaction for this program issue
+
+- [ ] `ACCESSIBILITY-REVIEW-PLAN.md` committed to repository.
+- [ ] `ACCESSIBILITY-GITHUB-PROJECT-PLAN.md` committed to repository.
+- [ ] Parent phase issues created and linked to the program umbrella issue.
+- [ ] Delivery issues created under each phase and linked to their parent phase
+  issue.
+- [ ] Existing accessibility-related issues linked into the program.
+- [ ] GitHub project dashboard created (if permissions allow).
+- [ ] Team has reviewed scope, sequencing, and release expectations.
+- [ ] Open questions in `ACCESSIBILITY-REVIEW-PLAN.md` answered before Phase 1
+  implementation begins.
diff --git a/ACCESSIBILITY-REVIEW-PLAN.md b/ACCESSIBILITY-REVIEW-PLAN.md
new file mode 100644
index 0000000000..edc5849680
--- /dev/null
+++ b/ACCESSIBILITY-REVIEW-PLAN.md
@@ -0,0 +1,489 @@
+# Accessibility Review Plan: az_quickstart WCAG 2.2 AA
+
+## Purpose
+
+This document records the component-by-component accessibility findings for the
+`az_quickstart` Drupal installation profile and its associated theme,
+`az_barrio`. It drives the phased delivery work described in
+`ACCESSIBILITY-GITHUB-PROJECT-PLAN.md`.
+
+All findings are mapped to WCAG 2.2 success criteria (SC) and assigned a
+priority tier based on breadth of user impact and technical risk.
+
+---
+
+## Methodology
+
+Findings were produced by:
+
+1. Template source review (`*.html.twig`, `*.js`, `*.css`) across all custom
+   modules and the `az_barrio` theme.
+2. Semantic and attribute analysis against WCAG 2.2 and the WAI-ARIA 1.2
+   Authoring Practices Guide.
+3. Manual keyboard walk-through of the alphabetical listing, accordion,
+   pager, and select menu interaction patterns.
+
+Automated axe and rendered-page audits are planned for Phase 0 (see project
+plan) and will supplement or refine the findings below.
+
+---
+
+## Priority definitions
+
+| Tier | Meaning |
+|------|---------|
+| **P0** | Blocks task completion for keyboard or AT users across most pages. |
+| **P1** | Degrades a named component or interaction; workarounds exist but are unreliable. |
+| **P2** | Incorrect semantics reduce comprehension or navigation efficiency without fully blocking tasks. |
+| **P3** | Polish, best-practice, or future-proofing concerns. |
+
+---
+
+## Findings
+
+### 1. Global — Skip-to-main-content link target missing
+
+**File:** `themes/custom/az_barrio/templates/layout/html.html.twig`,
+`themes/custom/az_barrio/templates/layout/page.html.twig`
+
+**WCAG SC:** 2.4.1 Bypass Blocks (Level A)
+
+**Priority:** P0
+
+**Finding:**
+The skip link in `html.html.twig` points to `href="#content"`:
+
+```twig
+<a href="#content" class="visually-hidden-focusable …">
+  {{ 'Skip to main content'|t }}
+</a>
+```
+
+The `<main>` element in `page.html.twig` has no matching `id="content"`
+attribute:
+
+```twig
+<main{{ content_attributes }}>
+```
+
+When a keyboard user activates the skip link, focus does not move and the
+browser scrolls to the top of the document rather than the main content region.
+The bypass mechanism is present in the markup but does not function.
+
+**Required fix:**
+Add `id="content"` to the `<main>` element, or ensure `content_attributes`
+reliably includes this ID. The simplest guaranteed approach is:
+
+```twig
+<main id="content"{{ content_attributes }}>
+```
+
+---
+
+### 2. Global — Footer `role="contentinfo"` misplaced
+
+**File:** `themes/custom/az_barrio/templates/layout/page.html.twig`
+
+**WCAG SC:** 1.3.6 Identify Purpose (Level AAA, informational); 4.1.2 Name,
+Role, Value (Level AA)
+
+**Priority:** P2
+
+**Finding:**
+`role="contentinfo"` is applied to an inner `<div>` inside the `<footer>`
+element:
+
+```twig
+<footer class="site-footer">
+  <div … role="contentinfo">
+```
+
+The HTML5 `<footer>` element already carries the implicit ARIA `contentinfo`
+landmark when it is a direct child of `<body>`. Adding an explicit
+`role="contentinfo"` on an inner div creates a duplicate landmark, which some
+screen readers report twice. Removing the redundant `role` from the inner div
+resolves this cleanly.
+
+**Required fix:**
+Remove `role="contentinfo"` from the inner wrapper div. The `<footer>` element
+itself carries the landmark implicitly.
+
+---
+
+### 3. Global — Back-to-top button missing accessible name
+
+**File:** `themes/custom/az_barrio/templates/layout/page.html.twig`
+
+**WCAG SC:** 4.1.2 Name, Role, Value (Level AA)
+
+**Priority:** P1
+
+**Finding:**
+The back-to-top button contains a Material Symbols icon span and the literal
+text "Back to top":
+
+```twig
+<button type="button" id="az-js-back-to-top" …>
+  <span aria-hidden="true" class="material-symbols-rounded">keyboard_arrow_up</span>
+  Back to top
+</button>
+```
+
+The visible text "Back to top" is present without `aria-hidden`, so the button
+does have an accessible name. However, the icon is correctly hidden from AT.
+This item is **close to conformant** but should be verified at rendering time
+because CSS may clip the visible text on narrow viewports.
+
+**Required fix:**
+Confirm text is never visually clipped or hidden via CSS. No template change is
+required if verified conformant.
+
+---
+
+### 4. Accordion — Incorrect `aria-labelledby` and `data-bs-parent` targets
+
+**File:**
+`modules/custom/az_accordion/templates/az-accordion.html.twig`
+
+**WCAG SC:** 4.1.2 Name, Role, Value (Level AA)
+
+**Priority:** P1
+
+**Finding:**
+The accordion panel element uses `aria-labelledby` referencing the same ID as
+the panel itself (`accordion_item_id`), rather than the button that controls
+it:
+
+```twig
+<div id="{{ accordion_item_id }}" … aria-labelledby="{{ accordion_item_id }}"
+     data-bs-parent="#{{ accordion_item_id }}">
+```
+
+Two problems:
+
+1. `aria-labelledby="{{ accordion_item_id }}"` creates a circular reference.
+   The panel labels itself using its own ID, which resolves to the panel's own
+   text rather than the heading button label. Screen readers may report the
+   entire panel body as the panel's name.
+
+2. `data-bs-parent="#{{ accordion_item_id }}"` points to the individual item,
+   not the wrapping accordion container. Bootstrap uses this attribute to
+   collapse sibling items. Pointing to the item itself means sibling
+   auto-collapse does not work, breaking the expected accordion interaction
+   pattern.
+
+Additionally, the heading button does not have its own unique ID to serve as
+the `aria-labelledby` target.
+
+**Required fix:**
+- Add a unique button ID, for example `{{ accordion_item_id }}-button`.
+- Set `aria-labelledby="{{ accordion_item_id }}-button"` on the panel.
+- Pass the container ID (e.g. `accordion_container_id`) to the template and
+  use it in `data-bs-parent`.
+
+Template variables `accordion_item_id` and `accordion_container_id` are
+already declared in the template docblock comment. The `accordion_container_id`
+variable needs to be wired through in `data-bs-parent`.
+
+---
+
+### 5. Pager — `aria-label` contains an ID string; current page not marked
+
+**File:** `themes/custom/az_barrio/templates/navigation/pager.html.twig`
+
+**WCAG SC:** 1.3.1 Info and Relationships (Level A); 2.4.6 Headings and Labels
+(Level AA)
+
+**Priority:** P1
+
+**Finding (a) — `aria-label` receives raw heading ID:**
+```twig
+<nav role="navigation" aria-label="{{ heading_id }}">
+  <h3 id="{{ heading_id }}" class="visually-hidden">{{ 'Pagination'|t }}</h3>
+```
+
+`heading_id` is a machine-generated string such as
+`pagination-heading--12345`. The nav uses it as a label text rather than
+referencing it as a target. The accessible name of the navigation landmark
+becomes the raw ID string rather than the human-readable "Pagination" text.
+
+The correct pattern is `aria-labelledby="{{ heading_id }}"`, which references
+the heading element.
+
+**Finding (b) — Current page has no `aria-current`:**
+```twig
+{% if current == key %}
+  <span class="page-link">
+    {{- key -}}
+  </span>
+```
+
+The current page item uses a `<span>` instead of a link, which is correct
+(disabling navigation to the current page). However, it lacks
+`aria-current="page"`, so screen reader users cannot identify which page is
+active.
+
+**Required fix (a):** Change `aria-label="{{ heading_id }}"` to
+`aria-labelledby="{{ heading_id }}"`.
+
+**Required fix (b):** Add `aria-current="page"` to the current page span:
+
+```twig
+<span class="page-link" aria-current="page">
+  {{- key -}}
+</span>
+```
+
+---
+
+### 6. Alphabetical listing — Navigation landmark lacks accessible name;
+no live region for search results
+
+**File:**
+`modules/custom/az_alphabetical_listing/templates/views-view--az-alphabetical-listing.html.twig`,
+`modules/custom/az_alphabetical_listing/js/alphabetical_listing.js`
+
+**WCAG SC:** 2.4.6 Headings and Labels (Level AA); 4.1.3 Status Messages
+(Level AA)
+
+**Priority:** P1
+
+**Finding (a) — Nav landmark has no accessible name:**
+```twig
+<nav id="az-js-floating-alpha-nav" class="…">
+  <ul id="az-js-alpha-navigation" …>
+```
+
+A page may have multiple `<nav>` landmarks. Without an accessible name,
+screen reader users cannot distinguish this navigation (alpha jump links) from
+other navigation landmarks (primary menu, breadcrumb, footer).
+
+**Finding (b) — Search results change is not announced:**
+When a user types in the search field (`#az-js-alphabetical-listing-search`),
+JavaScript shows and hides result items. No live region communicates the count
+of visible results to screen reader users, who must manually explore the page
+to determine whether their query returned results.
+
+The "no results" message uses `style="display:none"` toggled by JS, which is
+not within a live region and does not trigger an announcement.
+
+**Finding (c) — href assignment in JS omits `#` prefix:**
+In `alphabetical_listing.js` line 106, when a nav item's corresponding group
+is visible, the href is set to the element's ID string without the `#` anchor
+prefix:
+
+```js
+navTarget.attr('href', $(element).attr('id'));
+// Sets href="A" instead of href="#A"
+```
+
+This causes the anchor link to navigate to a relative URL path (`/A`) rather
+than scrolling to the section anchor on the same page. The smooth-scroll click
+handler overrides this for mouse users (it reads `data-href`), but keyboard
+users who activate the link via Enter will navigate away from the page.
+
+**Required fix (a):** Add `aria-label="{{ 'Alphabetical navigation'|t }}"` to
+the `<nav>` element.
+
+**Required fix (b):** Add an `aria-live="polite"` status region near the
+search input that JS updates with result counts.
+
+**Required fix (c):** In `alphabetical_listing.js`, prepend `#` when setting
+`href`:
+```js
+navTarget.attr('href', '#' + $(element).attr('id'));
+```
+
+---
+
+### 7. Select menu — Form element lacks accessible name
+
+**File:**
+`modules/custom/az_select_menu/templates/az-select-menu.html.twig`
+
+**WCAG SC:** 1.3.1 Info and Relationships (Level A); 4.1.2 Name, Role, Value
+(Level AA)
+
+**Priority:** P1
+
+**Finding:**
+The `<form>` element wrapping the select menu has no accessible name. A
+visually hidden label is provided for the `<select>` itself
+(`preform_text_sr_only`), but the enclosing form is not labeled. Depending on
+context, screen readers may announce an unnamed form landmark when focus
+enters.
+
+Additionally, when the `empty_option` is rendered as the initially selected
+option, its `data-href=""` causes the button to be immediately marked as
+disabled and `aria-disabled="true"` is set on the select itself. The
+`aria-disabled` attribute on a `<select>` element is not universally supported
+across browsers and assistive technology combinations; `disabled` should be
+used or the approach reconsidered.
+
+**Required fix:**
+- Add `aria-label` or `aria-labelledby` to the `<form>` element using
+  `preform_text_sr_only` or `preform_text` as the source.
+- Review `aria-disabled` usage on `<select>` and replace with `disabled` where
+  appropriate.
+
+---
+
+### 8. Carousel — No keyboard-accessible pause; no reduced-motion support
+
+**File:** `modules/custom/az_carousel/`
+
+**WCAG SC:** 2.1.1 Keyboard (Level A); 2.2.2 Pause, Stop, Hide (Level A)
+
+**Priority:** P1
+
+**Finding:**
+The `az_carousel` module provides a Slick carousel integration. Moving content
+(auto-playing carousels) must provide a mechanism to pause, stop, or hide the
+movement unless the movement lasts fewer than five seconds and is not
+auto-started (WCAG 2.2.2). Additionally, all carousel controls (previous,
+next, pause, slide indicators) must be keyboard accessible.
+
+A full audit of the rendered carousel markup is required before specific
+template changes can be specified. The following risk areas should be
+confirmed:
+
+- Auto-play status and whether a visible, keyboard-accessible pause control
+  is present.
+- Slide indicator buttons: do they have accessible names (e.g. "Slide 1 of 5"
+  or named slide titles)?
+- Does the carousel respond to the `prefers-reduced-motion` media query?
+
+**Required action:** Rendered-page audit on a demo carousel page
+(`/pages/photo-galleries`) to confirm current control names and keyboard
+behavior before writing template fixes.
+
+---
+
+### 9. Publication table — `<table>` summary and caption review needed
+
+**File:**
+`modules/custom/az_publication/templates/az-publication-type-listing-table.html.twig`
+
+**WCAG SC:** 1.3.1 Info and Relationships (Level A)
+
+**Priority:** P2
+
+**Finding:**
+The publication type listing table has `<thead>` and `<tbody>` with properly
+structured `<th>` header cells. However, the table has no `<caption>` element.
+For complex administrative tables, a visible or visually hidden caption that
+names the table is recommended by WCAG techniques H39 and H73.
+
+This is an admin-facing table and has a lower user-impact than front-facing
+components, but should be addressed for completeness.
+
+**Required fix:**
+Add a `<caption>` to the table in
+`az-publication-type-listing-table.html.twig`.
+
+---
+
+### 10. Marketing Cloud export templates — Scope confirmation required
+
+**Files:**
+`modules/custom/az_marketing_cloud/templates/html--export--marketing-cloud.html.twig`,
+`modules/custom/az_marketing_cloud/templates/page--export--marketing-cloud.html.twig`
+
+**WCAG SC:** Scope-dependent
+
+**Priority:** P3 (pending scope decision)
+
+**Finding:**
+The Marketing Cloud export templates render stripped-down HTML fragments
+intended for email or external system consumption. The
+`html--export--marketing-cloud.html.twig` template renders only
+`{{ page.content }}` with no `<html>`, `<head>`, `<body>`, or landmark
+elements.
+
+If these routes are ever rendered in a browser-facing context (for example,
+previewed in an iframe or fetched directly), the output would fail basic
+structural accessibility requirements. If they are pipeline-only fragment
+outputs never consumed by AT users, WCAG applicability is reduced.
+
+**Required action:**
+Confirm with the delivery team whether Marketing Cloud export routes are:
+(a) browser-accessible preview pages, or
+(b) fragment-only pipeline outputs not intended for AT users.
+
+Apply appropriate remediation based on that decision.
+
+---
+
+### 11. Date picker — Focus and keyboard behavior review required
+
+**Files:** `modules/custom/az_core/lib/vanilla-calendar-pro/`,
+`modules/custom/az_core/`
+
+**WCAG SC:** 2.1.1 Keyboard (Level A); 2.1.2 No Keyboard Trap (Level A)
+
+**Priority:** P1
+
+**Finding:**
+The bundled `vanilla-calendar-pro` library (v3.1.0) provides date picker
+behavior used in the event calendar. The library's source code shows ARIA
+attributes (`role="application"`, `role="grid"`, `role="gridcell"`,
+`aria-label`, `aria-selected`, `aria-current="date"`) applied to rendered
+elements, which indicates some AT support is built in.
+
+However, the following keyboard behavior risks should be verified in a rendered
+page context:
+
+- Arrow key navigation within the calendar grid.
+- Escape key closes the picker and returns focus to the triggering input.
+- Tab key does not become trapped inside the picker.
+- Date selection announces the selected date via live region or focus move.
+
+The library's `tabIndex=-1` handling for disabled elements appears correct in
+source, but must be confirmed against current Drupal integration.
+
+**Required action:**
+Manual keyboard and screen reader walkthrough of the event calendar
+(`/calendar`) before specifying fixes. Document any divergence from the
+ARIA date-picker pattern.
+
+---
+
+## Components confirmed conformant (no action required)
+
+| Component | Notes |
+|-----------|-------|
+| Skip link markup | Present and visible on focus. Fix to `<main id="content">` will make it functional (see finding 1). |
+| Pager: Previous/Next/First/Last | Visually hidden text provided correctly. `aria-hidden` on decorative icon text. |
+| Breadcrumb | Uses `<nav>` with standard Drupal breadcrumb template. |
+| Mobile nav offcanvas | Has `aria-label="Mobile navigation"`. Trigger buttons include icon text. |
+| UA header wordmark | Image has descriptive `alt` text. |
+
+---
+
+## Verification matrix
+
+The following pages should be used for rendered-page verification and automated
+axe scanning:
+
+| Path | Components covered |
+|------|--------------------|
+| `/` (front page) | Skip link, header, navigation, footer |
+| `/pages/accordions` | Accordion |
+| `/pages/photo-galleries` | Carousel |
+| `/people-list` | Alphabetical listing, search, alpha nav |
+| `/news` | Pager |
+| `/calendar` | Date picker |
+| Any page with select menu block | Select menu |
+| `/admin/config/az-quickstart/publication-types` | Publication table |
+
+---
+
+## Open questions requiring team decision
+
+1. Are Marketing Cloud export routes browser-facing or pipeline-only? (Affects
+   scope of finding 10.)
+2. What is the agreed test matrix for automated and manual verification? (Will
+   confirm the table above or adjust it.)
+3. Should accessibility regressions block patch releases, minor releases, or
+   both?
+4. Which findings belong in patch releases versus minor releases?

From 86f9ef9d3902ceb8be464d8dbf6ebb5aef17d8ce Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 23 Apr 2026 21:47:01 +0000
Subject: [PATCH 3/3] Address code review feedback: clarify data-href context
 and preform_text_sr_only naming

Agent-Logs-Url: https://github.com/az-digital/az_quickstart/sessions/388d36cd-bce9-4b55-93f5-5b0a4da60aa1

Co-authored-by: accesswatch <70671938+accesswatch@users.noreply.github.com>
---
 ACCESSIBILITY-GITHUB-PROJECT-PLAN.md | 5 ++++-
 ACCESSIBILITY-REVIEW-PLAN.md         | 7 +++++--
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/ACCESSIBILITY-GITHUB-PROJECT-PLAN.md b/ACCESSIBILITY-GITHUB-PROJECT-PLAN.md
index bcebd40ce5..e5b0d3414c 100644
--- a/ACCESSIBILITY-GITHUB-PROJECT-PLAN.md
+++ b/ACCESSIBILITY-GITHUB-PROJECT-PLAN.md
@@ -229,7 +229,10 @@ navTarget.attr('href', '#' + $(element).attr('id'));
 
 *Template:*
 1. Add `aria-label` to the `<form>` element sourced from
-   `preform_text_sr_only` (falling back to `preform_text`):
+   `preform_text_sr_only` (falling back to `preform_text`). Note:
+   `preform_text_sr_only` is the intentional variable name used throughout
+   the `az_select_menu` module (config schema, template, and PHP class all
+   use this spelling):
 
 ```twig
 <form {{ form_attributes }}
diff --git a/ACCESSIBILITY-REVIEW-PLAN.md b/ACCESSIBILITY-REVIEW-PLAN.md
index edc5849680..51c05035cf 100644
--- a/ACCESSIBILITY-REVIEW-PLAN.md
+++ b/ACCESSIBILITY-REVIEW-PLAN.md
@@ -279,8 +279,11 @@ navTarget.attr('href', $(element).attr('id'));
 
 This causes the anchor link to navigate to a relative URL path (`/A`) rather
 than scrolling to the section anchor on the same page. The smooth-scroll click
-handler overrides this for mouse users (it reads `data-href`), but keyboard
-users who activate the link via Enter will navigate away from the page.
+handler (`$('#az-js-alpha-navigation a').on('click', …)`) overrides this for
+mouse users by reading `data-href` from the anchor element via
+`$.attr(event.currentTarget, 'data-href')` and calling `jQuery.animate()` for
+scrolling. Keyboard users who activate the link via Enter, however, follow
+the `href` attribute and navigate away from the page.
 
 **Required fix (a):** Add `aria-label="{{ 'Alphabetical navigation'|t }}"` to
 the `<nav>` element.