Changeset 48237
- Timestamp:
- 06/30/2020 07:28:07 PM (4 years ago)
- Location:
- trunk
- Files:
-
- 2 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/src/wp-includes/media.php
r48198 r48237 1493 1493 1494 1494 /** 1495 * Determines an image's width and height dimensions based on the source file. 1496 * 1497 * @since 5.5.0 1498 * 1499 * @param string $image_src The image source file. 1500 * @param array $image_meta The image meta data as returned by 'wp_get_attachment_metadata()'. 1501 * @return array|false Array with first element being the width and second element being the height, 1502 * or false if dimensions cannot be determined. 1503 */ 1504 function wp_image_src_get_dimensions( $image_src, $image_meta ) { 1505 $image_filename = wp_basename( $image_src ); 1506 1507 if ( wp_basename( $image_meta['file'] ) === $image_filename ) { 1508 return array( 1509 (int) $image_meta['width'], 1510 (int) $image_meta['height'], 1511 ); 1512 } 1513 1514 foreach ( $image_meta['sizes'] as $image_size_data ) { 1515 if ( $image_filename === $image_size_data['file'] ) { 1516 return array( 1517 (int) $image_size_data['width'], 1518 (int) $image_size_data['height'], 1519 ); 1520 } 1521 } 1522 1523 return false; 1524 } 1525 1526 /** 1495 1527 * Adds 'srcset' and 'sizes' attributes to an existing 'img' element. 1496 1528 * 1497 1529 * @since 4.4.0 1498 * @since 5.5.0 `width` and `height` are now added if not already present.1499 1530 * 1500 1531 * @see wp_calculate_image_srcset() … … 1527 1558 } 1528 1559 1529 $attr = '';1530 1531 1560 $width = preg_match( '/ width="([0-9]+)"/', $image, $match_width ) ? (int) $match_width[1] : 0; 1532 1561 $height = preg_match( '/ height="([0-9]+)"/', $image, $match_height ) ? (int) $match_height[1] : 0; 1533 1562 1534 if ( ! $width || ! $height ) { 1535 /* 1536 * If attempts to parse the size value failed, attempt to use the image meta data to match 1537 * the image file name from 'src' against the available sizes for an attachment. 1538 */ 1539 $image_filename = wp_basename( $image_src ); 1540 1541 if ( wp_basename( $image_meta['file'] ) === $image_filename ) { 1542 $width = (int) $image_meta['width']; 1543 $height = (int) $image_meta['height']; 1544 } else { 1545 foreach ( $image_meta['sizes'] as $image_size_data ) { 1546 if ( $image_filename === $image_size_data['file'] ) { 1547 $width = (int) $image_size_data['width']; 1548 $height = (int) $image_size_data['height']; 1549 break; 1550 } 1551 } 1552 } 1553 1554 if ( ! $width || ! $height ) { 1563 if ( $width && $height ) { 1564 $size_array = array( $width, $height ); 1565 } else { 1566 $size_array = wp_image_src_get_dimensions( $image_src, $image_meta ); 1567 if ( ! $size_array ) { 1555 1568 return $image; 1556 1569 } 1557 1558 // Add width and height if not present. 1559 $attr .= ' ' . trim( image_hwstring( $width, $height ) ); 1560 } 1561 1562 $size_array = array( $width, $height ); 1563 $srcset = wp_calculate_image_srcset( $size_array, $image_src, $image_meta, $attachment_id ); 1570 } 1571 1572 $srcset = wp_calculate_image_srcset( $size_array, $image_src, $image_meta, $attachment_id ); 1564 1573 1565 1574 if ( $srcset ) { … … 1574 1583 if ( $srcset && $sizes ) { 1575 1584 // Format the 'srcset' and 'sizes' string and escape attributes. 1576 $attr .= sprintf( ' srcset="%s"', esc_attr( $srcset ) );1585 $attr = sprintf( ' srcset="%s"', esc_attr( $srcset ) ); 1577 1586 1578 1587 if ( is_string( $sizes ) ) { 1579 1588 $attr .= sprintf( ' sizes="%s"', esc_attr( $sizes ) ); 1580 1589 } 1581 } 1582 1583 if ( empty( $attr ) ) { 1584 return $image; 1585 } 1586 1587 // Add extra attributes to the image markup. 1588 return preg_replace( '/<img ([^>]+?)[\/ ]*>/', '<img $1' . $attr . ' />', $image ); 1590 1591 // Add extra attributes to the image markup. 1592 return preg_replace( '/<img ([^>]+?)[\/ ]*>/', '<img $1' . $attr . ' />', $image ); 1593 } 1594 1595 return $image; 1589 1596 } 1590 1597 … … 1622 1629 * @since 5.5.0 1623 1630 * 1631 * @see wp_img_tag_add_width_and_height_attr() 1632 * @see wp_img_tag_add_srcset_and_sizes_attr() 1624 1633 * @see wp_img_tag_add_loading_attr() 1625 * @see wp_img_tag_add_srcset_and_sizes_attr()1626 1634 * 1627 1635 * @param string $content The HTML content to be filtered. … … 1677 1685 $filtered_image = $image; 1678 1686 1687 // Add 'width' and 'height' attributes if applicable. 1688 if ( $attachment_id > 0 && false === strpos( $filtered_image, ' width=' ) && false === strpos( $filtered_image, ' height=' ) ) { 1689 $filtered_image = wp_img_tag_add_width_and_height_attr( $filtered_image, $context, $attachment_id ); 1690 } 1691 1679 1692 // Add 'srcset' and 'sizes' attributes if applicable. 1680 1693 if ( $attachment_id > 0 && false === strpos( $filtered_image, ' srcset=' ) ) { … … 1724 1737 } 1725 1738 1726 // Images should have dimension attributes for the `loading` attribute to be added.1727 if ( false === strpos( $image, ' width=' ) || false === strpos( $image, ' height=' ) ) {1739 // Images should have source and dimension attributes for the `loading` attribute to be added. 1740 if ( false === strpos( $image, ' src=' ) || false === strpos( $image, ' width=' ) || false === strpos( $image, ' height=' ) ) { 1728 1741 return $image; 1729 1742 } 1730 1743 1731 $quote = null; 1732 1733 // Check if the img tag is valid (has `src` attribute) and get the quote character. 1734 // In almost all cases it will have src and a double quote. 1735 if ( false !== strpos( $image, ' src="' ) ) { 1736 $quote = '"'; 1737 } elseif ( preg_match( '/\ssrc\s*=(["\'])/', $image, $matches ) ) { 1738 $quote = $matches[1]; 1739 } 1740 1741 if ( $quote ) { 1742 $loading = "loading={$quote}{$value}{$quote}"; 1743 1744 return str_replace( '<img', "<img {$loading}", $image ); 1744 return str_replace( '<img', '<img loading="' . esc_attr( $value ) . '"', $image ); 1745 } 1746 1747 return $image; 1748 } 1749 1750 /** 1751 * Adds `width` and `height` attributes to an `img` HTML tag. 1752 * 1753 * @since 5.5.0 1754 * 1755 * @param string $image The HTML `img` tag where the attribute should be added. 1756 * @param string $context Additional context to pass to the filters. 1757 * @param int $attachment_id Image attachment ID. 1758 * @return string Converted 'img' element with 'width' and 'height' attributes added. 1759 */ 1760 function wp_img_tag_add_width_and_height_attr( $image, $context, $attachment_id ) { 1761 $image_src = preg_match( '/src="([^"]+)"/', $image, $match_src ) ? $match_src[1] : ''; 1762 list( $image_src ) = explode( '?', $image_src ); 1763 1764 // Return early if we couldn't get the image source. 1765 if ( ! $image_src ) { 1766 return $image; 1767 } 1768 1769 /** 1770 * Filters whether to add the missing `width` and `height` HTML attributes to the img tag. Default `true`. 1771 * 1772 * Returning anything else than `true` will not add the attributes. 1773 * 1774 * @since 5.5.0 1775 * 1776 * @param bool $value The filtered value, defaults to `true`. 1777 * @param string $image The HTML `img` tag where the attribute should be added. 1778 * @param string $context Additional context about how the function was called or where the img tag is. 1779 * @param int $attachment_id The image attachment ID. 1780 */ 1781 $add = apply_filters( 'wp_img_tag_add_width_and_height_attr', true, $image, $context, $attachment_id ); 1782 1783 if ( true === $add ) { 1784 $image_meta = wp_get_attachment_metadata( $attachment_id ); 1785 $size_array = wp_image_src_get_dimensions( $image_src, $image_meta ); 1786 1787 if ( $size_array ) { 1788 $hw = trim( image_hwstring( $size_array[0], $size_array[1] ) ); 1789 return str_replace( '<img', "<img {$hw}", $image ); 1745 1790 } 1746 1791 } -
trunk/tests/phpunit/tests/media.php
r48190 r48237 1964 1964 /** 1965 1965 * @ticket 33641 1966 * @ticket 50367 1967 */ 1968 function test_wp_filter_content_tags() { 1966 */ 1967 function test_wp_filter_content_tags_srcset_sizes() { 1969 1968 $image_meta = wp_get_attachment_metadata( self::$large_id ); 1970 1969 $size_array = $this->_get_image_size_array_from_meta( $image_meta, 'medium' ); … … 1975 1974 // Function used to build HTML for the editor. 1976 1975 $img = get_image_tag( self::$large_id, '', '', '', 'medium' ); 1977 $img = wp_img_tag_add_loading_attr( $img, 'test' );1978 1976 $img_no_size_in_class = str_replace( 'size-', '', $img ); 1979 1977 $img_no_width_height = str_replace( ' width="' . $size_array[0] . '"', '', $img ); … … 1984 1982 $img_html5 = str_replace( ' />', '>', $img ); 1985 1983 1986 $hwstring = image_hwstring( $size_array[0], $size_array[1] );1987 1988 1984 // Manually add srcset and sizes to the markup from get_image_tag(). 1989 1985 $respimg = preg_replace( '|<img ([^>]+) />|', '<img $1 ' . $srcset . ' ' . $sizes . ' />', $img ); 1990 1986 $respimg_no_size_in_class = preg_replace( '|<img ([^>]+) />|', '<img $1 ' . $srcset . ' ' . $sizes . ' />', $img_no_size_in_class ); 1991 $respimg_no_width_height = preg_replace( '|<img ([^>]+) />|', '<img $1 ' . $ hwstring . $srcset . ' ' . $sizes . ' />', $img_no_width_height );1987 $respimg_no_width_height = preg_replace( '|<img ([^>]+) />|', '<img $1 ' . $srcset . ' ' . $sizes . ' />', $img_no_width_height ); 1992 1988 $respimg_with_sizes_attr = preg_replace( '|<img ([^>]+) />|', '<img $1 ' . $srcset . ' />', $img_with_sizes_attr ); 1993 1989 $respimg_xhtml = preg_replace( '|<img ([^>]+)/>|', '<img $1 ' . $srcset . ' ' . $sizes . ' />', $img_xhtml ); … … 2001 1997 %2$s 2002 1998 2003 <p>Image, no width and height attributes. Should have width, height,srcset and sizes (from matching the file name).</p>1999 <p>Image, no width and height attributes. Should have srcset and sizes (from matching the file name).</p> 2004 2000 %3$s 2005 2001 … … 2019 2015 $content_filtered = sprintf( $content, $respimg, $respimg_no_size_in_class, $respimg_no_width_height, $img_no_size_id, $respimg_with_sizes_attr, $respimg_xhtml, $respimg_html5 ); 2020 2016 2017 // Do not add width, height, and loading. 2018 add_filter( 'wp_img_tag_add_width_and_height_attr', '__return_false' ); 2019 add_filter( 'wp_img_tag_add_loading_attr', '__return_false' ); 2020 2021 2021 $this->assertSame( $content_filtered, wp_filter_content_tags( $content_unfiltered ) ); 2022 2023 remove_filter( 'wp_img_tag_add_width_and_height_attr', '__return_false' ); 2024 remove_filter( 'wp_img_tag_add_loading_attr', '__return_false' ); 2022 2025 } 2023 2026 … … 2033 2036 * @ticket 33641 2034 2037 */ 2035 function test_wp_filter_content_tags_ wrong() {2038 function test_wp_filter_content_tags_srcset_sizes_wrong() { 2036 2039 $img = get_image_tag( self::$large_id, '', '', '', 'medium' ); 2037 2040 $img = wp_img_tag_add_loading_attr( $img, 'test' ); … … 2046 2049 * @ticket 33641 2047 2050 */ 2048 function test_wp_filter_content_tags_ with_preexisting_srcset() {2051 function test_wp_filter_content_tags_srcset_sizes_with_preexisting_srcset() { 2049 2052 // Generate HTML and add a dummy srcset attribute. 2050 2053 $img = get_image_tag( self::$large_id, '', '', '', 'medium' ); … … 2533 2536 2534 2537 /** 2538 * @ticket 50367 2539 */ 2540 function test_wp_filter_content_tags_width_height() { 2541 $image_meta = wp_get_attachment_metadata( self::$large_id ); 2542 $size_array = $this->_get_image_size_array_from_meta( $image_meta, 'medium' ); 2543 2544 $img = get_image_tag( self::$large_id, '', '', '', 'medium' ); 2545 $img_no_width_height = str_replace( ' width="' . $size_array[0] . '"', '', $img ); 2546 $img_no_width_height = str_replace( ' height="' . $size_array[1] . '"', '', $img_no_width_height ); 2547 $img_no_width = str_replace( ' width="' . $size_array[0] . '"', '', $img ); 2548 $img_no_height = str_replace( ' height="' . $size_array[1] . '"', '', $img ); 2549 2550 $hwstring = image_hwstring( $size_array[0], $size_array[1] ); 2551 2552 // Manually add width and height to the markup from get_image_tag(). 2553 $respimg_no_width_height = str_replace( '<img ', '<img ' . $hwstring, $img_no_width_height ); 2554 2555 $content = ' 2556 <p>Image, with width and height. Should NOT be modified.</p> 2557 %1$s 2558 2559 <p>Image, no width and height attributes. Should have width, height, srcset and sizes (from matching the file name).</p> 2560 %2$s 2561 2562 <p>Image, no width but height attribute. Should NOT be modified.</p> 2563 %3$s 2564 2565 <p>Image, no height but width attribute. Should NOT be modified.</p> 2566 %4$s'; 2567 2568 $content_unfiltered = sprintf( $content, $img, $img_no_width_height, $img_no_width, $img_no_height ); 2569 $content_filtered = sprintf( $content, $img, $respimg_no_width_height, $img_no_width, $img_no_height ); 2570 2571 // Do not add loading, srcset, and sizes. 2572 add_filter( 'wp_img_tag_add_loading_attr', '__return_false' ); 2573 add_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' ); 2574 2575 $this->assertSame( $content_filtered, wp_filter_content_tags( $content_unfiltered ) ); 2576 2577 remove_filter( 'wp_img_tag_add_loading_attr', '__return_false' ); 2578 remove_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' ); 2579 } 2580 2581 /** 2535 2582 * @ticket 44427 2536 2583 * @ticket 50367 2537 2584 */ 2538 function test_wp_ lazy_load_content_media() {2585 function test_wp_filter_content_tags_loading_lazy() { 2539 2586 $image_meta = wp_get_attachment_metadata( self::$large_id ); 2540 2587 $size_array = $this->_get_image_size_array_from_meta( $image_meta, 'medium' ); … … 2571 2618 $content_filtered = sprintf( $content, $lazy_img, $lazy_img_xhtml, $lazy_img_html5, $img_eager, $img_no_width_height, $iframe ); 2572 2619 2573 // Do not add srcset and sizes. 2620 // Do not add width, height, srcset, and sizes. 2621 add_filter( 'wp_img_tag_add_width_and_height_attr', '__return_false' ); 2574 2622 add_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' ); 2575 2623 2576 2624 $this->assertSame( $content_filtered, wp_filter_content_tags( $content_unfiltered ) ); 2577 2625 2626 remove_filter( 'wp_img_tag_add_width_and_height_attr', '__return_false' ); 2578 2627 remove_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' ); 2579 2628 } … … 2582 2631 * @ticket 44427 2583 2632 */ 2584 function test_wp_ lazy_load_content_media_opted_in() {2633 function test_wp_filter_content_tags_loading_lazy_opted_in() { 2585 2634 $img = get_image_tag( self::$large_id, '', '', '', 'medium' ); 2586 2635 $lazy_img = wp_img_tag_add_loading_attr( $img, 'test' ); … … 2607 2656 * @ticket 44427 2608 2657 */ 2609 function test_wp_ lazy_load_content_media_opted_out() {2658 function test_wp_filter_content_tags_loading_lazy_opted_out() { 2610 2659 $img = get_image_tag( self::$large_id, '', '', '', 'medium' ); 2611 2660 … … 2627 2676 2628 2677 /** 2629 * @ticket 444272630 */ 2631 function test_wp_img_tag_add_loading_attr_ single_quote() {2632 $img = "<img src='example.png' alt='' width='300' height='225' />";2678 * @ticket 50367 2679 */ 2680 function test_wp_img_tag_add_loading_attr_without_src() { 2681 $img = '<img alt=" width="300" height="225" />'; 2633 2682 $img = wp_img_tag_add_loading_attr( $img, 'test' ); 2634 2683 2635 $this->assert Contains( " loading='lazy'", $img );2684 $this->assertNotContains( ' loading="lazy"', $img ); 2636 2685 } 2637 2686 }
Note: See TracChangeset
for help on using the changeset viewer.