From fa5ad4cd5d3d37fe573b9f6d440219439e03a19e Mon Sep 17 00:00:00 2001 From: Carlos Garcia Date: Mon, 6 Mar 2023 12:59:44 +0100 Subject: [PATCH 1/4] Allow wildcard block transformations of container blocks --- packages/blocks/src/api/factory.js | 8 -------- 1 file changed, 8 deletions(-) diff --git a/packages/blocks/src/api/factory.js b/packages/blocks/src/api/factory.js index fed5071e47bd2e..6df8eb00005a8e 100644 --- a/packages/blocks/src/api/factory.js +++ b/packages/blocks/src/api/factory.js @@ -211,14 +211,6 @@ const isPossibleTransformForSource = ( transform, direction, blocks ) => { return false; } - if ( - transform.usingMobileTransformations && - isWildcardBlockTransform( transform ) && - ! isContainerGroupBlock( sourceBlock.name ) - ) { - return false; - } - return true; }; From 711b9676703141e3e2022103c8d5cf423f5f6d13 Mon Sep 17 00:00:00 2001 From: Carlos Garcia Date: Mon, 6 Mar 2023 13:00:43 +0100 Subject: [PATCH 2/4] Add open block actions menu test helper --- .../native/integration-test-helpers/README.md | 4 ++++ test/native/integration-test-helpers/index.js | 1 + .../open-block-actions-menu.js | 20 +++++++++++++++++++ 3 files changed, 25 insertions(+) create mode 100644 test/native/integration-test-helpers/open-block-actions-menu.js diff --git a/test/native/integration-test-helpers/README.md b/test/native/integration-test-helpers/README.md index 1818d8845624be..950532d429feff 100644 --- a/test/native/integration-test-helpers/README.md +++ b/test/native/integration-test-helpers/README.md @@ -30,6 +30,10 @@ Gets an inner block from another block. Initialize an editor for test assertions. +### [`openBlockActionsMenu`](https://github.com/WordPress/gutenberg/blob/HEAD/test/native/integration-test-helpers/open-block-actions-menu.js) + +Opens the block's actions menu of the current selected block. + ### [`openBlockSettings`](https://github.com/WordPress/gutenberg/blob/HEAD/test/native/integration-test-helpers/open-block-settings.js) Opens the block settings of the current selected block. diff --git a/test/native/integration-test-helpers/index.js b/test/native/integration-test-helpers/index.js index 9287634e63faed..5f8a3b6c84a3ad 100644 --- a/test/native/integration-test-helpers/index.js +++ b/test/native/integration-test-helpers/index.js @@ -8,6 +8,7 @@ export { getBlock } from './get-block'; export { getEditorHtml } from './get-editor-html'; export { getInnerBlock } from './get-inner-block'; export { initializeEditor } from './initialize-editor'; +export { openBlockActionsMenu } from './open-block-actions-menu'; export { openBlockSettings } from './open-block-settings'; export { changeAndSelectTextOfRichText } from './rich-text-change-and-select-text'; export { changeTextOfRichText } from './rich-text-change-text'; diff --git a/test/native/integration-test-helpers/open-block-actions-menu.js b/test/native/integration-test-helpers/open-block-actions-menu.js new file mode 100644 index 00000000000000..b2634c57d3dd42 --- /dev/null +++ b/test/native/integration-test-helpers/open-block-actions-menu.js @@ -0,0 +1,20 @@ +/** + * External dependencies + */ +import { fireEvent } from '@testing-library/react-native'; + +/** + * Internal dependencies + */ +import { waitForModalVisible } from './wait-for-modal-visible'; + +/** + * Opens the block's actions menu of the current selected block. + * + * @param {import('@testing-library/react-native').RenderAPI} screen The Testing Library screen. + */ +export const openBlockActionsMenu = async ( screen ) => { + const { getByLabelText, getByTestId } = screen; + fireEvent.press( getByLabelText( 'Open Block Actions Menu' ) ); + return waitForModalVisible( getByTestId( 'block-actions-menu' ) ); +}; From 020ee099844fa44abb3f84faa1cd1ab7a1217005 Mon Sep 17 00:00:00 2001 From: Carlos Garcia Date: Mon, 6 Mar 2023 13:19:00 +0100 Subject: [PATCH 3/4] Allow trigger block list layout by index --- .../trigger-block-list-layout.js | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/test/native/integration-test-helpers/trigger-block-list-layout.js b/test/native/integration-test-helpers/trigger-block-list-layout.js index bc0ca432065bff..5ccea7722cbf08 100644 --- a/test/native/integration-test-helpers/trigger-block-list-layout.js +++ b/test/native/integration-test-helpers/trigger-block-list-layout.js @@ -15,14 +15,20 @@ import { waitForStoreResolvers } from './wait-for-store-resolvers'; * case any of the inner elements use selectors that are associated with store * resolvers. * - * @param {import('react-test-renderer').ReactTestInstance} block Block test instance to trigger layout event. - * @param {Object} [options] Configuration options for the event. - * @param {number} [options.width] Width value to be passed to the event. + * @param {import('react-test-renderer').ReactTestInstance} block Block test instance to trigger layout event. + * @param {Object} [options] Configuration options for the event. + * @param {number} [options.width] Width value to be passed to the event. + * @param {number} [options.blockListIndex] Block list index, for cases when there is more than one, like in inner blocks. */ -export const triggerBlockListLayout = async ( block, { width = 320 } = {} ) => +export const triggerBlockListLayout = async ( + block, + { width = 320, blockListIndex = 0 } = {} +) => waitForStoreResolvers( () => fireEvent( - within( block ).getByTestId( 'block-list-wrapper' ), + within( block ).getAllByTestId( 'block-list-wrapper' )[ + blockListIndex + ], 'layout', { nativeEvent: { From e6c3fe3c596fba9a547777190721da4c51f81047 Mon Sep 17 00:00:00 2001 From: Carlos Garcia Date: Mon, 6 Mar 2023 13:19:37 +0100 Subject: [PATCH 4/4] Add Paragraph block transform tests --- .../__snapshots__/transforms.native.js.snap | 59 +++++++++++++++++++ .../src/paragraph/test/transforms.native.js | 53 +++++++++++++++++ 2 files changed, 112 insertions(+) create mode 100644 packages/block-library/src/paragraph/test/__snapshots__/transforms.native.js.snap create mode 100644 packages/block-library/src/paragraph/test/transforms.native.js diff --git a/packages/block-library/src/paragraph/test/__snapshots__/transforms.native.js.snap b/packages/block-library/src/paragraph/test/__snapshots__/transforms.native.js.snap new file mode 100644 index 00000000000000..22e05ce5435c98 --- /dev/null +++ b/packages/block-library/src/paragraph/test/__snapshots__/transforms.native.js.snap @@ -0,0 +1,59 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Paragraph block transforms to Columns block 1`] = ` +" +
+
+

