Skip to content

Commit a463271

Browse files
committed
Toolbar: Add JavaScript fallback for determining command palette icon.
Introduces a JavaScript fallback for determining whether the command palette icon in the toolbar should display ⌘Kfor Apple devices. This is to account for sites behind a CDN as it's common for the User-Agent header to be stripped from the request sent to the application server in order to increase cache hits on the edge. Props peterwilsoncc, westonruter, mukesh27, ramonopoly. Fixes #65121. git-svn-id: https://develop.svn.wordpress.org/trunk@62282 602fd350-edb4-49c9-b593-d223f7449a82
1 parent ed2ebcd commit a463271

1 file changed

Lines changed: 30 additions & 5 deletions

File tree

src/wp-includes/admin-bar.php

Lines changed: 30 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -949,16 +949,40 @@ function wp_admin_bar_command_palette_menu( WP_Admin_Bar $wp_admin_bar ): void {
949949
return;
950950
}
951951

952-
$is_apple_os = (bool) preg_match( '/Macintosh|Mac OS X|Mac_PowerPC/i', $_SERVER['HTTP_USER_AGENT'] ?? '' );
953-
$shortcut_label = $is_apple_os
954-
? _x( '⌘K', 'keyboard shortcut to open the command palette' )
955-
: _x( 'Ctrl+K', 'keyboard shortcut to open the command palette' );
956-
$title = sprintf(
952+
$shortcut_labels = array(
953+
'appleOS' => _x( '⌘K', 'keyboard shortcut to open the command palette' ),
954+
'default' => _x( 'Ctrl+K', 'keyboard shortcut to open the command palette' ),
955+
);
956+
$apple_pattern = 'Macintosh|Mac OS X|Mac_PowerPC';
957+
$is_apple_os = (bool) preg_match( "/{$apple_pattern}/i", $_SERVER['HTTP_USER_AGENT'] ?? '' );
958+
$shortcut_label = $is_apple_os ? $shortcut_labels['appleOS'] : $shortcut_labels['default'];
959+
$title = sprintf(
957960
'<span class="ab-icon" aria-hidden="true"></span><span class="ab-label"><kbd>%s</kbd><span class="screen-reader-text"> %s</span></span>',
958961
$shortcut_label,
959962
/* translators: Hidden accessibility text. */
960963
__( 'Open command palette' ),
961964
);
965+
/*
966+
* Detect Apple OS via JavaScript for sites behind a CDN blocking the UA header.
967+
*
968+
* Running the script as the admin bar is rendered avoids a flash of incorrect content
969+
* for users with Apple OS when the UA header is blocked. It also prevents the need for
970+
* wp-i18n to be loaded as a dependency.
971+
*/
972+
$function = <<<'JS'
973+
( applePattern, appleOSLabel ) => {
974+
if ( ( new RegExp( applePattern ) ).test( navigator.userAgent ) ) {
975+
document.querySelector( '#wp-admin-bar-command-palette .ab-label kbd' ).textContent = appleOSLabel;
976+
}
977+
}
978+
JS;
979+
$script = sprintf(
980+
'( %s )( %s, %s );',
981+
$function,
982+
wp_json_encode( $apple_pattern, JSON_HEX_TAG | JSON_UNESCAPED_SLASHES ),
983+
wp_json_encode( $shortcut_labels['appleOS'], JSON_HEX_TAG | JSON_UNESCAPED_SLASHES )
984+
);
985+
$script .= "\n//# sourceURL=" . rawurlencode( __FUNCTION__ );
962986
$wp_admin_bar->add_node(
963987
array(
964988
'id' => 'command-palette',
@@ -967,6 +991,7 @@ function wp_admin_bar_command_palette_menu( WP_Admin_Bar $wp_admin_bar ): void {
967991
'meta' => array(
968992
'class' => 'hide-if-no-js',
969993
'onclick' => 'wp.data.dispatch( "core/commands" ).open(); return false;',
994+
'html' => wp_get_inline_script_tag( $script ),
970995
),
971996
)
972997
);

0 commit comments

Comments
 (0)