Skip to content

Add descriptive aria-label to the Vimeo iframe for screen readers #55

Description

@swashbuck

Subject of the issue

The Vimeo component's iframe has no author-controlled accessible name. The Vimeo player library injects a title attribute set to the video's own Vimeo title, so screen reader users hear whatever the uploader named the video (in its original language) rather than a name the course author chose. That string is not localisable and not under the author's control.

This is the Vimeo counterpart of adapt-youtube#22, and should follow the same approach already used in Media (see adaptlearning/adapt_framework#2822): expose the component's own title as an aria-label. Per the guidance on adapt-youtube#22, use aria-label rather than title, as title behaves inconsistently on iframes.

Your environment

  • adapt-vimeo 3.4.0 / Framework 5.56.2
  • Any browser
  • Any OS

Steps to reproduce

  1. Add the Vimeo component (using the plugin's example.json).
  2. View the page and inspect the <iframe> rendered inside .vimeo__widget.
  3. Note there is no aria-label. The only accessible name is a title attribute injected by the Vimeo player library from the video's own Vimeo title.

Expected behaviour

The iframe exposes an author-controlled, localisable accessible name, taken from the component's displayTitle (falling back to title) and applied as aria-label.

Actual behaviour

The iframe has no aria-label. Its accessible name depends on the Vimeo-injected title, which the author cannot set or localise.

Suggested Fix

Mirror adapt-contrib-media: once the Vimeo player is ready, set aria-label on the player's iframe element to displayTitle || title. Because the iframe is created at runtime by the Vimeo SDK (not in the template), this is done in VimeoView rather than in the Handlebars template.

Relevant WCAG success criterion: 4.1.2 Name, Role, Value (technique H64).

Posted via collaboration with Claude Code

Metadata

Metadata

Assignees

Type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions