Skip to content

Video: add aria-label for uncaptioned video in save function#70364

Closed
shubhtoy wants to merge 1 commit into
WordPress:trunkfrom
shubhtoy:fix/core-video-aria
Closed

Video: add aria-label for uncaptioned video in save function#70364
shubhtoy wants to merge 1 commit into
WordPress:trunkfrom
shubhtoy:fix/core-video-aria

Conversation

@shubhtoy

@shubhtoy shubhtoy commented Jun 9, 2025

Copy link
Copy Markdown

What?

Closes #70297

Add aria-label to the <video> element in the Video block when no caption is provided.

Why?

To improve accessibility for screen reader users. Previously, when a video block lacked a caption, screen readers would receive no contextual information about the video content. This change provides a default label "Uncaptioned video" in such cases, improving clarity and compliance with accessibility standards.

How?

  • Check if the caption attribute is empty using RichText.isEmpty.
  • If empty, apply a fallback aria-label with the value __('Uncaptioned video').
  • If a caption is present, omit the aria-label so the screen reader can rely on the figcaption.

Testing Instructions

  1. Open a post or page in the block editor.
  2. Insert a Video block.
  3. Upload or set a video source (e.g., .mp4).
  4. Do not enter a caption.
  5. Save the post and inspect the front-end output.
  6. Confirm that the <video> element includes aria-label="Uncaptioned video".
  7. Add a caption and save again.
  8. Confirm that the aria-label is no longer present when the caption exists.

Screenshots or screencast

Before

No aria-label when no caption present

image

After

aria-label="Uncaptioned video" added to <video> element

image

@github-actions

github-actions Bot commented Jun 9, 2025

Copy link
Copy Markdown

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: shubhtoy <shubhtoy@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: joedolson <joedolson@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions github-actions Bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Jun 9, 2025
@github-actions

github-actions Bot commented Jun 9, 2025

Copy link
Copy Markdown

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @shubhtoy! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@t-hamano t-hamano added [Type] Enhancement A suggestion for improvement. [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Block] Video Affects the Video Block labels Jun 9, 2025

@t-hamano t-hamano left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the PR!

Unfortunately, I believe that labeling video elements as 'Uncaptioned video' makes no sense and would not improve anything in accessibility. I will close this PR and revisit the ideal approach.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Block] Video Affects the Video Block First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Video Block: Add accessibility name to core/video block using a caption

2 participants