Fix: Crash when creating a hierarchical post without title (#19936)

packages/e2e-tests/plugins/custom-post-types.php

@@ -66,3 +66,23 @@ function public_queryable_true_public_true_cpt() {
 	);
 }
 add_action( 'init', 'public_queryable_true_public_true_cpt' );
+
+/**
+ * Registers a custom post type that is hierarchical and does not supports the title attribute.
+ */
+function hierarchical_without_title_cpt() {
+	register_post_type(
+		'hierar-no-title',
+		array(
+			'public'       => true,
+			'label'        => 'Hierarchical No Title',
+			'show_in_rest' => true,
+			'hierarchical' => true,
+			'supports'     => array( 'page-attributes', 'editor', 'thumbnail', 'comments', 'post-formats' ),
+			'show_ui'      => true,
+			'show_in_menu' => true,
+		)
+	);
+}
+add_action( 'init', 'hierarchical_without_title_cpt' );
+

packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js

@@ -0,0 +1,56 @@
+/**
+ * WordPress dependencies
+ */
+import {
+	activatePlugin,
+	createNewPost,
+	deactivatePlugin,
+	publishPost,
+	findSidebarPanelWithTitle,
+} from '@wordpress/e2e-test-utils';
+
+const openPageAttributesPanel = async () => {
+	const openButton = await findSidebarPanelWithTitle( 'Page Attributes' );
+
+	// Get the classes from the panel
+	const buttonClassName = await ( await openButton.getProperty( 'className' ) ).jsonValue();
+
+	// Open the panel if needed.
+	if ( -1 === buttonClassName.indexOf( 'is-opened' ) ) {
+		await openButton.click();
+	}
+};
+const SELECT_OPTION_SELECTOR = '.editor-page-attributes__parent option:nth-child(2)';
+
+describe( 'Test Custom Post Types', () => {
+	beforeAll( async () => {
+		await activatePlugin( 'gutenberg-test-custom-post-types' );
+	} );
+
+	afterAll( async () => {
+		await deactivatePlugin( 'gutenberg-test-custom-post-types' );
+	} );
+
+	it( 'It should be able to create an hierarchical post without title support', async () => {
+		// Create a parent post.
+		await createNewPost( { postType: 'hierar-no-title' } );
+		await page.click( '.block-editor-writing-flow' );
+		await page.keyboard.type( 'Parent Post' );
+		await publishPost();
+		// Create a post that is a child of the previously created post.
+		await createNewPost( { postType: 'hierar-no-title' } );
+		await openPageAttributesPanel();
+		await page.waitForSelector( SELECT_OPTION_SELECTOR );
+		const optionToSelect = await page.$( SELECT_OPTION_SELECTOR );
+		const valueToSelect = await ( await optionToSelect.getProperty( 'value' ) ).jsonValue();
+		await page.select( '.editor-page-attributes__parent select', valueToSelect );
+		await page.click( '.block-editor-writing-flow' );
+		await page.keyboard.type( 'Child Post' );
+		await publishPost();
+		// Reload the child post and verify it is still correctly selected as a child post.
+		await page.reload();
+		await page.waitForSelector( SELECT_OPTION_SELECTOR );
+		const selectedValue = await page.$eval( '.editor-page-attributes__parent select', ( el ) => el.value );
+		expect( selectedValue ).toEqual( valueToSelect );
+	} );
+} );

packages/editor/src/components/page-attributes/parent.js

@@ -27,7 +27,7 @@ export function PageAttributesParent( { parent, postType, items, onUpdateParent
 	const pagesTree = buildTermsTree( pageItems.map( ( item ) => ( {
 		id: item.id,
 		parent: item.parent,
-		name: item.title.raw ? item.title.raw : `#${ item.id } (${ __( 'no title' ) })`,
+		name: ( item.title && item.title.raw ) ? item.title.raw : `#${ item.id } (${ __( 'no title' ) })`,
 	} ) ) );
 	return (
 		<TreeSelect