FileBrowser: Add shortcuts #10206
FileBrowser: Add shortcuts #10206
Conversation
|
Thanks for making a pull request to JupyterLab! To try out this branch on binder, follow this link: |
| @@ -138,6 +138,9 @@ export class FileBrowser extends Widget { | |||
| this.layout.addWidget(this._crumbs); | |||
| this.layout.addWidget(this._listing); | |||
|
|
|||
| // We need to make the FileBrowser focusable so that it receives keyboard events | |||
| this.node.tabIndex = 0; | |||
There was a problem hiding this comment.
I'd like to know if this is the right way to do this though. It's the only way I found for the filebrowser to receive keyboard events, otherwise, the body gets them (and keybindings don't get triggered).
There was a problem hiding this comment.
Ah, maybe that's was why I never managed to finish #6859
There was a problem hiding this comment.
I recall that @afshin dealt with some complex issues relating to focus and keybindings in the past. Perhaps he could weigh in?
There was a problem hiding this comment.
It looks this may actually address some of the accessibility issues mentioned jupyterlab/frontends-team-compass#98 (comment).
There was a problem hiding this comment.
I'd like to know if this is the right way to do this though. It's the only way I found for the filebrowser to receive keyboard events, otherwise, the body gets them (and keybindings don't get triggered).
I think you are right - I think only focusable elements can receive keyboard events (at least as targets), and setting the tabindex is how you make a div focusable. See https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex for more.
martinRenou
force-pushed
the
filebrowser_delete_file_shortcut
branch
2 times, most recently
from
a98e6ea
to
9bcc078
Compare
|
Would adding "go up" (see #6859) be in scope? |
I guess having it as a separate PR is good? As I am not really adding new behavior here, just adding new keybindings for already existing behaviors. |
| app.commands.addKeyBinding({ | ||
| command: CommandIDs.open, | ||
| selector: selectorBrowser, | ||
| keys: ['Enter'] |
There was a problem hiding this comment.
Wondering whether this Enter shortcut has some side-effects on the existing behavior of being able to create a new directory, naming it, and pressing enter to go into it?
There was a problem hiding this comment.
For example the behavior looks a bit off when testing on the Binder for this branch:
new-untitled-enter.mp4
martinRenou
force-pushed
the
filebrowser_delete_file_shortcut
branch
from
9bcc078
to
5bc97cf
Compare
|
@jtpio I am removing the |
|
Test failures are not related: #10228 (comment) |
|
Possible follow-ups that could be tracked in separate issues:
|
|
Kicking CI |
|
Finally green! ahah |
github-actions
bot
added
the
status:resolved-locked
Adding keyboard shortcuts to Filebrowser, following vscode (and actually very common) shorcuts