Merge pull request #3218 from Automattic/fix/null-uri-on-canonical

PostNorm: Make images safe before we choose a first pass canonical.

Author: blowery

client/lib/feed-post-store/normalization-rules.js

@@ -29,8 +29,8 @@ const fastPostNormalizationRules = [
 		postNormalizer.preventWidows,
 		postNormalizer.makeSiteIDSafeForAPI,
 		postNormalizer.pickPrimaryTag,
-		postNormalizer.firstPassCanonicalImage,
 		postNormalizer.safeImageProperties( READER_CONTENT_WIDTH ),
+		postNormalizer.firstPassCanonicalImage,
 		postNormalizer.withContentDOM( [
 			postNormalizer.content.removeStyles,
 			postNormalizer.content.safeContentImages( READER_CONTENT_WIDTH ),

client/lib/post-normalizer/index.js

@@ -28,12 +28,11 @@ var assign = require( 'lodash/object/assign' ),
 var formatting = require( 'lib/formatting' ),
 	safeImageURL = require( 'lib/safe-image-url' );
 
-
 const DEFAULT_PHOTON_QUALITY = 80, // 80 was chosen after some heuristic testing as the best blend of size and quality
 	READING_WORDS_PER_SECOND = 250 / 60; // Longreads says that people can read 250 words per minute. We want the rate in words per second.
 
 const imageScaleFactor = ( typeof window !== 'undefined' && window.devicePixelRatio && window.devicePixelRatio > 1 ) ? 2 : 1,
-TRANSPARENT_GIF = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
+	TRANSPARENT_GIF = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
 
 function debugForPost( post ) {
 	return function( msg ) {
@@ -57,8 +56,6 @@ function stripAutoPlays( query ) {
 	return query;
 }
 
-
-
 /**
  * Asynchronously normalizes an object shaped like a post. Works on a copy of the post and does not mutate the original post.
  * @param  {object} post A post shaped object, generally returned by the API
@@ -331,6 +328,13 @@ normalizePost.safeImageProperties = function( maxWidth ) {
 		if ( post.canonical_image && post.canonical_image.type === 'image' ) {
 			makeImageURLSafe( post.canonical_image, 'uri', maxWidth, post.URL );
 		}
+		if ( post.attachments ) {
+			forOwn( post.attachments, function( attachment ) {
+				if ( startsWith( attachment.mime_type, 'image/' ) ) {
+					makeImageURLSafe( attachment, 'URL', maxWidth, post.URL );
+				}
+			} );
+		}
 
 		callback();
 	};

client/lib/post-normalizer/test/post-normalizer-test.js

@@ -216,12 +216,24 @@ describe( 'post-normalizer', function() {
 				featured_media: {
 					uri: 'http://example.com/media.jpg',
 					type: 'image'
+				},
+				attachments: {
+					1234: {
+						mime_type: 'image/png',
+						URL: 'http://example.com/media.jpg'
+					},
+					3456: {
+						mime_type: 'text/text',
+						URL: 'http://example.com/media.jpg'
+					}
 				}
 			};
 			normalizer( post, [ normalizer.safeImageProperties( 200 ) ], function( err, normalized ) {
 				assert.strictEqual( normalized.author.avatar_URL, 'http://example.com/me.jpg-SAFE?w=200&quality=80&strip=info' );
 				assert.strictEqual( normalized.featured_image, 'http://foo.bar/-SAFE?w=200&quality=80&strip=info' );
 				assert.strictEqual( normalized.featured_media.uri, 'http://example.com/media.jpg-SAFE?w=200&quality=80&strip=info' );
+				assert.strictEqual( normalized.attachments['1234'].URL, 'http://example.com/media.jpg-SAFE?w=200&quality=80&strip=info' )
+				assert.strictEqual( normalized.attachments['3456'].URL, 'http://example.com/media.jpg' );
 				done( err );
 			} );
 		} );

client/lib/posts/utils.js

@@ -117,8 +117,8 @@ var utils = {
 			[
 				postNormalizer.decodeEntities,
 				postNormalizer.stripHTML,
-				postNormalizer.firstPassCanonicalImage,
 				postNormalizer.safeImageProperties( imageWidth ),
+				postNormalizer.firstPassCanonicalImage,
 				postNormalizer.withContentDOM( [
 					postNormalizer.content.removeStyles,
 					postNormalizer.content.safeContentImages( imageWidth )