From 4a47dff7b50c9cb1051886458796d3621158bef0 Mon Sep 17 00:00:00 2001
From: Jorge <jorge.costa@developer.pt>
Date: Thu, 4 Oct 2018 10:27:29 -0400
Subject: [PATCH] Fix: File Block is crashing as soon as a file is selected
 (#10323)

---
 packages/block-library/src/file/edit.js       |  6 ++---
 packages/block-library/src/file/index.js      | 20 +++++++++-------
 .../fixtures/core__file__new-window.json      | 24 +++++++++++++++++--
 .../core__file__no-download-button.json       | 20 ++++++++++++++--
 .../fixtures/core__file__no-text-link.json    | 18 +++++++++++++-
 5 files changed, 71 insertions(+), 17 deletions(-)

diff --git a/packages/block-library/src/file/edit.js b/packages/block-library/src/file/edit.js
index 49b57c9220547..34e2eb8331d47 100644
--- a/packages/block-library/src/file/edit.js
+++ b/packages/block-library/src/file/edit.js
@@ -24,6 +24,7 @@ import {
 	mediaUpload,
 } from '@wordpress/editor';
 import { compose } from '@wordpress/compose';
+import { create } from '@wordpress/rich-text';
 
 /**
  * Internal dependencies
@@ -80,7 +81,7 @@ class FileEdit extends Component {
 			this.setState( { hasError: false } );
 			this.props.setAttributes( {
 				href: media.url,
-				fileName: media.title,
+				fileName: create( { text: media.title } ),
 				textLinkHref: media.url,
 				id: media.id,
 			} );
@@ -189,9 +190,7 @@ class FileEdit extends Component {
 						<RichText
 							wrapperClassName={ `${ className }__textlink` }
 							tagName="div" // must be block-level or else cursor disappears
-							format="string"
 							value={ fileName }
-							multiline="false"
 							placeholder={ __( 'Write file name…' ) }
 							keepPlaceholderOnFocus
 							formattingControls={ [] } // disable controls
@@ -207,7 +206,6 @@ class FileEdit extends Component {
 									formattingControls={ [] } // disable controls
 									placeholder={ __( 'Add text…' ) }
 									keepPlaceholderOnFocus
-									multiline="false"
 									onChange={ ( text ) => setAttributes( { downloadButtonText: text } ) }
 								/>
 							</div>
diff --git a/packages/block-library/src/file/index.js b/packages/block-library/src/file/index.js
index 6dee26f23b2c0..cb64f01a3fdeb 100644
--- a/packages/block-library/src/file/index.js
+++ b/packages/block-library/src/file/index.js
@@ -10,6 +10,8 @@ import { __ } from '@wordpress/i18n';
 import { createBlobURL } from '@wordpress/blob';
 import { createBlock } from '@wordpress/blocks';
 import { select } from '@wordpress/data';
+import { RichText } from '@wordpress/editor';
+import { getTextContent, isEmpty } from '@wordpress/rich-text';
 
 /**
  * Internal dependencies
@@ -37,8 +39,7 @@ export const settings = {
 			type: 'string',
 		},
 		fileName: {
-			type: 'string',
-			source: 'text',
+			source: 'rich-text',
 			selector: 'a:not([download])',
 		},
 		// Differs to the href when the block is configured to link to the attachment page
@@ -60,8 +61,7 @@ export const settings = {
 			default: true,
 		},
 		downloadButtonText: {
-			type: 'string',
-			source: 'text',
+			source: 'rich-text',
 			selector: 'a[download]',
 			default: __( 'Download' ),
 		},
@@ -203,13 +203,15 @@ export const settings = {
 
 		return ( href &&
 			<div>
-				{ fileName &&
+				{ ! isEmpty( fileName ) &&
 					<a
 						href={ textLinkHref }
 						target={ textLinkTarget }
 						rel={ textLinkTarget ? 'noreferrer noopener' : false }
 					>
-						{ fileName }
+						<RichText.Content
+							value={ fileName }
+						/>
 					</a>
 				}
 				{ showDownloadButton &&
@@ -219,9 +221,11 @@ export const settings = {
 						// ensure download attribute is still set when fileName
 						// is undefined. Using '' here as `true` still leaves
 						// the attribute unset.
-						download={ fileName || '' }
+						download={ getTextContent( fileName ) }
 					>
-						{ downloadButtonText }
+						<RichText.Content
+							value={ downloadButtonText }
+						/>
 					</a>
 				}
 			</div>
diff --git a/test/integration/full-content/fixtures/core__file__new-window.json b/test/integration/full-content/fixtures/core__file__new-window.json
index 4922f02880ecc..8882cfdaf9d7b 100644
--- a/test/integration/full-content/fixtures/core__file__new-window.json
+++ b/test/integration/full-content/fixtures/core__file__new-window.json
@@ -6,11 +6,31 @@
         "attributes": {
             "id": 176,
             "href": "http://localhost:8888/wp-content/uploads/2018/05/keycodes.js",
-            "fileName": "6546",
+            "fileName": {
+                "formats": [
+                    null,
+                    null,
+                    null,
+                    null
+                ],
+                "text": "6546"
+            },
             "textLinkHref": "http://localhost:8888/wp-content/uploads/2018/05/keycodes.js",
             "textLinkTarget": "_blank",
             "showDownloadButton": true,
-            "downloadButtonText": "Download"
+            "downloadButtonText": {
+                "formats": [
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null
+                ],
+                "text": "Download"
+            }
         },
         "innerBlocks": [],
         "originalContent": "<div class=\"wp-block-file\"><a href=\"http://localhost:8888/wp-content/uploads/2018/05/keycodes.js\" target=\"_blank\" rel=\"noreferrer noopener\">6546</a><a href=\"http://localhost:8888/wp-content/uploads/2018/05/keycodes.js\" class=\"wp-block-file__button\" download=\"6546\">Download</a></div>"
diff --git a/test/integration/full-content/fixtures/core__file__no-download-button.json b/test/integration/full-content/fixtures/core__file__no-download-button.json
index dc6e378cc67b3..f2ba1e521615e 100644
--- a/test/integration/full-content/fixtures/core__file__no-download-button.json
+++ b/test/integration/full-content/fixtures/core__file__no-download-button.json
@@ -6,10 +6,26 @@
         "attributes": {
             "id": 176,
             "href": "http://localhost:8888/wp-content/uploads/2018/05/keycodes.js",
-            "fileName": "lkjfijwef",
+            "fileName": {
+                "formats": [
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null
+                ],
+                "text": "lkjfijwef"
+            },
             "textLinkHref": "http://localhost:8888/?attachment_id=176",
             "showDownloadButton": false,
-            "downloadButtonText": "Download"
+            "downloadButtonText": {
+                "formats": [],
+                "text": ""
+            }
         },
         "innerBlocks": [],
         "originalContent": "<div class=\"wp-block-file\"><a href=\"http://localhost:8888/?attachment_id=176\">lkjfijwef</a></div>"
diff --git a/test/integration/full-content/fixtures/core__file__no-text-link.json b/test/integration/full-content/fixtures/core__file__no-text-link.json
index 168733894e2ee..6a3ac7afc6078 100644
--- a/test/integration/full-content/fixtures/core__file__no-text-link.json
+++ b/test/integration/full-content/fixtures/core__file__no-text-link.json
@@ -6,8 +6,24 @@
         "attributes": {
             "id": 176,
             "href": "http://localhost:8888/wp-content/uploads/2018/05/keycodes.js",
+            "fileName": {
+                "formats": [],
+                "text": ""
+            },
             "showDownloadButton": true,
-            "downloadButtonText": "Download"
+            "downloadButtonText": {
+                "formats": [
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null,
+                    null
+                ],
+                "text": "Download"
+            }
         },
         "innerBlocks": [],
         "originalContent": "<div class=\"wp-block-file\"><a href=\"http://localhost:8888/wp-content/uploads/2018/05/keycodes.js\" class=\"wp-block-file__button\" download=\"\">Download</a></div>"