Fix incorrect aria description in List View (#24533)

* Fix incorrect siblingCount value * Remove outdated comment
WordPress · Aug 13, 2020 · 5d38f90 · 5d38f90
1 parent 6604d96
commit 5d38f90
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 14 deletions.
diff --git a/packages/block-editor/src/components/block-navigation/block-contents.js b/packages/block-editor/src/components/block-navigation/block-contents.js
@@ -12,7 +12,15 @@ import BlockNavigationBlockSelectButton from './block-select-button';
 
 const BlockNavigationBlockContents = forwardRef(
 	(
-		{ onClick, block, isSelected, position, siblingCount, level, ...props },
+		{
+			onClick,
+			block,
+			isSelected,
+			position,
+			siblingBlockCount,
+			level,
+			...props
+		},
 		ref
 	) => {
 		const {
@@ -27,7 +35,7 @@ const BlockNavigationBlockContents = forwardRef(
 				onClick={ onClick }
 				isSelected={ isSelected }
 				position={ position }
-				siblingCount={ siblingCount }
+				siblingBlockCount={ siblingBlockCount }
 				level={ level }
 				{ ...props }
 			/>
@@ -39,7 +47,7 @@ const BlockNavigationBlockContents = forwardRef(
 				onClick={ onClick }
 				isSelected={ isSelected }
 				position={ position }
-				siblingCount={ siblingCount }
+				siblingBlockCount={ siblingBlockCount }
 				level={ level }
 				{ ...props }
 			/>

diff --git a/packages/block-editor/src/components/block-navigation/block-select-button.js b/packages/block-editor/src/components/block-navigation/block-select-button.js
@@ -28,7 +28,7 @@ function BlockNavigationBlockSelectButton(
 		isSelected,
 		onClick,
 		position,
-		siblingCount,
+		siblingBlockCount,
 		level,
 		tabIndex,
 		onFocus,
@@ -43,7 +43,7 @@ function BlockNavigationBlockSelectButton(
 	const descriptionId = `block-navigation-block-select-button__${ instanceId }`;
 	const blockPositionDescription = getBlockPositionDescription(
 		position,
-		siblingCount,
+		siblingBlockCount,
 		level
 	);
 

diff --git a/packages/block-editor/src/components/block-navigation/block-slot.js b/packages/block-editor/src/components/block-navigation/block-slot.js
@@ -48,7 +48,7 @@ function BlockNavigationBlockSlot( props, ref ) {
 					block,
 					isSelected,
 					position,
-					siblingCount,
+					siblingBlockCount,
 					level,
 					tabIndex,
 					onFocus,
@@ -59,7 +59,7 @@ function BlockNavigationBlockSlot( props, ref ) {
 				const descriptionId = `block-navigation-block-slot__${ instanceId }`;
 				const blockPositionDescription = getBlockPositionDescription(
 					position,
-					siblingCount,
+					siblingBlockCount,
 					level
 				);
 

diff --git a/packages/block-editor/src/components/block-navigation/block.js b/packages/block-editor/src/components/block-navigation/block.js
@@ -37,6 +37,7 @@ export default function BlockNavigationBlock( {
 	position,
 	level,
 	rowCount,
+	siblingBlockCount,
 	showBlockMovers,
 	terminatedLevels,
 	path,
@@ -49,9 +50,7 @@ export default function BlockNavigationBlock( {
 	);
 	const { clientId } = block;
 
-	// Subtract 1 from rowCount, as it includes the block appender.
-	const siblingCount = rowCount - 1;
-	const hasSiblings = siblingCount > 0;
+	const hasSiblings = siblingBlockCount > 0;
 	const hasRenderedMovers = showBlockMovers && hasSiblings;
 	const hasVisibleMovers = isHovered || isFocused;
 	const moverCellClassName = classnames(
@@ -102,7 +101,7 @@ export default function BlockNavigationBlock( {
 							onClick={ () => onClick( block.clientId ) }
 							isSelected={ isSelected }
 							position={ position }
-							siblingCount={ siblingCount }
+							siblingBlockCount={ siblingBlockCount }
 							level={ level }
 							ref={ ref }
 							tabIndex={ tabIndex }

diff --git a/packages/block-editor/src/components/block-navigation/branch.js b/packages/block-editor/src/components/block-navigation/branch.js
@@ -36,9 +36,8 @@ export default function BlockNavigationBranch( props ) {
 		selectedBlockClientId === parentClientId;
 	const hasAppender = itemHasAppender( parentBlockClientId );
 	// Add +1 to the rowCount to take the block appender into account.
-	const rowCount = hasAppender
-		? filteredBlocks.length + 1
-		: filteredBlocks.length;
+	const blockCount = filteredBlocks.length;
+	const rowCount = hasAppender ? blockCount + 1 : blockCount;
 	const appenderPosition = rowCount;
 
 	return (
@@ -64,6 +63,7 @@ export default function BlockNavigationBranch( props ) {
 							level={ level }
 							position={ position }
 							rowCount={ rowCount }
+							siblingBlockCount={ blockCount }
 							showBlockMovers={ showBlockMovers }
 							terminatedLevels={ terminatedLevels }
 							path={ updatedPath }