From 94da293e5f6a9e7bb5076c626b4e03c70da2f8aa Mon Sep 17 00:00:00 2001
From: Joe McGill <joemcgill@git.wordpress.org>
Date: Wed, 13 Jul 2016 15:23:27 +0000
Subject: [PATCH] Media: URL encode spaces in `srcset` attributes.

In some cases, images in the media library may contain spaces in
their filenames. This results in an invalid `srcset` attribute,
causing broken images on the front end. This change fixes the issue
by replacing spaces in URLs with URL encoded '%20' characters before
returning the `srcset` string.

Props underdude, joemcgill.
Fixes #36549.

git-svn-id: https://develop.svn.wordpress.org/trunk@38052 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-includes/media.php     |  4 ++--
 tests/phpunit/tests/media.php | 44 +++++++++++++++++++++++++++++++++++
 2 files changed, 46 insertions(+), 2 deletions(-)

diff --git a/src/wp-includes/media.php b/src/wp-includes/media.php
index df96a17cf8..086d50ea45 100644
--- a/src/wp-includes/media.php
+++ b/src/wp-includes/media.php
@@ -1142,7 +1142,7 @@ function wp_calculate_image_srcset( $size_array, $image_src, $image_meta, $attac
 	 * @param array  $size_array    Array of width and height values in pixels (in that order).
 	 * @param string $image_src     The 'src' of the image.
 	 * @param array  $image_meta    The image meta data as returned by 'wp_get_attachment_metadata()'.
- 	 * @param int    $attachment_id Image attachment ID or 0.
+	 * @param int    $attachment_id Image attachment ID or 0.
 	 */
 	$sources = apply_filters( 'wp_calculate_image_srcset', $sources, $size_array, $image_src, $image_meta, $attachment_id );
 
@@ -1154,7 +1154,7 @@ function wp_calculate_image_srcset( $size_array, $image_src, $image_meta, $attac
 	$srcset = '';
 
 	foreach ( $sources as $source ) {
-		$srcset .= $source['url'] . ' ' . $source['value'] . $source['descriptor'] . ', ';
+		$srcset .= str_replace( ' ', '%20', $source['url'] ) . ' ' . $source['value'] . $source['descriptor'] . ', ';
 	}
 
 	return rtrim( $srcset, ', ' );
diff --git a/tests/phpunit/tests/media.php b/tests/phpunit/tests/media.php
index 7bd9f49fcf..5d8449fbdc 100644
--- a/tests/phpunit/tests/media.php
+++ b/tests/phpunit/tests/media.php
@@ -1321,6 +1321,50 @@ EOF;
 		$this->assertSame( $expected_srcset, wp_calculate_image_srcset( $size_array, $image_src, $image_meta5 ) );
 	}
 
+	/**
+	 * @ticket 36549
+	 * @ticket 33641
+	 */
+	function test_wp_calculate_image_srcset_with_spaces_in_filenames() {
+		// Mock data for this test.
+		$image_src = 'http://' . WP_TESTS_DOMAIN . '/wp-content/uploads/2015/12/test image-300x150.png';
+		$image_meta = array(
+			'width' => 2000,
+			'height' => 1000,
+			'file' => '2015/12/test image.png',
+			'sizes' => array(
+				'thumbnail' => array(
+					'file' => 'test image-150x150.png',
+					'width' => 150,
+					'height' => 150,
+					'mime-type' => 'image/png',
+				),
+				'medium' => array(
+					'file' => 'test image-300x150.png',
+					'width' => 300,
+					'height' => 150,
+					'mime-type' => 'image/png',
+				),
+				'medium_large' => array(
+					'file' => 'test image-768x384.png',
+					'width' => 768,
+					'height' => 384,
+					'mime-type' => 'image/png',
+				),
+				'large' => array(
+					'file' => 'test image-1024x512.png',
+					'width' => 1024,
+					'height' => 512,
+					'mime-type' => 'image/png',
+				),
+			),
+		);
+
+		$expected_srcset = 'http://' . WP_TESTS_DOMAIN . '/wp-content/uploads/2015/12/test%20image-300x150.png 300w, http://' . WP_TESTS_DOMAIN . '/wp-content/uploads/2015/12/test%20image-768x384.png 768w, http://' . WP_TESTS_DOMAIN . '/wp-content/uploads/2015/12/test%20image-1024x512.png 1024w';
+
+		$this->assertSame( $expected_srcset, wp_calculate_image_srcset( array( 300, 150 ), $image_src, $image_meta ) );
+	}
+
 	/**
 	 * @ticket 33641
 	 */