-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Make the Settings panel toggle button show its keyboard shortcut in its tooltip #65322
Make the Settings panel toggle button show its keyboard shortcut in its tooltip #65322
Conversation
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Size Change: +1.51 kB (+0.09%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
const isPostEditorComplementaryArea = [ | ||
'edit-post/document', | ||
'edit-post/block', | ||
].includes( identifier ); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why should this be limited to these areas only?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@youknowriad to my understanding, the shortcut itself is meant to work only for these areas. It doesn't open the Styles panel, it doesn't open the Plugins panel. As such, the keyboard shortcut should only be shown in the Settings toggle button tooltip. Otherwise, it will show up also in the Styles toggle or any Plugin toggle button.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's not the case in my testing for styles at least. The shortcut is passed by the usage of <ComplementaryArea toggleShortcut={ something } />
So if I don't pass it explicitly in my own plugin, it's not rendered and it's not effective. So I think we can probably remove this hardcoded checks.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@youknowriad I already tested it. And I tested it again now. Here's what happens when removing that condition:
As you can see, the shortcut is shown also in the Jetpack and Yoast SEO button tooltips. I stand corrected that it does not happen for the Styles button.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
For me, this means that we have a bug here
toggleShortcut={ shortcut } |
The shortcut shouldn't be associated with the complementary area at all if it's not meant to be used for it. So basically I think we should just remove that line/prop.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok. The only context I found about the plugin sidebar using the shortcut prop is in this comment #20698 (comment) but I'm not sure I fully understand it Cc @jorgefilipecosta when you have a chance coukd you please share some context?
For now, I just removed the prop from PluginSidebar.
…ts tooltip (#65322) * Make the Settings panel toggle button show its keyboard shortcut in its tooltip. * Do not pass shortcut prop to PluginSidebar and simplify. Co-authored-by: afercia <afercia@git.wordpress.org> Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
I just cherry-picked this PR to the wp/6.7 branch to get it included in the next release: 9e45522 |
Fixes #65310
What?
The Settings button doesn't show its keyboard shortcut in its tooltip.
Why?
All buttons that have an associated keyboard shortcut are expected to visually expose the shortcut in their tooltip.
How?
Note:
I would have liked there was a better way to check whether a ComplementaryArea comes from core or plugins. I see that the complementary area scope prop is required and it appears to be used for this purpose. However, in my testing, I found that it isn't reliable.
identifier
andscope
for the Jetpack sidebar, the returned values arejetpack-sidebar/jetpack
, which is correct, andcore
which appears to be incorrect. I guess it would be good to inform the Jetpack plugin authors to double check.seo-sidebar
.core
as the scope value? I guess this value should be reserved. Plugins should be enforced to use a prefixed, unique, scope.edit-post/document
andedit-post/block
. I see similar hardcoded values are already in place when the keyboard shortcut is registered, so I guess it's not terribly bad. However, there should be a better way to check whether a complementary area sidebar comes from core or not. even better, to check if it is associated with a keyboard shortcut. If anyone has better idea to check this, please let me know.Also note:
The Widgets page Settings panel isn't associated with a keyboard shortcut. A decision shoul dbe made on whether to add the shortcut in the first place but that's out of the scope of this PR.
Testing Instructions
Testing Instructions for Keyboard
Screenshots or screencast
Before:
After: