From 03c9bc05be73ac4ec986e234c0c46c7d7a7a5ed5 Mon Sep 17 00:00:00 2001 From: Grzegorz Ziolkowski Date: Tue, 24 Oct 2017 09:46:42 +0200 Subject: [PATCH] Framework: Final touches to allow saving blocks state as a tree --- blocks/api/source.js | 12 +++------ blocks/api/test/source.js | 24 ++++++++++++++--- blocks/editable/test/index.js | 9 ++----- blocks/library/table/index.js | 27 ++++++++++++++++--- .../core__pullquote__multi-paragraph.json | 10 ++++--- 5 files changed, 56 insertions(+), 26 deletions(-) diff --git a/blocks/api/source.js b/blocks/api/source.js index 0c143b1c1489c8..0a9e8e89c60fe9 100644 --- a/blocks/api/source.js +++ b/blocks/api/source.js @@ -2,7 +2,7 @@ * External dependencies */ import { nodeListToReact, nodeToReact } from 'dom-react'; -import { flow, omit } from 'lodash'; +import { flatten, flow, omit } from 'lodash'; import { attr as originalAttr, prop as originalProp, @@ -25,12 +25,8 @@ function withKnownSourceFlag( fn ) { } ); } -function toArray( ...args ) { - return [ toElement( ...args ) ]; -} - -function toElement( type, props, ...children ) { - return [ type, omit( props, 'key' ), ...children ]; +function toArray( type, props, ...children ) { + return [ [ type, omit( props, 'key' ), ...children ] ]; } export const attr = withKnownSourceFlag( originalAttr ); @@ -61,6 +57,6 @@ export const node = withKnownSourceFlag( ( selector ) => { match = domNode.querySelector( selector ); } - return nodeToReact( match, toElement ); + return flatten( nodeToReact( match, toArray ) ); }; } ); diff --git a/blocks/api/test/source.js b/blocks/api/test/source.js index e6e6b7fdbdf091..cf33f8c37f01ce 100644 --- a/blocks/api/test/source.js +++ b/blocks/api/test/source.js @@ -15,6 +15,8 @@ import * as sources from '../source'; import { valueToElement } from '../../editable'; describe( 'sources', () => { + const html = '

A delicious sundae dessert.

I want it!

The Cook
'; + it( 'should generate sources which apply internal flag', () => { for ( const sourceFn in sources ) { expect( sources[ sourceFn ]()._wpBlocksKnownSource ).toBe( true ); @@ -31,7 +33,6 @@ describe( 'sources', () => { it( 'should return HTML equivalent WPElement of matched element', () => { // Assumption here is that we can cleanly convert back and forth // between a string and WPElement representation - const html = '

A delicious sundae dessert.

I want it!

'; const match = parse( html, sources.children() ); expect( renderToString( valueToElement( match ) ) ).toBe( html ); @@ -48,10 +49,27 @@ describe( 'sources', () => { it( 'should return HTML equivalent WPElement of matched element', () => { // Assumption here is that we can cleanly convert back and forth // between a string and WPElement representation - const html = '

A delicious sundae dessert.

'; const match = parse( html, sources.node() ); - expect( renderToString( valueToElement( [ match ] ) ) ).toBe( `${ html }` ); + expect( + renderToString( valueToElement( [ match ] ) ) + ).toBe( + `${ html }` + ); + } ); + } ); + + describe( 'query', () => { + it( 'should return HTML equivalent WPElement of matched element using selector', () => { + // Assumption here is that we can cleanly convert back and forth + // between a string and WPElement representation + const match = parse( html, sources.query( 'blockquote > p', sources.node( ) ) ); + + expect( + renderToString( valueToElement( match ) + ) ).toBe( + '

A delicious sundae dessert.

I want it!

' + ); } ); } ); } ); diff --git a/blocks/editable/test/index.js b/blocks/editable/test/index.js index cdf2a286b99c79..fdd229ee80d7b0 100644 --- a/blocks/editable/test/index.js +++ b/blocks/editable/test/index.js @@ -70,13 +70,8 @@ describe( 'Editable', () => { [ 'strong', {}, 'paragraph' ], ' with a ', [ 'a', { href: 'https://w.org/' }, 'link with ', [ - 'b', - {}, - 'bold ', - [ - 'i', - {}, - 'and italics', + 'b', {}, 'bold ', [ + 'i', {}, 'and italics', ], ] ], '.', diff --git a/blocks/library/table/index.js b/blocks/library/table/index.js index 303e893cfa2b86..ee9db61102013b 100644 --- a/blocks/library/table/index.js +++ b/blocks/library/table/index.js @@ -28,10 +28,29 @@ registerBlockType( 'core/table', { type: 'array', source: children( 'table' ), default: [ - -

-

- , + [ + 'tbody', {}, [ + 'tr', {}, [ + 'td', {}, [ + 'br', {}, + ], + ], [ + 'td', {}, [ + 'br', {}, + ], + ], + ], [ + 'tr', {}, [ + 'td', {}, [ + 'br', {}, + ], + ], [ + 'td', {}, [ + 'br', {}, + ], + ], + ], + ], ], }, align: { diff --git a/blocks/test/fixtures/core__pullquote__multi-paragraph.json b/blocks/test/fixtures/core__pullquote__multi-paragraph.json index 485e46db6b235e..6fe1e8d6e63881 100644 --- a/blocks/test/fixtures/core__pullquote__multi-paragraph.json +++ b/blocks/test/fixtures/core__pullquote__multi-paragraph.json @@ -2,16 +2,18 @@ { "uid": "_uid_0", "name": "core/pullquote", - "isValid": false, + "isValid": true, "attributes": { "value": [ [ "p", {}, "Paragraph ", - "strong", - {}, - "one" + [ + "strong", + {}, + "one" + ] ], [ "p",