fix: Display appropriate help hint for navigating blocks in RTL (#9857)

* fix: Display appropriate help hint for navigating blocks in RTL

* chore: Run formatter
This commit is contained in:
Aaron Dodson
2026-05-11 14:42:51 -07:00
committed by GitHub
parent e250737199
commit 0b2109262c
4 changed files with 43 additions and 6 deletions
+7 -1
View File
@@ -90,7 +90,13 @@ export function showHelpHint(workspace: WorkspaceSvg) {
* @param workspace The workspace.
*/
export function showBlockNavigationHint(workspace: WorkspaceSvg) {
const message = Msg['KEYBOARD_NAV_BLOCK_NAVIGATION_HINT'];
const shortcut = getShortcutKeysShort(
workspace.RTL ? names.NAVIGATE_LEFT : names.NAVIGATE_RIGHT,
);
const message = Msg['KEYBOARD_NAV_BLOCK_NAVIGATION_HINT'].replace(
'%1',
shortcut,
);
const id = blockNavigationHintId;
Toast.show(workspace, {message, id});
}
+2 -2
View File
@@ -1,7 +1,7 @@
{
"@metadata": {
"author": "Ellen Spertus <ellen.spertus@gmail.com>",
"lastupdated": "2026-05-07 12:03:23.440539",
"lastupdated": "2026-05-11 14:15:58.197621",
"locale": "en",
"messagedocumentation" : "qqq"
},
@@ -464,7 +464,7 @@
"WORKSPACE_CONTENTS_BLOCKS_ZERO": "No blocks%2 in workspace.",
"WORKSPACE_CONTENTS_COMMENTS_MANY": " and %1 comments",
"WORKSPACE_CONTENTS_COMMENTS_ONE": " and one comment",
"KEYBOARD_NAV_BLOCK_NAVIGATION_HINT": "Use the right arrow key to navigate inside of blocks.",
"KEYBOARD_NAV_BLOCK_NAVIGATION_HINT": "Use %1 to navigate inside of blocks.",
"KEYBOARD_NAV_WORKSPACE_NAVIGATION_HINT": "Use the arrow keys to navigate.",
"BLOCK_LABEL_BEGIN_STACK": "Begin stack",
"BLOCK_LABEL_BEGIN_PREFIX": "Begin %1",
+2 -2
View File
@@ -1839,7 +1839,7 @@ Blockly.Msg.WORKSPACE_CONTENTS_COMMENTS_MANY = ' and %1 comments';
Blockly.Msg.WORKSPACE_CONTENTS_COMMENTS_ONE = ' and one comment';
/** @type {string} */
/// Message shown when a user presses Enter with a navigable block focused.
Blockly.Msg.KEYBOARD_NAV_BLOCK_NAVIGATION_HINT = 'Use the right arrow key to navigate inside of blocks.';
Blockly.Msg.KEYBOARD_NAV_BLOCK_NAVIGATION_HINT = 'Use %1 to navigate inside of blocks.';
/** @type {string} */
/// Message shown when a user presses Enter with the workspace focused.
Blockly.Msg.KEYBOARD_NAV_WORKSPACE_NAVIGATION_HINT = 'Use the arrow keys to navigate.';
@@ -1880,7 +1880,7 @@ Blockly.Msg.BLOCK_LABEL_HAS_INPUTS = 'has inputs';
/** @type {string} */
/// Part of an accessibility label for a block that indicates that it is
/// a statement block, i.e. that it has a next or previous connection.
/// "command" here is used in the sense of a computer command, or a
/// "command" here is used in the sense of a computer command, or a
/// command block in Scratch.
Blockly.Msg.BLOCK_LABEL_STATEMENT = 'command';
/** @type {string} */
@@ -1367,11 +1367,42 @@ suite('Keyboard Shortcut Items', function () {
sinon.assert.calledWith(toastSpy, this.workspace, {
id: 'blockNavigationHint',
message: Blockly.Msg['KEYBOARD_NAV_BLOCK_NAVIGATION_HINT'],
message: Blockly.Msg['KEYBOARD_NAV_BLOCK_NAVIGATION_HINT'].replace(
'%1',
'→',
),
});
toastSpy.restore();
});
test('Shows a toast with RTL navigation hints for navigable blocks', function () {
const toolbox = document.getElementById('toolbox-test');
const ws = Blockly.inject('blocklyDiv', {
toolbox,
renderer: 'zelos',
rtl: true,
});
const toastSpy = sinon.spy(Blockly.Toast, 'show');
const block = ws.newBlock('controls_if');
block.initSvg();
block.render();
Blockly.getFocusManager().focusNode(block);
const event = createKeyDownEvent(Blockly.utils.KeyCodes.ENTER);
ws.getInjectionDiv().dispatchEvent(event);
sinon.assert.calledWith(toastSpy, ws, {
id: 'blockNavigationHint',
message: Blockly.Msg['KEYBOARD_NAV_BLOCK_NAVIGATION_HINT'].replace(
'%1',
'←',
),
});
toastSpy.restore();
ws.dispose();
});
// Reenable this tests once the shortcut listing shortcut has been added.
test.skip('Shows a toast with instructions to view help for non-navigable blocks', function () {
const toastSpy = sinon.spy(Blockly.Toast, 'show');