diff --git a/packages/block-library/src/quote/edit.js b/packages/block-library/src/quote/edit.js index 9210230f2ba02..32793f60692a6 100644 --- a/packages/block-library/src/quote/edit.js +++ b/packages/block-library/src/quote/edit.js @@ -9,6 +9,7 @@ import classnames from 'classnames'; import { __ } from '@wordpress/i18n'; import { AlignmentToolbar, BlockControls, RichText } from '@wordpress/block-editor'; import { BlockQuotation } from '@wordpress/components'; +import { createBlock } from '@wordpress/blocks'; export default function QuoteEdit( { attributes, setAttributes, isSelected, mergeBlocks, onReplace, className } ) { const { align, value, citation } = attributes; @@ -48,6 +49,16 @@ export default function QuoteEdit( { attributes, setAttributes, isSelected, merg // translators: placeholder text used for the quote __( 'Write quote…' ) } + onReplace={ onReplace } + onSplit={ ( piece ) => + createBlock( 'core/quote', { + ...attributes, + value: piece, + } ) + } + __unstableOnSplitMiddle={ () => + createBlock( 'core/paragraph' ) + } /> { ( ! RichText.isEmpty( citation ) || isSelected ) && (

' ) { return { ...attributes, - citation: attributes.citation + citation, + citation, }; } return { ...attributes, value: attributes.value + value, - citation: attributes.citation + citation, + citation, }; }, deprecated, diff --git a/packages/e2e-tests/specs/blocks/__snapshots__/quote.test.js.snap b/packages/e2e-tests/specs/blocks/__snapshots__/quote.test.js.snap index 57d1d187978f4..57fcc6c61dbdd 100644 --- a/packages/e2e-tests/specs/blocks/__snapshots__/quote.test.js.snap +++ b/packages/e2e-tests/specs/blocks/__snapshots__/quote.test.js.snap @@ -80,6 +80,68 @@ exports[`Quote can be merged into from a paragraph 1`] = ` " `; +exports[`Quote can be split at the end and merged back 1`] = ` +" +

1

+ + + +

+" +`; + +exports[`Quote can be split at the end and merged back 2`] = ` +" +

1

+" +`; + +exports[`Quote can be split at the end and merged back 3`] = ` +" +

1

+" +`; + +exports[`Quote can be split in the middle and merged back 1`] = ` +" +

1

c
+ + + +

+ + + +

2

c
+" +`; + +exports[`Quote can be split in the middle and merged back 2`] = ` +" +

1

c
+ + + +

2

c
+" +`; + +exports[`Quote can be split in the middle and merged back 3`] = ` +" +

1

c
+ + + +

2

c
+" +`; + +exports[`Quote can be split in the middle and merged back 4`] = ` +" +

1

2

c
+" +`; + exports[`Quote is transformed to a heading and a quote if the quote contains a citation 1`] = ` "

one

diff --git a/packages/e2e-tests/specs/blocks/quote.test.js b/packages/e2e-tests/specs/blocks/quote.test.js index 7a612e2419809..38f5348e98990 100644 --- a/packages/e2e-tests/specs/blocks/quote.test.js +++ b/packages/e2e-tests/specs/blocks/quote.test.js @@ -185,4 +185,57 @@ describe( 'Quote', () => { await page.keyboard.press( 'Backspace' ); expect( await getEditedPostContent() ).toMatchSnapshot(); } ); + + it( 'can be split at the end and merged back', async () => { + await insertBlock( 'Quote' ); + await page.keyboard.type( '1' ); + await page.keyboard.press( 'Enter' ); + await page.keyboard.press( 'Enter' ); + + // Expect empty paragraph outside quote block. + expect( await getEditedPostContent() ).toMatchSnapshot(); + + await page.keyboard.press( 'Backspace' ); + + // Expect empty paragraph inside quote block. + expect( await getEditedPostContent() ).toMatchSnapshot(); + + await page.keyboard.press( 'Backspace' ); + + // Expect quote without empty paragraphs. + expect( await getEditedPostContent() ).toMatchSnapshot(); + } ); + + it( 'can be split in the middle and merged back', async () => { + await insertBlock( 'Quote' ); + await page.keyboard.type( '1' ); + await page.keyboard.press( 'Enter' ); + await page.keyboard.type( '2' ); + await page.keyboard.press( 'Tab' ); + await page.keyboard.type( 'c' ); + await page.keyboard.press( 'ArrowUp' ); + await page.keyboard.press( 'ArrowUp' ); + await page.keyboard.press( 'Enter' ); + await page.keyboard.press( 'Enter' ); + + // Expect two quote blocks and empty paragraph in the middle. + expect( await getEditedPostContent() ).toMatchSnapshot(); + + await page.keyboard.press( 'Backspace' ); + + // Expect two quote blocks and empty paragraph in the first quote. + expect( await getEditedPostContent() ).toMatchSnapshot(); + + await page.keyboard.press( 'Backspace' ); + + // Expect two quote blocks. + expect( await getEditedPostContent() ).toMatchSnapshot(); + + await page.keyboard.press( 'ArrowLeft' ); + await page.keyboard.press( 'ArrowDown' ); + await page.keyboard.press( 'ArrowDown' ); + await page.keyboard.press( 'Backspace' ); + + expect( await getEditedPostContent() ).toMatchSnapshot(); + } ); } );