Navigation Link: Replace missing link tooltip with ARIA label

himanshupathak95 · Jan 13, 2025 · 7850e1d · 7850e1d
1 parent d3758ce
commit 7850e1d
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/packages/block-library/src/navigation-link/edit.js b/packages/block-library/src/navigation-link/edit.js
@@ -532,11 +532,12 @@ export default function NavigationLinkEdit( {
 				<a className={ classes }>
 					{ /* eslint-enable */ }
 					{ ! url ? (
-						<div className="wp-block-navigation-link__placeholder-text">
-							<Tooltip text={ tooltipText }>
-								<span>{ missingText }</span>
-							</Tooltip>
-						</div>
+						<span
+							className="wp-block-navigation-link__placeholder-text"
+							aria-label={ __( 'This item is missing a link' ) }
+						>
+							{ missingText }
+						</span>
 					) : (
 						<>
 							{ ! isInvalid &&

diff --git a/packages/block-library/src/navigation-link/editor.scss b/packages/block-library/src/navigation-link/editor.scss
@@ -80,7 +80,7 @@
 	background-image: none !important;
 
 	// Draw a wavy underline.
-	.wp-block-navigation-link__placeholder-text span {
+	.wp-block-navigation-link__placeholder-text {
 		$blur: 10%;
 		$width: 6%;
 		$stop1: 30%;