From e4d749a8fb0d0a97ab9a2b665d41cf26ce8995db Mon Sep 17 00:00:00 2001
From: Andrew Duthie <aduthie7@gmail.com>
Date: Mon, 8 May 2017 09:40:15 -0400
Subject: [PATCH] Test caption length when considering to show editable (#684)

* Remove paragraphs from captioned content

* Test caption length when considering to show editable

* Treat serialized content as array

* Test truthiness of children before assuming property

Can be undefined for new block. We may want to look to provide default,
but for now simply test truthiness.
---
 blocks/library/embed/index.js | 4 ++--
 blocks/library/image/index.js | 4 ++--
 blocks/library/quote/index.js | 8 +++++---
 post-content.js               | 4 ++--
 4 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/blocks/library/embed/index.js b/blocks/library/embed/index.js
index 20cbf22484ffbd..74d0be2e624788 100644
--- a/blocks/library/embed/index.js
+++ b/blocks/library/embed/index.js
@@ -48,7 +48,7 @@ registerBlock( 'core/embed', {
 				<div className="iframe-overlay">
 					<iframe src={ url } title={ title } />
 				</div>
-				{ caption || !! focus ? (
+				{ ( caption && caption.length > 0 ) || !! focus ? (
 					<Editable
 						tagName="figcaption"
 						placeholder={ wp.i18n.__( 'Write caption…' ) }
@@ -67,7 +67,7 @@ registerBlock( 'core/embed', {
 		const { url, title, caption } = attributes;
 		const iframe = <iframe src={ url } title={ title } />;
 
-		if ( ! caption ) {
+		if ( ! caption || ! caption.length ) {
 			return iframe;
 		}
 
diff --git a/blocks/library/image/index.js b/blocks/library/image/index.js
index c7e26f0e237dfa..d3855096de3573 100644
--- a/blocks/library/image/index.js
+++ b/blocks/library/image/index.js
@@ -94,7 +94,7 @@ registerBlock( 'core/image', {
 		return (
 			<figure className="blocks-image">
 				<img src={ url } alt={ alt } />
-				{ caption || !! focus ? (
+				{ ( caption && caption.length > 0 ) || !! focus ? (
 					<Editable
 						tagName="figcaption"
 						placeholder={ wp.i18n.__( 'Write caption…' ) }
@@ -113,7 +113,7 @@ registerBlock( 'core/image', {
 		const { url, alt, caption, align = 'none' } = attributes;
 		const img = <img src={ url } alt={ alt } className={ `align${ align }` } />;
 
-		if ( ! caption ) {
+		if ( ! caption || ! caption.length ) {
 			return img;
 		}
 
diff --git a/blocks/library/quote/index.js b/blocks/library/quote/index.js
index e983c5af3a791c..690dfd7946d95b 100644
--- a/blocks/library/quote/index.js
+++ b/blocks/library/quote/index.js
@@ -120,7 +120,7 @@ registerBlock( 'core/quote', {
 					onMerge={ mergeWithPrevious }
 					showAlignments
 				/>
-				{ ( citation || !! focus ) && (
+				{ ( ( citation && citation.length > 0 ) || !! focus ) && (
 					<Editable
 						tagName="footer"
 						value={ citation }
@@ -143,10 +143,12 @@ registerBlock( 'core/quote', {
 
 		return (
 			<blockquote className={ `blocks-quote-style-${ style }` }>
-				{ value && wp.element.Children.map( value, ( paragraph, i ) => (
+				{ value && value.map( ( paragraph, i ) => (
 					<p key={ i }>{ paragraph }</p>
 				) ) }
-				<footer>{ citation }</footer>
+				{ citation && citation.length > 0 && (
+					<footer>{ citation }</footer>
+				) }
 			</blockquote>
 		);
 	}
diff --git a/post-content.js b/post-content.js
index e55d831dc6bbb8..6453504581fba9 100644
--- a/post-content.js
+++ b/post-content.js
@@ -30,7 +30,7 @@ window._wpGutenbergPost = {
 			'<!-- /wp:core/text -->',
 
 			'<!-- wp:core/image align="center" -->',
-			'<figure><img src="https://cldup.com/E4PzNdrFSQ.jpg" class="aligncenter"/><figcaption><p>Give it a try. Press the &quot;really wide&quot; button on the image toolbar.</p></figcaption></figure>',
+			'<figure><img src="https://cldup.com/E4PzNdrFSQ.jpg" class="aligncenter"/><figcaption>Give it a try. Press the &quot;really wide&quot; button on the image toolbar.</figcaption></figure>',
 			'<!-- /wp:core/image -->',
 
 			'<!-- wp:core/text -->',
@@ -38,7 +38,7 @@ window._wpGutenbergPost = {
 			'<!-- /wp:core/text -->',
 
 			'<!-- wp:core/embed url="https://www.youtube.com/watch?v=Nl6U7UotA-M" -->',
-			'<figure><iframe width="560" height="315" src="//www.youtube.com/embed/Nl6U7UotA-M" frameborder="0" allowfullscreen></iframe><figcaption><p>State of the Word 2016</p></figcaption></figure>',
+			'<figure><iframe width="560" height="315" src="//www.youtube.com/embed/Nl6U7UotA-M" frameborder="0" allowfullscreen></iframe><figcaption>State of the Word 2016</figcaption></figure>',
 			'<!-- /wp:core/embed -->',
 
 			'<!-- wp:core/heading -->',