RichText: Fix prepareEditableTree (#14284)

* Fix use of __experimentalCreatePrepareEditableTree without __experimentalCreateOnChangeEditableValue * Add unit tests
WordPress · Mar 20, 2019 · 775a163 · 775a163
1 parent ad6afa3
commit 775a163
Show file tree

Hide file tree

Showing 4 changed files with 57 additions and 5 deletions.
diff --git a/packages/rich-text/src/create.js b/packages/rich-text/src/create.js
@@ -57,6 +57,13 @@ function toFormat( { type, attributes } ) {
 		return attributes ? { type, attributes } : { type };
 	}
 
+	if (
+		formatType.__experimentalCreatePrepareEditableTree &&
+		! formatType.__experimentalCreateOnChangeEditableValue
+	) {
+		return null;
+	}
+
 	if ( ! attributes ) {
 		return { type: formatType.name };
 	}

diff --git a/packages/rich-text/src/register-format-type.js b/packages/rich-text/src/register-format-type.js
@@ -143,7 +143,7 @@ export function registerFormatType( name, settings ) {
 	} );
 
 	if (
-		settings.__experimentalGetPropsForEditableTreePreparation
+		settings.__experimentalCreatePrepareEditableTree
 	) {
 		addFilter( 'experimentalRichText', name, ( OriginalComponent ) => {
 			let Component = OriginalComponent;
@@ -197,17 +197,19 @@ export function registerFormatType( name, settings ) {
 				};
 			}
 
-			const hocs = [
-				withSelect( ( sel, { clientId, identifier } ) => ( {
+			const hocs = [];
+
+			if ( settings.__experimentalGetPropsForEditableTreePreparation ) {
+				hocs.push( withSelect( ( sel, { clientId, identifier } ) => ( {
 					[ `format_${ name }` ]: settings.__experimentalGetPropsForEditableTreePreparation(
 						sel,
 						{
 							richTextIdentifier: identifier,
 							blockClientId: clientId,
 						}
 					),
-				} ) ),
-			];
+				} ) ) );
+			}
 
 			if ( settings.__experimentalGetPropsForEditableTreeChangeHandler ) {
 				hocs.push( withDispatch( ( disp, { clientId, identifier } ) => {

diff --git a/packages/rich-text/src/test/helpers/index.js b/packages/rich-text/src/test/helpers/index.js
@@ -650,4 +650,42 @@ export const specWithRegistration = [
 			text: 'a',
 		},
 	},
+	{
+		description: 'should not create format if editable tree only',
+		formatName: 'my-plugin/link',
+		formatType: {
+			title: 'Custom Link',
+			tagName: 'a',
+			className: 'custom-format',
+			edit() {},
+			__experimentalCreatePrepareEditableTree() {},
+		},
+		html: '<a class="custom-format">a</a>',
+		value: {
+			formats: [ , ],
+			text: 'a',
+		},
+		noToHTMLString: true,
+	},
+	{
+		description: 'should create format if editable tree only but changes need to be recorded',
+		formatName: 'my-plugin/link',
+		formatType: {
+			title: 'Custom Link',
+			tagName: 'a',
+			className: 'custom-format',
+			edit() {},
+			__experimentalCreatePrepareEditableTree() {},
+			__experimentalCreateOnChangeEditableValue() {},
+		},
+		html: '<a class="custom-format">a</a>',
+		value: {
+			formats: [ [ {
+				type: 'my-plugin/link',
+				attributes: {},
+				unregisteredAttributes: {},
+			} ] ],
+			text: 'a',
+		},
+	},
 ];
diff --git a/packages/rich-text/src/test/to-html-string.js b/packages/rich-text/src/test/to-html-string.js
@@ -35,7 +35,12 @@ describe( 'toHTMLString', () => {
 		formatType,
 		html,
 		value,
+		noToHTMLString,
 	} ) => {
+		if ( noToHTMLString ) {
+			return;
+		}
+
 		it( description, () => {
 			if ( formatName ) {
 				registerFormatType( formatName, formatType );