Issue #3586304: Clean up CCC form and table accessibility cleanup
Description
This MR addresses small form and admin UI accessibility improvements in the ai_context module.
Changes included:
- Add
Drupal.announce()result counts to JS filters (ai_context_agents.js,ai_context_items_filter.js): After filtering the agents table or the context items table, the visible result count is now announced viaDrupal.announce()so screen reader users receive feedback without having to navigate the table.
5.1. Replace disabled selects with read-only text (AiContextAgentForm): Unpublished and global context items in the agent configuration table previously rendered as disabled <select> elements, which are announced as interactive controls by screen readers but cannot be operated. Replaced with #type => 'item' text elements.
5.2. Convert raw help-list markup to render array (AiContextAgentForm): The "Context Inclusion Rules" help section was built as a hand-concatenated HTML string in #markup. Replaced with #theme => 'item_list' to leverage Drupal's theme layer properly.
5.3. Add accessible table captions (AiContextAgentsForm, AiContextAgentForm, AiContextScopeOverviewForm): Three admin tables were missing #caption attributes. Added concise captions to help screen reader users understand each table's purpose before navigating it.
5.4. Replace emoji warnings with plain text (AiContextItemForm): The ⚠️ emoji in global item limit warning descriptions was replaced with the word "Warning:", as emoji are announced inconsistently across screen readers.
Testing instructions
5) Drupal.announce() result counts on JS filters
Agents filter (/admin/config/ai/context/settings/agents)
- Navigate to
/admin/config/ai/context/settings/agents. - Open a screen reader (e.g. NVDA, VoiceOver, or JAWS), or open the browser console as an alternative (see note below).
- Type any term in the "Search agents" field.
- Confirm the screen reader announces "X agents found" after each keystroke.
- Clear the search field and confirm the announcement reflects the full count of agents.
Context items filter (/admin/config/ai/context/items)
- Navigate to
/admin/config/ai/context/items. - Type any term in the search field.
- Confirm the screen reader announces "X context items found" after each keystroke.
- Change the scope name or scope value dropdowns and confirm the announcement updates accordingly.
- Clear all filters and confirm the count reflects all visible items.
Console-based verification (no screen reader required)
As an alternative to a screen reader, you can verify the announce call fires correctly:
- Open DevTools and go to the Console tab.
- Run:
Drupal.announce = (msg) => console.log('announce:', msg); - Interact with the search inputs — confirm "announce: X agents/context items found" is logged after each change.
5.1) Replace disabled selects with read-only text
Setup
You need at least one context item that is unpublished and one that is marked as global to cover both cases.
Unpublished item
- Navigate to
/admin/config/ai/context/settings/agents/{id}/editfor any agent. - Find a row in the table whose name includes "(unpublished)".
- Confirm the "Inclusion Overrides" column shows the plain text "Unpublished", not a dropdown control.
- Confirm there is no
<select>element in that cell when inspecting with DevTools.
Global item
- On the same agent configuration page, find a row for an item that is marked as global.
- Confirm the "Inclusion Overrides" column shows the plain text "Global (always included)", not a dropdown control.
- Confirm there is no
<select>element in that cell when inspecting with DevTools.
5.2) Convert raw help-list markup to render arrays
- Navigate to
/admin/config/ai/context/settings/agents/{id}/editfor any agent. - Click the "Context Inclusion Rules" details element to expand it.
- Confirm the list renders correctly with five items:
- Global: The context item is marked as global and is always included for all agents. This cannot be changed here.
- Always include: The context item will always be provided to the agent, regardless of scope matching.
- Default: The context item will be included based on scope matching and context relevance.
- Never include: The context item will never be provided to this agent.
- Unpublished: The context item is not published and cannot be included. Publish it first to enable selection.
- Inspect the rendered HTML and confirm the list is a proper
<ul>with<li>elements generated by Drupal's theme layer, not a hand-built markup string.
5.3) Accessible table captions
Agents overview table
- Navigate to
/admin/config/ai/context/settings/agents. - Open browser DevTools and inspect the
<table id="ai-context-agents-table">element. - Confirm a
<caption>element is present inside the table with a concise caption text.
Agent context items table
- Navigate to
/admin/config/ai/context/settings/agents/{id}/edit, replacing{id}with any existing agent machine name. - Inspect the table element with class
ai-context-item-list. - Confirm a
<caption>element is present with a concise caption text.
Scope plugins table
- Navigate to
/admin/config/ai/context/settings/scope. - Inspect the table element with class
ai-context-scope-overview. - Confirm a
<caption>element is present with a concise caption text.
5.4) Replace emoji warning in descriptions
Setup
The warning messages appear on the context item edit/add form when the number of published global context items is at or near the configured limit.
To trigger the warnings without creating many items:
- Go to
/admin/config/ai/context/settings/general. - Set "Max global context items" to a value equal to or less than the number of global items you already have (e.g. set it to
1if you have at least one global item). - Save the settings.
At-limit warning (item is already global)
- Navigate to
/admin/config/ai/context/items/{id}/editfor an existing item that is already marked as global. - In the "Context Scope" section, find the description of the "Global" checkbox.
- Confirm the warning reads: "Warning: Global item limit reached (X/Y)." with no emoji character.
At-limit warning (item is not global)
- Navigate to
/admin/config/ai/context/items/addor edit an item that is not global. - In the "Context Scope" section, find the description of the "Global" checkbox.
- Confirm the warning reads: "Warning: Global item limit reached (X/Y). Marking this item as global will exceed the limit, and only the first Y global items will be included." with no emoji character.
Near-limit warning
- Set "Max global context items" to a value one greater than the current number of global items (e.g. if you have 1 global item, set the limit to
2). - Navigate to any context item edit form.
- Confirm the description reads: "Warning: Global item limit almost reached (X/Y)." with no emoji character.
AI Compliance
Note
Check the one that best describes your usage, or leave all unchecked if AI was not significantly used.
- AI Assisted Code
Mainly written by a human; AI used for autocomplete or partial generation under full human supervision. - AI Generated Code
Mainly generated by AI, reviewed and approved by a human before this MR was created. - Vibe Coded
Generated by AI and only functionally reviewed before this MR was created.
Closes #3586304