Make WordPress Core


Ignore:
Timestamp:
03/20/2019 05:21:56 PM (6 years ago)
Author:
afercia
Message:

Accessibility: Ensure embed iframes have a title attribute.

Screen reader users rely on the iframe title attribute to describe the contents of iframes. A meaningful title attribute allows to quickly identify the iframe content, so users can determine which iframe to enter and explore in detail or skip if desired.
Note: this is the only case where a title attribute is required for compliance with the W3C Web Content Accessibility Guidelines (WCAG).

  • checks for oEmbed response of type video or rich
  • checks if they use an iframe
  • fetches the title (if any) from the oEmbed response
  • adds the title to the embed iframe

Props bamadesigner, TomHarrigan, swissspidy, jrf, afercia.
Fixes #40245.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/embed.php

    r44926 r44942  
    780780    return $node->asXML();
    781781}
     782
     783/**
     784 * Filters the given oEmbed HTML to make sure iframes have a title attribute.
     785 *
     786 * @since 5.2.0
     787 *
     788 * @param string $result The oEmbed HTML result.
     789 * @param object $data   A data object result from an oEmbed provider.
     790 * @param string $url    The URL of the content to be embedded.
     791 * @return string The filtered oEmbed result.
     792 */
     793function wp_filter_oembed_iframe_title_attribute( $result, $data, $url ) {
     794    if ( false === $result || ! in_array( $data->type, array( 'rich', 'video' ) ) ) {
     795        return $result;
     796    }
     797
     798    $title = ! empty( $data->title ) ? $data->title : '';
     799
     800    $pattern        = '`<iframe[^>]*?title=(\\\\\'|\\\\"|[\'"])([^>]*?)\1`i';
     801    $has_title_attr = preg_match( $pattern, $result, $matches );
     802
     803    if ( $has_title_attr && ! empty( $matches[2] ) ) {
     804        $title = $matches[2];
     805    }
     806
     807    /**
     808     * Filters the title attribute of the given oEmbed HTML iframe.
     809     *
     810     * @since 5.2.0
     811     *
     812     * @param string $title  The title attribute.
     813     * @param string $result The oEmbed HTML result.
     814     * @param object $data   A data object result from an oEmbed provider.
     815     * @param string $url    The URL of the content to be embedded.
     816     */
     817    $title = apply_filters( 'oembed_iframe_title_attribute', $title, $result, $data, $url );
     818
     819    if ( '' === $title ) {
     820        return $result;
     821    }
     822
     823    if ( $has_title_attr ) {
     824        // Remove the old title, $matches[1]: quote, $matches[2]: title attribute value.
     825        $result = str_replace( ' title=' . $matches[1] . $matches[2] . $matches[1], '', $result );
     826    }
     827
     828    return str_ireplace( '<iframe ', sprintf( '<iframe title="%s" ', esc_attr( $title ) ), $result );
     829}
     830
    782831
    783832/**
Note: See TracChangeset for help on using the changeset viewer.