No Code Attached Yet a11y
avatar brianteeman
brianteeman
28 Jan 2022

Steps to reproduce the issue

Use this keyboard only and try to create a new folder in the media manager

The modal never gets keyboard focus - you can see navigation taking place on the main window below the modal

media

avatar brianteeman brianteeman - open - 28 Jan 2022
avatar joomla-cms-bot joomla-cms-bot - change - 28 Jan 2022
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 28 Jan 2022
avatar pritam825
pritam825 - comment - 28 Jan 2022

I am working on this

avatar pritam825
pritam825 - comment - 28 Jan 2022

I have replace this code
MediaManager.Event.listen('onClickCreateFolder', function () {
return _this2.$store.commit(SHOW_CREATE_FOLDER_MODAL);
});
with this
MediaManager.Event.listen('onClickCreateFolder', function () {
document.querySelector('[tabindex="-1"]').focus();
return _this2.$store.commit(SHOW_CREATE_FOLDER_MODAL);
});
But it's not working , can you please give me some hint, I have tried by made a function for setting globally tabindex=-1 and calling it when clicking on the create folder button , it's also not working, so can you please give some hint;

avatar brianteeman
brianteeman - comment - 28 Jan 2022

If I could have fixed it then I would have done it myself. Sorry I dont have a clue

avatar pritam825
pritam825 - comment - 28 Jan 2022

ok sir Thanks, I will try until I get the solution.

avatar richard67 richard67 - change - 28 Jan 2022
Labels Added: a11y
avatar richard67 richard67 - labeled - 28 Jan 2022
avatar dgrammatiko
dgrammatiko - comment - 28 Jan 2022

@pritam825 you will need to jail the tab functionality only to the modal focusable elements, eg:

The functionality needs to happen on the opening of the modal and needs to be disconnected when the modal closes

avatar pritam825
pritam825 - comment - 28 Jan 2022

@dgrammatiko Thanks, I am working according to your instruction

avatar akshitrattan
akshitrattan - comment - 29 Jan 2022

I have 2 solutions to this, problem, and I tried applying it on my local system but due to some reason the changes don't seem to work, I would need a little help regarding the solutions from anyone who is familiar with vue.js
I am pretty sure the solutions should work
@dgrammatiko

avatar akshitrattan
akshitrattan - comment - 29 Jan 2022

Steps to reproduce the issue

Use this keyboard only and try to create a new folder in the media manager

The modal never gets keyboard focus - you can see navigation taking place on the main window below the modal

media

this problem is with the delete modal also

avatar richard67
richard67 - comment - 30 Jan 2022

I have 2 solutions to this, problem, and I tried applying it on my local system but due to some reason the changes don't seem to work, I would need a little help regarding the solutions from anyone who is familiar with vue.js I am pretty sure the solutions should work @dgrammatiko

@akshitrattan You know that you have to compile the js, e.g. with npm ci or npm run build:js? See here for a description: https://docs.joomla.org/J4.x:Setting_Up_Your_Local_Environment

avatar richard67 richard67 - change - 30 Jan 2022
Status New Closed
Closed_Date 0000-00-00 00:00:00 2022-01-30 11:41:02
Closed_By richard67
avatar richard67 richard67 - close - 30 Jan 2022
avatar richard67
richard67 - comment - 30 Jan 2022

Closing as having a pull request.

Add a Comment

Login with GitHub to post a comment