Example text

+
+
+" +`; + +exports[`Paragraph block transforms to Group block 1`] = ` +" +
+

Example text

+
+" +`; + +exports[`Paragraph block transforms to Heading block 1`] = ` +" +

Example text

+" +`; + +exports[`Paragraph block transforms to List block 1`] = ` +" +
    +
  • Example text
    • +
+" +`; + +exports[`Paragraph block transforms to Preformatted block 1`] = ` +" +
Example text
+" +`; + +exports[`Paragraph block transforms to Pullquote block 1`] = ` +" +

Example text

+" +`; + +exports[`Paragraph block transforms to Quote block 1`] = ` +" +
+

Example text

+
+" +`; + +exports[`Paragraph block transforms to Verse block 1`] = ` +" +
Example text
+" +`; diff --git a/packages/block-library/src/paragraph/test/transforms.native.js b/packages/block-library/src/paragraph/test/transforms.native.js new file mode 100644 index 00000000000000..76271fa757c6aa --- /dev/null +++ b/packages/block-library/src/paragraph/test/transforms.native.js @@ -0,0 +1,53 @@ +/** + * External dependencies + */ +import { + fireEvent, + getBlock, + getEditorHtml, + initializeEditor, + openBlockActionsMenu, + setupCoreBlocks, + triggerBlockListLayout, +} from 'test/helpers'; + +const block = 'Paragraph'; +const initialHtml = ` + +

Example text

+`; + +// NOTE: Paragraph block can be transformed to Buttons block in web, +// however this transform is not supported in the native version. +const transformsWithInnerBlocks = [ 'List', 'Quote', 'Columns', 'Group' ]; +const blockTransforms = [ + 'Heading', + 'Preformatted', + 'Pullquote', + 'Verse', + ...transformsWithInnerBlocks, +]; + +setupCoreBlocks(); + +describe( `${ block } block transforms`, () => { + test.each( blockTransforms )( + 'to %s block', + async ( blockTransformation ) => { + const screen = await initializeEditor( { initialHtml } ); + const { getByText } = screen; + fireEvent.press( getBlock( screen, block ) ); + + await openBlockActionsMenu( screen ); + fireEvent.press( getByText( 'Transform block…' ) ); + fireEvent.press( getByText( blockTransformation ) ); + + const newBlock = getBlock( screen, blockTransformation ); + if ( transformsWithInnerBlocks.includes( blockTransformation ) ) + await triggerBlockListLayout( newBlock ); + + expect( newBlock ).toBeVisible(); + expect( getEditorHtml() ).toMatchSnapshot(); + } + ); +} );