Editable: Add unit tests to verify Editable.Value

blocks/editable/index.js

@@ -666,6 +666,10 @@ Editable.contextTypes = {
 Editable.Value = ( { value } ) => valueToReact( value );
 
 function valueToReact( value ) {
+	if ( ! Array.isArray( value ) ) {
+		return value;
+	}
+
 	return value.map( ( element, i ) => {
 		if ( typeof element === 'string' ) {
 			return element;

blocks/editable/test/index.js

@@ -40,4 +40,52 @@ describe( 'Editable', () => {
 		} );
 		/* eslint-enable no-console */
 	} );
+
+	describe( 'Editable.Value', () => {
+		const Component = ( { value } ) => (
+			<div>
+				<Editable.Value value={ value } />
+			</div>
+		);
+
+		it( 'should render value containing string', () => {
+			const value = [ 'Hello, Dolly!' ];
+			const wrapper = shallow( <Component value={ value } /> );
+
+			expect( wrapper.html() ).toBe( '<div>Hello, Dolly!</div>' );
+		} );
+
+		it( 'should render value containing a single DOM node', () => {
+			const value = [
+				[ 'h1', {}, 'This is a header' ],
+			];
+			const wrapper = shallow( <Component value={ value } /> );
+
+			expect( wrapper.html() ).toBe( '<div><h1>This is a header</h1></div>' );
+		} );
+
+		it( 'should render value with deeply nested DOM nodes', () => {
+			const value = [
+				'This is a ',
+				[ 'strong', {}, 'paragraph', ],
+				' with a ',
+				[ 'a', { href: 'https://w.org/' }, 'link with ', [
+					'b',
+					{},
+					'bold ',
+					[
+						'i',
+						{},
+						'and italics',
+					],
+				] ],
+				'.',
+			];
+			const wrapper = shallow( <Component value={ value } /> );
+
+			expect( wrapper.html() ).toBe(
+				'<div>This is a <strong>paragraph</strong> with a <a href=\"https://w.org/\">link with <b>bold <i>and italics</i></b></a>.</div>'
+			);
+		} );
+	} );
 } );