Skip to content

Collapsed callouts using invalid ARIA attribute (a11y issue) #4934

@batpigandme

Description

@batpigandme

Bug description

Collapsed callouts when rendered use an invalid/inaccessible pattern where the ARIA attribute aria-expanded="false" is invalid [link to axe DevTools issue found when attached qmd is rendered].

From discussion with @gtritchie, they should use the disclosure pattern and be buttons:

Yes, disclosures should be buttons. Currently this is just a <div> with no role, which is what Axe is flagging.
The pattern to implement is this: https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/
These also need to be keyboard operable. You can't tab to them. Buttons should operate with both spacebar and enter key.

I can't seem to attach the actual qmd, so here it is in a gist
collapsed-callout.qmd

Quarto check output

[✓] Checking Quarto installation......OK
      Version: 1.2.475
      Path: /Applications/quarto/bin

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
      Version: 3.8.11 (Conda)
      Path: /opt/homebrew/Caskroom/miniconda/base/bin/python
      Jupyter: 4.10.0
      Kernels: python3

(|) Checking Jupyter engine render....Unable to load extension: pydevd_plugins.extensions.types.pydevd_plugin_pandas_types
Unable to load extension: pydevd_plugins.extensions.types.pydevd_plugin_pandas_types
[✓] Checking Jupyter engine render....OK

[✓] Checking R installation...........OK
      Version: 4.2.2
      Path: /Library/Frameworks/R.framework/Versions/4.2-arm64/Resources
      LibPaths:
        - /Users/maraaverick/Library/R/arm64/4.2/library
        - /Library/Frameworks/R.framework/Versions/4.2-arm64/Resources/library
      rmarkdown: 2.20.1

[✓] Checking Knitr engine render......OK

OS independent

Checklist

  • Please include a minimal, fully reproducible example in a single .qmd file? Please provide the whole file rather than the snippet you believe is causing the issue.
  • Please format your issue so it is easier for us to read the bug report.
  • Please document the RStudio IDE version you're running (if applicable), by providing the value displayed in the "About RStudio" main menu dialog?
  • Please document the operating system you're running. If on Linux, please provide the specific distribution.
  • Please provide the output of quarto check so we know which version of quarto and its dependencies you're running.

Metadata

Metadata

Assignees

Labels

accessibilitybugSomething isn't workingearly-in-releaseAn issue that should be worked on early in the release (likely due to risk)

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions