feat: FieldDropdown ARIA

[mikeharv]

The basics

• I validated my changes

The details

Resolves

Fixes #9657

---

Proposed Changes

This PR add the ARIA implementation of FieldDropdown .

Key changes include:

• Adds correct ARIA role and state management to the dropdown trigger element:

  • Ensures the field’s focusable element has role="button"
  • Updates aria-expanded dynamically based on whether the dropdown menu is open
  • Sets aria-haspopup="listbox" to indicate the popup type
  • Sets aria-controls to reference the unique ID of the dropdown menu
  • Dropdown fields are hidden from the accessibility tree when rendered inside flyouts

• Introduces a Blockly-unique ID for the dropdown menu root element so it can be referenced reliably via aria-controls

• Improves menu item accessibility structure:

  • Adds support for ARIA labels on menu options
  • Ensures non-essential visual-only/redundant content is not exposed to screen readers by marking it as presentation

• Enhances ARIA label computation for dropdown options:

  • Explicit ARIA label override (if provided) takes highest priority
  • Image-based options use ariaLabel, then alt as fallback
  • HTMLElement-based options use accessible properties in priority order (ARIA label, title, then visible text)
  • String-based options are used directly
  • Final fallback produces a human-readable representation of the option (including indexed fallback where necessary)

---

Reason for Changes

This change establishes a baseline pattern in FieldDropdown so that fields have meaningful default accessibility behavior without requiring every implementation to solve the same problems independently. It ensures that ARIA labeling stays in sync with field state and that fields communicate their interactivity in a predictable way.

At the same time, this approach intentionally leaves room for customization, allowing specific field types to provide more tailored or context-aware accessibility behavior where needed.

---

Test Coverage

This change is covered by an expanded suite of ARIA-focused unit tests for FieldDropdown.

Simple Dropdown

• Block has field type name in ARIA label
• Focusable element has role of button
• Hidden when in a flyout
• Does not have aria-expanded when dropdown is closed
• Has aria-expanded when dropdown is open
• Has aria-haspopup of listbox
• Has aria-controls that matches the ID of the dropdown menu
• Has placeholder ARIA label by default
• setValue updates ARIA label

Dropdown with Option ARIA labels

• Option ARIA labels are included in field ARIA label
• Option ARIA labels are included in field ARIA label when value is changed

Dropdown with image options

• Image alt text is included in ARIA label
• Image ARIA label is prioritized over alt text

Dropdown with HTMLElement options

• Explicit ARIA label overrides all other label sources
• HTMLElement ariaLabel prioritized over other properties
• HTMLElement title is used when ariaLabel is missing
• HTMLElement innerText is used as final fallback
• Empty label falls back to option index

---

Documentation

New methods include TSDocs.

---

Additional Information

Further follow-up work will be required to update built-in Blockly block definitions to fully utilize improved ARIA option labeling. This could to updating some tests here as block definitions change.