diff --git a/packages/block-library/src/post-title/edit.js b/packages/block-library/src/post-title/edit.js index 46030a4ed4cec3..e7c5b39f8cfaeb 100644 --- a/packages/block-library/src/post-title/edit.js +++ b/packages/block-library/src/post-title/edit.js @@ -6,12 +6,13 @@ import classnames from 'classnames'; /** * WordPress dependencies */ -import { useSelect } from '@wordpress/data'; +import { useSelect, useDispatch } from '@wordpress/data'; import { AlignmentToolbar, BlockControls, InspectorControls, useBlockProps, + PlainText, } from '@wordpress/block-editor'; import { ToolbarGroup, @@ -42,6 +43,7 @@ export default function PostTitleEdit( { ), [ postType, postId ] ); + const { editEntityRecord } = useDispatch( 'core' ); const blockProps = useBlockProps( { className: classnames( { @@ -53,11 +55,33 @@ export default function PostTitleEdit( { return null; } - let title = post.title || __( 'Post Title' ); + const { title, link } = post; + + let titleElement = ( + + editEntityRecord( 'postType', postType, postId, { + title: value, + } ) + } + __experimentalVersion={ 2 } + { ...( isLink ? {} : blockProps ) } + /> + ); + if ( isLink ) { - title = ( - <a href={ post.link } target={ linkTarget } rel={ rel }> - { title } + titleElement = ( + <a + href={ link } + target={ linkTarget } + rel={ rel } + onClick={ ( event ) => event.preventDefault() } + { ...blockProps } + > + { titleElement } </a> ); } @@ -109,7 +133,7 @@ export default function PostTitleEdit( { ) } </PanelBody> </InspectorControls> - <TagName { ...blockProps }>{ title }</TagName> + { titleElement } </> ); } diff --git a/packages/e2e-tests/specs/experiments/blocks/post-title.test.js b/packages/e2e-tests/specs/experiments/blocks/post-title.test.js new file mode 100644 index 00000000000000..5e307541ff9cde --- /dev/null +++ b/packages/e2e-tests/specs/experiments/blocks/post-title.test.js @@ -0,0 +1,44 @@ +/** + * WordPress dependencies + */ +import { + activateTheme, + createNewPost, + insertBlock, + pressKeyWithModifier, + saveDraft, +} from '@wordpress/e2e-test-utils'; + +describe( 'Post Title block', () => { + beforeAll( async () => { + await activateTheme( 'twentytwentyone-blocks' ); + } ); + + afterAll( async () => { + await activateTheme( 'twentytwentyone' ); + } ); + + beforeEach( async () => { + await createNewPost(); + } ); + + it( 'Can edit the post title', async () => { + // Create a block with some text that will trigger a list creation. + await insertBlock( 'Post Title' ); + + // Select all of the text in the post title block. + await pressKeyWithModifier( 'primary', 'a' ); + + // Create a second list item. + await page.keyboard.type( 'Just tweaking the post title' ); + + await saveDraft(); + await page.reload(); + await page.waitForSelector( '.edit-post-layout' ); + const title = await page.$eval( + '.editor-post-title__input', + ( element ) => element.value + ); + expect( title ).toEqual( 'Just tweaking the post title' ); + } ); +} ); diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js index 4caf304b891b10..db7cf89b71ad36 100644 --- a/packages/edit-site/src/components/editor/index.js +++ b/packages/edit-site/src/components/editor/index.js @@ -140,22 +140,15 @@ function Editor() { const { __experimentalGetTemplateInfo: getTemplateInfo, } = select( 'core/editor' ); - entitiesToSave.forEach( ( { kind, name, key } ) => { + entitiesToSave.forEach( ( { kind, name, key, title } ) => { const record = getEditedEntityRecord( kind, name, key ); - - if ( 'postType' === kind && name === 'wp_template' ) { - const { title } = getTemplateInfo( record ); - return editEntityRecord( kind, name, key, { - status: 'publish', - title, - } ); + if ( kind === 'postType' && name === 'wp_template' ) { + ( { title } = getTemplateInfo( record ) ); } - - const edits = record.slug - ? { status: 'publish', title: record.slug } - : { status: 'publish' }; - - editEntityRecord( kind, name, key, edits ); + editEntityRecord( kind, name, key, { + status: 'publish', + title: title || record.slug, + } ); } ); } setIsEntitiesSavedStatesOpen( false );