From e2b825727cc6da9592d1616ef6863b38e213ab54 Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Thu, 29 Jun 2023 16:27:40 +0300
Subject: [PATCH 1/8] update the icons for expanding and collapsing the fixed
 block toolbar

---
 .../block-tools/block-contextual-toolbar.js   | 13 +++----------
 .../src/components/block-tools/style.scss     | 19 ++++++++++++-------
 2 files changed, 15 insertions(+), 17 deletions(-)

diff --git a/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js b/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js
index 743a07b4bb8818..a406a4d50b289f 100644
--- a/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js
+++ b/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js
@@ -15,7 +15,7 @@ import {
 	ToolbarButton,
 	ToolbarGroup,
 } from '@wordpress/components';
-import { levelUp } from '@wordpress/icons';
+import { next, previous } from '@wordpress/icons';
 import { useViewportMatch } from '@wordpress/compose';
 
 /**
@@ -24,7 +24,6 @@ import { useViewportMatch } from '@wordpress/compose';
 import NavigableToolbar from '../navigable-toolbar';
 import BlockToolbar from '../block-toolbar';
 import { store as blockEditorStore } from '../../store';
-import BlockIcon from '../block-icon';
 import { unlock } from '../../lock-unlock';
 
 function BlockContextualToolbar( { focusOnMount, isFixed, ...props } ) {
@@ -94,6 +93,7 @@ function BlockContextualToolbar( { focusOnMount, isFixed, ...props } ) {
 			aria-label={ __( 'Block tools' ) }
 			{ ...props }
 		>
+			{ ! isCollapsed && <BlockToolbar hideDragHandle={ isFixed } /> }
 			{ isFixed && isLargeViewport && blockType && (
 				<ToolbarGroup
 					className={
@@ -105,13 +105,7 @@ function BlockContextualToolbar( { focusOnMount, isFixed, ...props } ) {
 					<ToolbarItem
 						as={ ToolbarButton }
 						ref={ toolbarButtonRef }
-						icon={
-							isCollapsed ? (
-								<BlockIcon icon={ blockType.icon } />
-							) : (
-								levelUp
-							)
-						}
+						icon={ isCollapsed ? next : previous }
 						onClick={ () => {
 							setIsCollapsed( ( collapsed ) => ! collapsed );
 							toolbarButtonRef.current.focus();
@@ -124,7 +118,6 @@ function BlockContextualToolbar( { focusOnMount, isFixed, ...props } ) {
 					/>
 				</ToolbarGroup>
 			) }
-			{ ! isCollapsed && <BlockToolbar hideDragHandle={ isFixed } /> }
 		</NavigableToolbar>
 	);
 }
diff --git a/packages/block-editor/src/components/block-tools/style.scss b/packages/block-editor/src/components/block-tools/style.scss
index c55b8e651c2e7e..fbd303133f9c3e 100644
--- a/packages/block-editor/src/components/block-tools/style.scss
+++ b/packages/block-editor/src/components/block-tools/style.scss
@@ -158,19 +158,24 @@
 				}
 			}
 
+			& > .block-editor-block-toolbar.is-showing-movers {
+				flex-grow: initial;
+				width: initial;
+			}
+
 			& > .block-editor-block-toolbar__group-collapse-fixed-toolbar {
 				border: none;
 
 				// Add a border as separator in the block toolbar.
-				&::after {
+				&::before {
 					content: "";
 					width: $border-width;
-					height: 24px;
+					height: 26px;
 					margin-top: $grid-unit + $grid-unit-05;
-					margin-bottom: $grid-unit + $grid-unit-05;
+					margin-right: $grid-unit-10;
 					background-color: $gray-300;
-					position: absolute;
-					left: 44px;
+					position: relative;
+					left: 0;
 					top: -1px;
 				}
 			}
@@ -186,8 +191,8 @@
 					margin-bottom: $grid-unit + $grid-unit-05;
 					background-color: $gray-300;
 					position: relative;
-					left: -12px; //the padding of buttons
-					height: 24px;
+					left: -10px; //the padding of buttons
+					height: 26px;
 				}
 			}
 

From c2bb12be6e72e87f880ce415093f1e140b210aea Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Thu, 29 Jun 2023 18:56:01 +0300
Subject: [PATCH 2/8] hide the tools selector item in document tools for fixed
 toolbar preference

---
 .../components/header/header-toolbar/index.js |  5 +++-
 .../src/components/header-edit-mode/index.js  | 23 ++++++++++++-------
 2 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/packages/edit-post/src/components/header/header-toolbar/index.js b/packages/edit-post/src/components/header/header-toolbar/index.js
index 391e5473999bb7..8f9e413707d503 100644
--- a/packages/edit-post/src/components/header/header-toolbar/index.js
+++ b/packages/edit-post/src/components/header/header-toolbar/index.js
@@ -19,6 +19,7 @@ import { Button, ToolbarItem } from '@wordpress/components';
 import { listView, plus } from '@wordpress/icons';
 import { useRef, useCallback } from '@wordpress/element';
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
+import { store as preferencesStore } from '@wordpress/preferences';
 
 /**
  * Internal dependencies
@@ -36,6 +37,8 @@ function HeaderToolbar() {
 	const inserterButton = useRef();
 	const { setIsInserterOpened, setIsListViewOpened } =
 		useDispatch( editPostStore );
+	const { get: getPreference } = useSelect( preferencesStore );
+	const hasFixedToolbar = getPreference( 'core/edit-post', 'fixedToolbar' );
 	const {
 		isInserterEnabled,
 		isInserterOpened,
@@ -147,7 +150,7 @@ function HeaderToolbar() {
 				/>
 				{ ( isWideViewport || ! showIconLabels ) && (
 					<>
-						{ isLargeViewport && (
+						{ isLargeViewport && ! hasFixedToolbar && (
 							<ToolbarItem
 								as={ ToolSelector }
 								showTooltip={ ! showIconLabels }
diff --git a/packages/edit-site/src/components/header-edit-mode/index.js b/packages/edit-site/src/components/header-edit-mode/index.js
index 415dfb1d67cb01..b02483a01569e5 100644
--- a/packages/edit-site/src/components/header-edit-mode/index.js
+++ b/packages/edit-site/src/components/header-edit-mode/index.js
@@ -108,6 +108,9 @@ export default function HeaderEditMode() {
 		};
 	}, [] );
 
+	const { get: getPreference } = useSelect( preferencesStore );
+	const hasFixedToolbar = getPreference( editSiteStore.name, 'fixedToolbar' );
+
 	const {
 		__experimentalSetPreviewDeviceType: setPreviewDeviceType,
 		setIsInserterOpened,
@@ -213,14 +216,18 @@ export default function HeaderEditMode() {
 						) }
 						{ isLargeViewport && (
 							<>
-								<ToolbarItem
-									as={ ToolSelector }
-									showTooltip={ ! showIconLabels }
-									variant={
-										showIconLabels ? 'tertiary' : undefined
-									}
-									disabled={ ! isVisualMode }
-								/>
+								{ ! hasFixedToolbar && (
+									<ToolbarItem
+										as={ ToolSelector }
+										showTooltip={ ! showIconLabels }
+										variant={
+											showIconLabels
+												? 'tertiary'
+												: undefined
+										}
+										disabled={ ! isVisualMode }
+									/>
+								) }
 								<ToolbarItem
 									as={ UndoButton }
 									showTooltip={ ! showIconLabels }

From 5dddd7b738e3a74da331e97b4cd013fe924e405c Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Thu, 29 Jun 2023 19:34:53 +0300
Subject: [PATCH 3/8] reveal undo, redo and list view buttons

---
 .../src/components/block-tools/style.scss     | 29 +++++++++++++++----
 .../src/components/layout/style.scss          |  3 +-
 2 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/packages/block-editor/src/components/block-tools/style.scss b/packages/block-editor/src/components/block-tools/style.scss
index fbd303133f9c3e..5a897a3237ab7a 100644
--- a/packages/block-editor/src/components/block-tools/style.scss
+++ b/packages/block-editor/src/components/block-tools/style.scss
@@ -131,8 +131,8 @@
 	@include break-medium() {
 		&.is-fixed {
 
-			// leave room for block inserter
-			margin-left: $grid-unit-80;
+			// leave room for block inserter, undo and redo
+			margin-left: $grid-unit-80 * 3;
 			// position on top of interface header
 			position: fixed;
 			top: $admin-bar-height + $grid-unit;
@@ -145,22 +145,37 @@
 
 			&.is-collapsed {
 				width: initial;
-				margin-left: $grid-unit-80 * 3 + $grid-unit-30;
+				// leave room for block inserter, undo and redo
+				margin-left: $grid-unit-80 * 3;
 			}
 
 			.is-fullscreen-mode & {
-				// leave room for block inserter
-				margin-left: $grid-unit-80 + $grid-unit-70;
+				// leave room for block inserter, undo and redo
+				margin-left: $grid-unit-80 * 4;
 				top: $grid-unit;
 				&.is-collapsed {
 					width: initial;
-					margin-left: $grid-unit-80 * 4 + $grid-unit-30;
+					// leave room for block inserter, undo and redo
+					margin-left: $grid-unit-80 * 4;
 				}
 			}
 
 			& > .block-editor-block-toolbar.is-showing-movers {
 				flex-grow: initial;
 				width: initial;
+
+				// Add a border as separator in the block toolbar.
+				&::before {
+					content: "";
+					width: $border-width;
+					height: 26px;
+					margin-top: $grid-unit + $grid-unit-05;
+					margin-right: 0;
+					background-color: $gray-300;
+					position: relative;
+					left: -$grid-unit-05;
+					top: -1px;
+				}
 			}
 
 			& > .block-editor-block-toolbar__group-collapse-fixed-toolbar {
@@ -239,12 +254,14 @@
 		}
 
 		&.is-fixed .block-editor-block-parent-selector {
+
 			.block-editor-block-parent-selector__button {
 				position: relative;
 				top: -1px;
 				border: 0;
 				padding-right: 6px;
 				padding-left: 6px;
+
 				&::after {
 					content: "\00B7";
 					font-size: 16px;
diff --git a/packages/edit-site/src/components/layout/style.scss b/packages/edit-site/src/components/layout/style.scss
index 126a31bfe34d23..65a581503cbc85 100644
--- a/packages/edit-site/src/components/layout/style.scss
+++ b/packages/edit-site/src/components/layout/style.scss
@@ -10,7 +10,8 @@
 		@include break-medium() {
 			&.is-fixed {
 				// the combined with of the tools at the right of the header and the margin left
-				width: calc(100% - 240px - #{$grid-unit-80} - #{$grid-unit-70});
+				// of the toolbar which includes four buttons
+				width: calc(100% - 240px - #{4 * $grid-unit-80});
 			}
 		}
 	}

From cf34ee67963b168343ca75fff1350b028332764d Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Fri, 30 Jun 2023 16:41:34 +0300
Subject: [PATCH 4/8] tweaks for show icon labels and hide zoom out for top
 toolbar option

---
 .../block-tools/block-contextual-toolbar.js   |  2 +-
 .../src/components/block-tools/style.scss     | 66 ++++++++++++-------
 .../src/components/header-edit-mode/index.js  |  3 +-
 3 files changed, 45 insertions(+), 26 deletions(-)

diff --git a/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js b/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js
index a406a4d50b289f..f0fc28c7fbbd21 100644
--- a/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js
+++ b/packages/block-editor/src/components/block-tools/block-contextual-toolbar.js
@@ -113,7 +113,7 @@ function BlockContextualToolbar( { focusOnMount, isFixed, ...props } ) {
 						label={
 							isCollapsed
 								? __( 'Show block tools' )
-								: __( 'Show document tools' )
+								: __( 'Hide block tools' )
 						}
 					/>
 				</ToolbarGroup>
diff --git a/packages/block-editor/src/components/block-tools/style.scss b/packages/block-editor/src/components/block-tools/style.scss
index 5a897a3237ab7a..2dce584d86bf93 100644
--- a/packages/block-editor/src/components/block-tools/style.scss
+++ b/packages/block-editor/src/components/block-tools/style.scss
@@ -131,11 +131,11 @@
 	@include break-medium() {
 		&.is-fixed {
 
-			// leave room for block inserter, undo and redo
-			margin-left: $grid-unit-80 * 3;
+			// leave room for block inserter, undo and redo, list view
+			margin-left: $grid-unit-80 * 3 - 2 * $grid-unit + $grid-unit-05;
 			// position on top of interface header
 			position: fixed;
-			top: $admin-bar-height + $grid-unit;
+			top: $admin-bar-height + $grid-unit - $border-width;
 			// Don't fill up when empty
 			min-height: initial;
 			// remove the border
@@ -145,18 +145,15 @@
 
 			&.is-collapsed {
 				width: initial;
-				// leave room for block inserter, undo and redo
-				margin-left: $grid-unit-80 * 3;
 			}
 
 			.is-fullscreen-mode & {
-				// leave room for block inserter, undo and redo
-				margin-left: $grid-unit-80 * 4;
-				top: $grid-unit;
+				// leave room for block inserter, undo and redo, list view
+				// and some margin left
+				margin-left: $grid-unit-80 * 4 - 2 * $grid-unit + $grid-unit-05;
+				top: $grid-unit - $border-width;
 				&.is-collapsed {
 					width: initial;
-					// leave room for block inserter, undo and redo
-					margin-left: $grid-unit-80 * 4;
 				}
 			}
 
@@ -168,7 +165,7 @@
 				&::before {
 					content: "";
 					width: $border-width;
-					height: 26px;
+					height: 3 * $grid-unit;
 					margin-top: $grid-unit + $grid-unit-05;
 					margin-right: 0;
 					background-color: $gray-300;
@@ -181,11 +178,25 @@
 			& > .block-editor-block-toolbar__group-collapse-fixed-toolbar {
 				border: none;
 
+				.show-icon-labels & {
+					.components-button.has-icon {
+						// Hide the button icons when labels are set to display...
+						svg {
+							display: none;
+						}
+						// ... and display labels.
+						&::after {
+							content: attr(aria-label);
+							font-size: $helptext-font-size;
+						}
+					}
+				}
+
 				// Add a border as separator in the block toolbar.
 				&::before {
 					content: "";
 					width: $border-width;
-					height: 26px;
+					height: 3 * $grid-unit;
 					margin-top: $grid-unit + $grid-unit-05;
 					margin-right: $grid-unit-10;
 					background-color: $gray-300;
@@ -198,6 +209,20 @@
 			& > .block-editor-block-toolbar__group-expand-fixed-toolbar {
 				border: none;
 
+				.show-icon-labels & {
+					.components-button.has-icon {
+						// Hide the button icons when labels are set to display...
+						svg {
+							display: none;
+						}
+						// ... and display labels.
+						&::after {
+							content: attr(aria-label);
+							font-size: $helptext-font-size;
+						}
+					}
+				}
+
 				// Add a border as separator in the block toolbar.
 				&::before {
 					content: "";
@@ -206,27 +231,20 @@
 					margin-bottom: $grid-unit + $grid-unit-05;
 					background-color: $gray-300;
 					position: relative;
-					left: -10px; //the padding of buttons
-					height: 26px;
+					left: -10px;
+					height: 3 * $grid-unit;
+					top: -1px;
 				}
 			}
 
 			.show-icon-labels & {
 
-				margin-left: $grid-unit-80;
-
-				&.is-collapsed {
-					margin-left: $grid-unit-80 * 6;
-				}
+				margin-left: $grid-unit-80 + 2 * $grid-unit; // inserter and margin ;
 
 				.is-fullscreen-mode & {
-					margin-left: $grid-unit-80 + $grid-unit-80;
-					&.is-collapsed {
-						margin-left: $grid-unit-80 * 7;
-					}
+					margin-left: $grid-unit * 18; // site hub, inserter and margin
 				}
 
-
 				.block-editor-block-parent-selector .block-editor-block-parent-selector__button::after {
 					left: 0;
 				}
diff --git a/packages/edit-site/src/components/header-edit-mode/index.js b/packages/edit-site/src/components/header-edit-mode/index.js
index b02483a01569e5..b8d3b6e4cc2554 100644
--- a/packages/edit-site/src/components/header-edit-mode/index.js
+++ b/packages/edit-site/src/components/header-edit-mode/index.js
@@ -264,7 +264,8 @@ export default function HeaderEditMode() {
 									/>
 								) }
 								{ isZoomedOutViewExperimentEnabled &&
-									! isDistractionFree && (
+									! isDistractionFree &&
+									! hasFixedToolbar && (
 										<ToolbarItem
 											as={ Button }
 											className="edit-site-header-edit-mode__zoom-out-view-toggle"

From 11cfa84f1a9fb51bbc875dc86f7b59a51db79115 Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Fri, 30 Jun 2023 19:15:54 +0300
Subject: [PATCH 5/8] improve the responsiveness of the fixed block toolbar

---
 .../src/components/block-tools/style.scss         | 15 +++++++++++----
 .../header-edit-mode/document-actions/style.scss  |  8 ++++++++
 .../edit-site/src/components/layout/style.scss    | 12 ------------
 3 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/packages/block-editor/src/components/block-tools/style.scss b/packages/block-editor/src/components/block-tools/style.scss
index 2dce584d86bf93..077acc4964db14 100644
--- a/packages/block-editor/src/components/block-tools/style.scss
+++ b/packages/block-editor/src/components/block-tools/style.scss
@@ -143,6 +143,10 @@
 			// has to be flex for collapse button to fit
 			display: flex;
 
+			//hide overflow and scroll
+			overflow: hidden;
+			overflow-x: scroll;
+
 			&.is-collapsed {
 				width: initial;
 			}
@@ -150,7 +154,7 @@
 			.is-fullscreen-mode & {
 				// leave room for block inserter, undo and redo, list view
 				// and some margin left
-				margin-left: $grid-unit-80 * 4 - 2 * $grid-unit + $grid-unit-05;
+				margin-left: $grid-unit-80 * 4 - 2 * $grid-unit;
 				top: $grid-unit - $border-width;
 				&.is-collapsed {
 					width: initial;
@@ -170,7 +174,7 @@
 					margin-right: 0;
 					background-color: $gray-300;
 					position: relative;
-					left: -$grid-unit-05;
+					left: math.div(-$grid-unit-05, 2);
 					top: -1px;
 				}
 			}
@@ -210,6 +214,7 @@
 				border: none;
 
 				.show-icon-labels & {
+					width: $grid-unit-80 * 4;
 					.components-button.has-icon {
 						// Hide the button icons when labels are set to display...
 						svg {
@@ -231,7 +236,7 @@
 					margin-bottom: $grid-unit + $grid-unit-05;
 					background-color: $gray-300;
 					position: relative;
-					left: -10px;
+					left: -8px;
 					height: 3 * $grid-unit;
 					top: -1px;
 				}
@@ -321,7 +326,9 @@
 	// for the block inserter the publish button
 	@include break-large() {
 		&.is-fixed {
-			width: initial;
+			// the combined with of the tools at the right of the header and the margin left
+			// of the toolbar which includes four buttons
+			width: calc(100% - 240px - #{4 * $grid-unit-80});
 		}
 	}
 
diff --git a/packages/edit-site/src/components/header-edit-mode/document-actions/style.scss b/packages/edit-site/src/components/header-edit-mode/document-actions/style.scss
index 63c4d5198f8fb4..6281887b137382 100644
--- a/packages/edit-site/src/components/header-edit-mode/document-actions/style.scss
+++ b/packages/edit-site/src/components/header-edit-mode/document-actions/style.scss
@@ -16,6 +16,14 @@
 		color: currentColor;
 		background: $gray-200;
 	}
+
+	@include break-medium() {
+		width: 50%;
+	}
+
+	@include break-large() {
+		width: min(100%, 450px);
+	}
 }
 
 .edit-site-document-actions__command {
diff --git a/packages/edit-site/src/components/layout/style.scss b/packages/edit-site/src/components/layout/style.scss
index 65a581503cbc85..2fe210327661d4 100644
--- a/packages/edit-site/src/components/layout/style.scss
+++ b/packages/edit-site/src/components/layout/style.scss
@@ -4,18 +4,6 @@
 	color: $gray-400;
 	display: flex;
 	flex-direction: column;
-
-	// Expand the fixed block toolbar to cover the document title control.
-	.block-editor-block-contextual-toolbar {
-		@include break-medium() {
-			&.is-fixed {
-				// the combined with of the tools at the right of the header and the margin left
-				// of the toolbar which includes four buttons
-				width: calc(100% - 240px - #{4 * $grid-unit-80});
-			}
-		}
-	}
-
 }
 
 .edit-site-layout__hub {

From 672fdb8facba03c46ded323bfc79a0ad857b8cb4 Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Tue, 4 Jul 2023 14:07:00 +0300
Subject: [PATCH 6/8] remove the overflow rule - bad experiment

---
 packages/block-editor/src/components/block-tools/style.scss | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/packages/block-editor/src/components/block-tools/style.scss b/packages/block-editor/src/components/block-tools/style.scss
index 077acc4964db14..07e400344bfe10 100644
--- a/packages/block-editor/src/components/block-tools/style.scss
+++ b/packages/block-editor/src/components/block-tools/style.scss
@@ -143,10 +143,6 @@
 			// has to be flex for collapse button to fit
 			display: flex;
 
-			//hide overflow and scroll
-			overflow: hidden;
-			overflow-x: scroll;
-
 			&.is-collapsed {
 				width: initial;
 			}

From 31ede3c84ab340d2e52767654d2f5936c96ccddd Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Wed, 5 Jul 2023 14:15:16 +0300
Subject: [PATCH 7/8] update top toolbar test with the new label for buttons

---
 test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js b/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js
index 05105123546289..966c24952ea72c 100644
--- a/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js
+++ b/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js
@@ -254,7 +254,7 @@ class ToolbarUtils {
 			exact: true,
 		} );
 		this.blockToolbarShowDocumentButton = this.page.getByRole( 'button', {
-			name: 'Show document tools',
+			name: 'Hide block tools',
 			exact: true,
 		} );
 	}

From 5989fa7ff41e6516d59b35506df44f8436321569 Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Wed, 5 Jul 2023 15:19:07 +0300
Subject: [PATCH 8/8] update the toolbar tests to account for moving the
 collapse button

---
 .../various/shortcut-focus-toolbar.spec.js    | 20 ++++---------------
 1 file changed, 4 insertions(+), 16 deletions(-)

diff --git a/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js b/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js
index 966c24952ea72c..9361da403c6d9e 100644
--- a/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js
+++ b/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js
@@ -100,11 +100,8 @@ test.describe( 'Focus toolbar shortcut (alt + F10)', () => {
 			await editor.insertBlock( { name: 'core/paragraph' } );
 			await toolbarUtils.moveToToolbarShortcut();
 			await expect(
-				toolbarUtils.blockToolbarShowDocumentButton
+				toolbarUtils.blockToolbarParagraphButton
 			).toBeFocused();
-			await expect(
-				toolbarUtils.documentToolbarTooltip
-			).not.toBeVisible();
 
 			// Test: Focus the block toolbar from paragraph block with content
 			await editor.insertBlock( { name: 'core/paragraph' } );
@@ -113,11 +110,8 @@ test.describe( 'Focus toolbar shortcut (alt + F10)', () => {
 			);
 			await toolbarUtils.moveToToolbarShortcut();
 			await expect(
-				toolbarUtils.blockToolbarShowDocumentButton
+				toolbarUtils.blockToolbarParagraphButton
 			).toBeFocused();
-			await expect(
-				toolbarUtils.documentToolbarTooltip
-			).not.toBeVisible();
 		} );
 
 		test( 'Focuses the correct toolbar in select mode', async ( {
@@ -135,11 +129,8 @@ test.describe( 'Focus toolbar shortcut (alt + F10)', () => {
 			await toolbarUtils.useSelectMode();
 			await toolbarUtils.moveToToolbarShortcut();
 			await expect(
-				toolbarUtils.blockToolbarShowDocumentButton
+				toolbarUtils.blockToolbarParagraphButton
 			).toBeFocused();
-			await expect(
-				toolbarUtils.documentToolbarTooltip
-			).not.toBeVisible();
 
 			// Test: Focus the block toolbar from paragraph in select mode
 			await editor.insertBlock( { name: 'core/paragraph' } );
@@ -149,11 +140,8 @@ test.describe( 'Focus toolbar shortcut (alt + F10)', () => {
 			await toolbarUtils.useSelectMode();
 			await toolbarUtils.moveToToolbarShortcut();
 			await expect(
-				toolbarUtils.blockToolbarShowDocumentButton
+				toolbarUtils.blockToolbarParagraphButton
 			).toBeFocused();
-			await expect(
-				toolbarUtils.documentToolbarTooltip
-			).not.toBeVisible();
 		} );
 	} );