Iframe with YouTube video - Availability error: ARIA attributes that refer to other elements by identifier must refer to elements that exist in the DOM

I have an iframe that contains a Youtube video like this:

<iframe src="//www.youtube.com/embed/my-video" width="225" height="150"></iframe> 

When I launch the site through Chrome availability check, I get the following error in this iframe:

 [Severe] ARIA attributes which refer to other elements by ID should refer to elements which exist in the DOM (3) See AX_ARIA_02 for more information. 

Any idea how to solve this problem?

==== UPDATE

I noticed additional errors, for example:

 [Severe] Controls and media elements should have labels See AX_TEXT_01 for more information. <video class=​"video-stream html5-main-video" style=​"width:​ 225px;​ height:​ 150px;​ left:​ 0px;​ top:​ -150px;​ transform:​ none;​">​</video>​ 

and

 [Severe] Elements with ARIA roles must ensure required owned elements are present (3) See AX_ARIA_08 for more information. <div class=​"ytp-playlist-menu-items" role=​"menu">​</div>​ <div class=​"ytp-related-menu-items" role=​"menu">​</div>​ <div class=​"ytp-menu" role=​"menu" id=​"ytp-main-menu-id">​</div>​ 

Youtube video player allegedly not ARIA compliant?

+7
youtube iframe wai-aria
source share
1 answer

Try adding https: at the beginning of iframe src:

This will be your code:

 <iframe src="https://www.youtube.com/embed/my-video" width="225" height="150"></iframe> 

In addition, your type of videochrome may not be supported.

0
source share

All Articles