From da3f0961156bf6da72ced9a2d38fac2ea4ccc26f Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Mon, 16 Dec 2019 11:36:15 +0000 Subject: [PATCH 01/10] Make sure gallery ids are always numbers. --- packages/block-library/src/gallery/block.json | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/gallery/block.json b/packages/block-library/src/gallery/block.json index 342aafd4b2c49..0ad8471326399 100644 --- a/packages/block-library/src/gallery/block.json +++ b/packages/block-library/src/gallery/block.json @@ -1,7 +1,7 @@ { "name": "core/gallery", "category": "common", - "attributes": { + "attributes": { "images": { "type": "array", "default": [ ], @@ -43,6 +43,9 @@ }, "ids": { "type": "array", + "items": { + "type": "number" + }, "default": [ ] }, "columns": { From 1d3582f81b4b5c3f0ac1a39a9cd7cf55b0ca9d12 Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Mon, 16 Dec 2019 11:36:32 +0000 Subject: [PATCH 02/10] Implement deprecation path from post where ids can be strings. --- .../block-library/src/gallery/deprecated.js | 132 +++++++++++++++++- 1 file changed, 131 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/gallery/deprecated.js b/packages/block-library/src/gallery/deprecated.js index 74af7e3f50b6e..f74d7fe85025f 100644 --- a/packages/block-library/src/gallery/deprecated.js +++ b/packages/block-library/src/gallery/deprecated.js @@ -15,6 +15,136 @@ import { RichText } from '@wordpress/block-editor'; import { defaultColumnsNumber } from './shared'; const deprecated = [ + { + attributes: { + images: { + type: 'array', + default: [ ], + source: 'query', + selector: '.blocks-gallery-item', + query: { + url: { + source: 'attribute', + selector: 'img', + attribute: 'src' + }, + fullUrl: { + source: 'attribute', + selector: 'img', + attribute: 'data-full-url' + }, + link: { + source: 'attribute', + selector: 'img', + attribute: 'data-link' + }, + alt: { + source: 'attribute', + selector: 'img', + attribute: 'alt', + default: '' + }, + id: { + source: 'attribute', + selector: 'img', + attribute: 'data-id' + }, + caption: { + type: 'string', + source: 'html', + selector: '.blocks-gallery-item__caption' + } + } + }, + ids: { + type: 'array', + default: [ ] + }, + columns: { + 'type': 'number' + }, + caption: { + type: 'string', + source: 'html', + selector: '.blocks-gallery-caption' + }, + imageCrop: { + type: 'boolean', + default: true + }, + linkTo: { + type: 'string', + default: 'none' + } + }, + isEligible( { ids } ) { + return ids && + ids.length > 0 ; + }, + migrate( attributes ) { + return { + ...attributes, + ids: map( attributes.ids, ( id ) => { + if ( ! id ) { + return null; + } + if ( typeof( id ) === 'string' ) { + return parseInt( id, 10 ); + } + if ( typeof( id ) === 'number' ) { + return id; + } + + return null; + } ), + }; + }, + save( { attributes } ) { + const { images, columns = defaultColumnsNumber( attributes ), imageCrop, caption, linkTo } = attributes; + + return ( +
+
    + { images.map( ( image ) => { + let href; + + switch ( linkTo ) { + case 'media': + href = image.fullUrl || image.url; + break; + case 'attachment': + href = image.link; + break; + } + + const img = ( + { + ); + + return ( +
  • +
    + { href ? { img } : img } + { ! RichText.isEmpty( image.caption ) && ( + + ) } +
    +
  • + ); + } ) } +
+ { ! RichText.isEmpty( caption ) && } +
+ ); + } + }, { attributes: { images: { @@ -71,7 +201,7 @@ const deprecated = [ type: 'string', default: 'none', }, - }, + }, save( { attributes } ) { const { images, columns = defaultColumnsNumber( attributes ), imageCrop, linkTo } = attributes; return ( From 0ee66367aefcc6eeb427706e48c47bcb95341dd9 Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Mon, 16 Dec 2019 14:01:15 +0000 Subject: [PATCH 03/10] Improve is eligible method to apply only when strings are in the ids array. --- .../block-library/src/gallery/deprecated.js | 51 ++++++++++--------- 1 file changed, 27 insertions(+), 24 deletions(-) diff --git a/packages/block-library/src/gallery/deprecated.js b/packages/block-library/src/gallery/deprecated.js index f74d7fe85025f..718118c56f27d 100644 --- a/packages/block-library/src/gallery/deprecated.js +++ b/packages/block-library/src/gallery/deprecated.js @@ -26,60 +26,63 @@ const deprecated = [ url: { source: 'attribute', selector: 'img', - attribute: 'src' + attribute: 'src', }, fullUrl: { source: 'attribute', selector: 'img', - attribute: 'data-full-url' + attribute: 'data-full-url', }, link: { source: 'attribute', selector: 'img', - attribute: 'data-link' + attribute: 'data-link', }, alt: { source: 'attribute', selector: 'img', attribute: 'alt', - default: '' + default: '', }, id: { source: 'attribute', selector: 'img', - attribute: 'data-id' + attribute: 'data-id', }, caption: { type: 'string', source: 'html', - selector: '.blocks-gallery-item__caption' - } - } + selector: '.blocks-gallery-item__caption', + }, + }, }, ids: { - type: 'array', - default: [ ] + type: 'array', + default: [ ], }, columns: { - 'type': 'number' + type: 'number', }, caption: { type: 'string', source: 'html', - selector: '.blocks-gallery-caption' + selector: '.blocks-gallery-caption', }, imageCrop: { type: 'boolean', - default: true + default: true, }, linkTo: { type: 'string', - default: 'none' - } + default: 'none', + }, }, isEligible( { ids } ) { return ids && - ids.length > 0 ; + ids.length > 0 && + ids.reduce( ( state, id ) => { + return state || ( typeof id === 'string' ); + }, false ); }, migrate( attributes ) { return { @@ -88,10 +91,10 @@ const deprecated = [ if ( ! id ) { return null; } - if ( typeof( id ) === 'string' ) { + if ( typeof id === 'string' ) { return parseInt( id, 10 ); } - if ( typeof( id ) === 'number' ) { + if ( typeof id === 'number' ) { return id; } @@ -101,13 +104,13 @@ const deprecated = [ }, save( { attributes } ) { const { images, columns = defaultColumnsNumber( attributes ), imageCrop, caption, linkTo } = attributes; - + return (
    { images.map( ( image ) => { let href; - + switch ( linkTo ) { case 'media': href = image.fullUrl || image.url; @@ -116,7 +119,7 @@ const deprecated = [ href = image.link; break; } - + const img = ( ); - + return (
  • @@ -143,7 +146,7 @@ const deprecated = [ { ! RichText.isEmpty( caption ) && }
    ); - } + }, }, { attributes: { @@ -201,7 +204,7 @@ const deprecated = [ type: 'string', default: 'none', }, - }, + }, save( { attributes } ) { const { images, columns = defaultColumnsNumber( attributes ), imageCrop, linkTo } = attributes; return ( From 514bce7ad3c335cc64043f44ee39e02cb3a6520e Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Mon, 16 Dec 2019 14:33:35 +0000 Subject: [PATCH 04/10] Remove spaces on empty arrays. --- packages/block-library/src/gallery/deprecated.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/gallery/deprecated.js b/packages/block-library/src/gallery/deprecated.js index 718118c56f27d..ced1b517e3f43 100644 --- a/packages/block-library/src/gallery/deprecated.js +++ b/packages/block-library/src/gallery/deprecated.js @@ -19,7 +19,7 @@ const deprecated = [ attributes: { images: { type: 'array', - default: [ ], + default: [], source: 'query', selector: '.blocks-gallery-item', query: { @@ -58,7 +58,7 @@ const deprecated = [ }, ids: { type: 'array', - default: [ ], + default: [], }, columns: { type: 'number', From ab5f0d24af9311e6631432f20eefe81127ade85c Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Mon, 16 Dec 2019 16:44:56 +0000 Subject: [PATCH 05/10] Remove spaces on empty arrays. --- packages/block-library/src/gallery/block.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/gallery/block.json b/packages/block-library/src/gallery/block.json index 0ad8471326399..6ef5455cc98ed 100644 --- a/packages/block-library/src/gallery/block.json +++ b/packages/block-library/src/gallery/block.json @@ -4,7 +4,7 @@ "attributes": { "images": { "type": "array", - "default": [ ], + "default": [], "source": "query", "selector": ".blocks-gallery-item", "query": { @@ -46,7 +46,7 @@ "items": { "type": "number" }, - "default": [ ] + "default": [] }, "columns": { "type": "number" From 41e8c2557abbd6022fb8df0f641db2ae2b57c34d Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Wed, 18 Dec 2019 21:59:04 +0000 Subject: [PATCH 06/10] Fix indentation. --- packages/block-library/src/gallery/block.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/gallery/block.json b/packages/block-library/src/gallery/block.json index 6ef5455cc98ed..a8288339130dd 100644 --- a/packages/block-library/src/gallery/block.json +++ b/packages/block-library/src/gallery/block.json @@ -1,7 +1,7 @@ { "name": "core/gallery", "category": "common", - "attributes": { + "attributes": { "images": { "type": "array", "default": [], From 4587f69d4acc4578ceb2f92716d72fcee1edf80a Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Wed, 18 Dec 2019 22:18:56 +0000 Subject: [PATCH 07/10] Fix indent spaces. --- packages/block-library/src/gallery/block.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/gallery/block.json b/packages/block-library/src/gallery/block.json index a8288339130dd..415a5704ccc26 100644 --- a/packages/block-library/src/gallery/block.json +++ b/packages/block-library/src/gallery/block.json @@ -43,8 +43,8 @@ }, "ids": { "type": "array", - "items": { - "type": "number" + "items": { + "type": "number" }, "default": [] }, From b3a90fefa6d01890c4b8904936e872310dcb7038 Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Mon, 6 Jan 2020 21:39:22 +0000 Subject: [PATCH 08/10] Add deprecation test for gallery with string ids. --- .../blocks/core__gallery__deprecated-4.html | 21 ++++++++++ .../blocks/core__gallery__deprecated-4.json | 39 +++++++++++++++++++ .../core__gallery__deprecated-4.parsed.json | 17 ++++++++ ...ore__gallery__deprecated-4.serialized.html | 3 ++ 4 files changed, 80 insertions(+) create mode 100644 packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.html create mode 100644 packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.json create mode 100644 packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.parsed.json create mode 100644 packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.serialized.html diff --git a/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.html b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.html new file mode 100644 index 0000000000000..b9dd47cb63e5d --- /dev/null +++ b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.html @@ -0,0 +1,21 @@ + + + \ No newline at end of file diff --git a/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.json b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.json new file mode 100644 index 0000000000000..4270b4d419c2d --- /dev/null +++ b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.json @@ -0,0 +1,39 @@ +[ + { + "clientId": "_clientId_0", + "name": "core/gallery", + "isValid": true, + "attributes": { + "images": [ + { + "url": "https://sergioestevaofolio.files.wordpress.com/2016/09/cropped-img_9054-1.jpg?w=190", + "alt": "", + "id": "1421", + "caption": "" + }, + { + "url": "https://sergioestevaofolio.files.wordpress.com/2017/09/cropped-l1001498-1.jpg?w=580", + "alt": "", + "id": "1440", + "caption": "" + }, + { + "url": "https://sergioestevaofolio.files.wordpress.com/2017/05/cropped-l1005945-2-2.jpg?w=580", + "alt": "", + "id": "1362", + "caption": "" + } + ], + "ids": [ + 1421, + 1440, + 1362 + ], + "caption": "", + "imageCrop": true, + "linkTo": "none" + }, + "innerBlocks": [], + "originalContent": "" + } +] diff --git a/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.parsed.json b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.parsed.json new file mode 100644 index 0000000000000..abed1ba09ec5a --- /dev/null +++ b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.parsed.json @@ -0,0 +1,17 @@ +[ + { + "blockName": "core/gallery", + "attrs": { + "ids": [ + "1421", + "1440", + "1362" + ] + }, + "innerBlocks": [], + "innerHTML": "\n\n", + "innerContent": [ + "\n\n" + ] + } +] diff --git a/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.serialized.html b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.serialized.html new file mode 100644 index 0000000000000..b97fe94748b24 --- /dev/null +++ b/packages/e2e-tests/fixtures/blocks/core__gallery__deprecated-4.serialized.html @@ -0,0 +1,3 @@ + + + From b0211d7354968ddcb822910457151f56a3135e7e Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Mon, 6 Jan 2020 21:45:22 +0000 Subject: [PATCH 09/10] Use some instead of reduce. --- packages/block-library/src/gallery/deprecated.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/packages/block-library/src/gallery/deprecated.js b/packages/block-library/src/gallery/deprecated.js index ced1b517e3f43..f60e583ae11d6 100644 --- a/packages/block-library/src/gallery/deprecated.js +++ b/packages/block-library/src/gallery/deprecated.js @@ -78,11 +78,7 @@ const deprecated = [ }, }, isEligible( { ids } ) { - return ids && - ids.length > 0 && - ids.reduce( ( state, id ) => { - return state || ( typeof id === 'string' ); - }, false ); + return ids && ids.some( ( id ) => typeof id === 'string' ); }, migrate( attributes ) { return { From b40dca113bbf205dc6409a3b6679d8dd38e5699e Mon Sep 17 00:00:00 2001 From: Sergio Estevao Date: Tue, 7 Jan 2020 10:20:50 +0000 Subject: [PATCH 10/10] Simplify the code for parsing id. --- packages/block-library/src/gallery/deprecated.js | 13 ++----------- 1 file changed, 2 insertions(+), 11 deletions(-) diff --git a/packages/block-library/src/gallery/deprecated.js b/packages/block-library/src/gallery/deprecated.js index f60e583ae11d6..7b56cf931f5bd 100644 --- a/packages/block-library/src/gallery/deprecated.js +++ b/packages/block-library/src/gallery/deprecated.js @@ -84,17 +84,8 @@ const deprecated = [ return { ...attributes, ids: map( attributes.ids, ( id ) => { - if ( ! id ) { - return null; - } - if ( typeof id === 'string' ) { - return parseInt( id, 10 ); - } - if ( typeof id === 'number' ) { - return id; - } - - return null; + const parsedId = parseInt( id, 10 ); + return Number.isInteger( parsedId ) ? parsedId : null; } ), }; },