Create Page | Expand Macro: Editable field missing role and accessible name

XMLWordPrintable

    • Severity 2 - Major
    • Accessibility

      Issue Summary

      The "Description" editable field is missing role and accessible name.

      Steps to Reproduce

      1. Open the Confluence Cloud Homepage.
      2. In the header, expand Create and select Page.
      3. Enter a title in the Title field.
      4. In the page editor, type /expand and press Enter to insert the Expand macro.
      5. Using a screen reader, navigate to the “Give this expand a title” field and enter text.
      6. Navigate to the Description field within the Expand macro (use Down Arrow with JAWS / NVDA on Windows or Control + Option + Right Arrow with VoiceOver on macOS).
      7. Observe that the Description field is not properly announced by the screen reader.
      8. Inspect the code and observe that the field is missing role="textbox" and an accessible name.

      Screen Recording

      Editable field missing role and accessible name

      Actual Results

      When screen reader users navigate to the “Description” field within the “Expand” macro in the Page Editor (using Down Arrow with JAWS / NVDA on Windows or Control + Option + Right Arrow with VoiceOver on macOS), the field is not properly exposed to assistive technologies.

      The underlying <div contenteditable="true"> element is missing required accessibility semantics, including role="textbox", aria-multiline="true", and an accessible name. As a result, screen reader users are unable to correctly identify, interact with, or understand the purpose of the editable field.

      Expected Results

      The field should be programmatically exposed to screen readers as a multiline textbox with a clear accessible name.

      Apply the following changes:

      • Provide an accessible name “Description” using the aria-label attribute.
      • Add role="textbox" along with aria-multiline="true" to the <div contenteditable="true"> element.

      Note:

      Before implementing the accessible name for the field, please consult the Content Design team for business approval and alignment.

      Note:

      This code example is intended only as a general illustration of how to address the violation and should not be considered a complete or production-ready solution. If you have any questions, please attach this ticket to a #help-accessibility request.

      Code Snippet:

      <div contenteditable="true" role="textbox" aria-multiline="true" aria-label="Description">
      </div>

      Workaround

      Currently there is no known workaround for this behavior. A workaround will be added here when available

      Environment

      MacBook Pro (16-inch, 2021)
      macOS Tahoe 26.4
      Operations - Windows11
      Chrome - 147.0.7727.102 (Official Build) (64-bit)
      Safari- Version 26.4
      JAWS- Version 2023
      NVDA- Version 2025.3.3
      VoiceOver - Version Latest

              Assignee:
              Unassigned
              Reporter:
              Chirag Goyal
              Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

                Created:
                Updated: