Accessibility Issue in Arranging the Menu Items: I need a combobox for selecting the parent item and a combobox for selecting the item position

[javad2000]

Hello
I shall firstly thank WordPress team for their utmost attention to accessibility standards, which makes WordPress unique among all CMSs. All WordPress
core features are fairly Accessible for me as a blind person who uses screen reader (JAWS), but I always have problems with rearranging the menu items.
Although the menu-items are also very accessible for a blind person and I can re-arrange them very well, this process is very time consuming for me, because;
for example, if I want to send a menu-item from position 16 to position 11, I have to press “Move Up” 5 times. The problem is:
I don’t have any combobox that assigns the mother-item and the item-position. Therefore, I have to adjust the positions by moving each item one by one,
level by level.

Suppose I have a menu with lots of sub-menus and sub-items. Now, I want to add 6 new sub-items to the different menus. Of course, when I add them to the
menu, they are at the end of menu. If I want to bring each item to a certain position near the center of menu, I have to click “Move up” and “Move down”
one by one for many many times over and over. It takes me about 2 hours to rearrange those menu items. I hope I could explain clearly.

Solution:
Beside each menu item, there is a link called “Edit Menu Item”. When I click on the link, a set of options open up: move up, move down, name, etc. I would
like to have two other options as well: mother-item, and position. For example, I adjust the mother-item of “Audio Translation” as “Translation”, and I
adjust its position to “2”, which means subitem number 2 under “Translation”. I hope I could explain clearly what I mean. If I can adjust the menu positions
with comboboxes, I will not have to click “move up” and “move down” many many times.

[audrasjb]

Hi @javad2000 and many thanks for this ticket,

We are still working on a similar ticket: #40678 - Editing menus in WP admin for blind people. Of course, feel free to comment this other one as well.
I think we can keep both tickets for now because what you offer brings additional elements to the other ticket.

I will work to integrate your solutions on my work on the other ticket.

Cheers,
Jb

Related: #40678

[audrasjb]

Workaround

[juliemoynat]

Hi,

I think that's a good idea!

@audrasjb, I'm not sure that @javad2000 can see your animated image. :)

In your example, you add a "Move to position:" field with "1", "2", "3", "4" options.
Can we add the total number of items to help a little bit more?

"Move to position:"

• 1 of 8
• 2 of 8
• 3 of 8
• etc.

@javad2000 also needs another field to define an item as a child. Can we do as we have it for "Pages"?

"Parent:"

• (no parent)
• Blog page
• Sample page
• W.org
• Google
• etc.

[afercia]

I will work to integrate your solutions on my work on the other ticket.

I'd recommend to keep things separated :) It's far better to have smaller patches, focused on a single issue, rather than big ones that are difficult to review, test, and they often go stale pretty soon.

[javad2000]

Hi again
I am still waiting for this feature, but no hope yet after 3 years.

[javad2000]

In addition to those two comboboxes in the Menu Editor Page, we might have those two comboboxes on page/post editor dashboard as well. This helps us assign pages/posts directly to a menu item at a certain position from the page editor dashboard.

[wmalexander]

Hello,

This ticket has been dormant for a while - but I wanted to see if there may be any chance of further action related to this issue. I received the following request from one of our users related to this exact issue:

---

We are familiar with the "Edit Menu" option for each of the menu items, but the
feature is very limited and only allows a couple of movement changes. It would
be great if this menu had an option to move as child to X, or move as parent to
X with much more flexibility.

In the main menu screen, using the NVDA screen reader, I am noticing that
whenever I move menu items around, if I am moving the item up through the menu
structure, as it moves in and out of menus to its destination, other menu items
get included with the original item during the dragging process, which
completely rearranges the entire menu structure.

The only work-around I have found is to not move the item horizontally, but
instead continue moving it vertically through all of the existing menu items
until I reach the new location.

I wonder if perhaps the new WordPress updates address this?

---

Any room for further discussion and or action related to this issue? Thanks!

[wmalexander]

Hello - just hoping this item at least has room for discussion? I tried editing the menu using a screen reader myself and it is, honestly, a terrible experience.

[william.alexander]

Hello,

Just poking this ticket again. It looks like the related tickets that are mentioned have been closed, but this issue is certainly unresolved. Having tried myself to edit the menu using a screen reader, it’s clear that the menu editor is close to unusable for a blind user.

[wmalexander]

👋 Still hopeful that there is a possibility that this accessibility issue could receive some attention.

[wmalexander]

Hello - 👉 just poking to see if this might get rediscussed at some point.

[wmalexander]

Just giving this wheel another squeak.

[wmalexander]

Hello - really hoping I can update my vision-impaired colleague who reported this issue with something positive about the possibility that this might eventually be fixed.

[william.alexander]

@audrasjb do you know if there is any remote plan to address this accessibility issue?

[wmalexander]

@afercia forgive me for not knowing the protocol for items like this - if an issue like this one appears to be stalled, is there any way to resubmit or reactivate it? Thank you.

[wmalexander]

@joedolson a colleague of mine found your WordPress.org profile and suggested that you might be someone who could possibly provide some information about the likelihood that this issue may someday be addressed. Do you know if this is the kind of accessibility issue that might be on the docket for attention in the foreseeable future? Or, do you know if there might be plans to replace the current menu editor with a new version related to the site editor, which might make addressing this issue an effort that would shortly find itself in the WP trash heap?

In a ​Yoast blog post about WordPress 6.3 I read:

Of course, a WordPress release isn’t complete without several performance and technical enhancements. Also, as with the last few releases, there was a strong focus on accessibility. Making WordPress more accessible with every new version that’s being released.

Which is great to read, and makes me hopeful that the menu editor accessibility will be improved in the near future, but the fact that this ticket has existed for 5 years and continues to receive no updates of any kind does create some pessimism about this issue specifically. Any news of any kind at all?

[joedolson]

In the Accessibility bug scrub on 2023/8/18, we agreed that adding a mechanism that allows a user to set the parent & position of a menu item is worth pursuing. @travel_girl will work on some designs mockups for both the classic menu editor and for Gutenberg; this is also a problem in the new menu editor, so we should consider both.

[wmalexander]

Hello! It's been several months since this topic has had an update. Just curious if there might be any progress underway? Thanks!

[william.alexander]

Hello! I thought I'd check in to see if we can get this ticket moving somehow. Is there something I could do to help? I'm not sure what I could do, but if someone could comment on what the next step towards progress is on this task, I would be glad to try to accomplish that step.

[joedolson]

Assigning to @rcreators to develop a patch per conversation in Slack.

Trac ticket: https://core.trac.wordpress.org/ticket/43305

[rcreators]

Hello @joedolson & @williamalexander,

I have added PR for the initial functional working model. Can you guys try it out in Playground and give me feedback on the same? It's still not completely developed but the base code is I think ready.

Pending points:

• Changing parent/order by dragging needs to be updated in new controls.
• Changing order or parent items, sub-items need to move with it.

Let me know if anything else remains as well.

NOTE: It's only applied on WordPress admin->menu area. The customiser menu remains.

[wmalexander]

@rcreators this is great! Thank you so much! I tested in the playground and as far as I can tell this is very much headed in the hoped for direction. I have shared this with my colleague who initially reported the issue to ask for his feedback, which I will share as soon as he provides it. Thank you so much for taking this on!

[rcreators]

Hello @wmalexander, Thanks for the feedback. I just updated PR with the new code. From my side, I think almost 99% functionality is done. I need some heavy testing on it if something is broken or not working as intended or if there are any scenarios I missed. If you can do that, that will be great.

Once we have confirmation on it, I can update the same on the customizer area and this will be done.

[wmalexander]

I will work with my colleague to test this early this week. I did find some problems with my testing which I've shown in the video below - if the user moves an item up or down in the menu order with the arrow key (not the dropdown) the dropdown is not updated. I was even able to make a page unintentionally vanish from the menu. Please see the video here: ​https://www.loom.com/share/59703597c54b4550bcd11378188442d7?sid=5870805b-2695-4e80-b653-4434f60c3d11.

[rcreators]

Hello @wmalexander, I was not aware of keyboard events. My bad. I updated the code on PR. So it will update the parent and order field with the keyboard events as well. I am still looking into some code and logic optimisation for that menu item getting removed entirely. Mostly has to do with placing out of the index. Let you know, once done. Apart from that, if you come across any issues, do let me know.

[wmalexander]

@rcreators - I'm getting an error now when I try to test the PR in playground: "Waiting for GitHub to finish building PR 6238. This might take 15 minutes or more! Retrying in 19..." - Do you know what I might need to do differently to resume testing this? It doesn't seem to go away.

[rcreators]

@wmalexander, It happens sometimes. Wait for a few mins or try after some time, it will work.

[wmalexander]

Replying to rcreators:

@wmalexander, It happens sometimes. Wait for a few mins or try after some time, it will work.

Still seeing that same behavior today, after retrying multiple times yesterday 🤷

[wmalexander]

Could anyone else following this thread verify whether or not they are able to test this new functionality successfully in the playground? I've tried for a few days now but get the same error every time: "Waiting for GitHub to finish building PR 6238. This might take 15 minutes or more! Retrying in 19..."

[juliemoynat]

Hi,
After waiting 2 hours, I can confirm that the playground doesn't work…

[rcreators]

I will be pushing some more code today for the menu item getting removed. Let's see if it will solve the playground issue.

[rcreators]

@wmalexander & @juliemoynat Just completed most of the code for Admin Menu area and tested with playground. Works fine. Please try and do let me know.

[wmalexander]

I remain unable to test this in the playground. I'd like to say that I would just build a local site with this PR merged into WordPress, but I'm not really sure if that's the next best option for me to test this. Is that the next best option for testing this?

[wmalexander]

@rcreators do you think you could push a code update that might refresh the playground for this code? I still have not been able to test this there. For example:

​https://www.loom.com/share/6d6e88029e9a4d75ad0ebb4a3c7050fe?sid=b7d962d5-d70c-4f51-9f39-4b6b3f760bfa

[rcreators]

Hello @wmalexander,

I have refreshed the code and tested it. I can check everything on Playground. Can you try now? If it's still not working for you, click the below link. This will directly open the WP playground with the PR.

​https://playground.wordpress.net/?#%7B%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22landingPage%22:%22/wp-admin%22,%22steps%22:%5B%7B%22step%22:%22mkdir%22,%22path%22:%22/wordpress-new%22%7D,%7B%22step%22:%22writeFile%22,%22path%22:%22/tmp/pr.zip%22,%22data%22:%7B%22resource%22:%22url%22,%22url%22:%22/plugin-proxy.php?org=WordPress&repo=wordpress-develop&workflow=Test%2520Build%2520Processes&artifact=wordpress-build-6238&pr=6238%22,%22caption%22:%22Downloading%20WordPress%20PR%206238%22%7D%7D,%7B%22step%22:%22unzip%22,%22zipPath%22:%22/tmp/pr.zip%22,%22extractToPath%22:%22/tmp%22%7D,%7B%22step%22:%22rm%22,%22path%22:%22/tmp/pr.zip%22%7D,%7B%22step%22:%22importWordPressFiles%22,%22wordPressFilesZip%22:%7B%22resource%22:%22vfs%22,%22path%22:%22/tmp/wordpress.zip%22%7D,%22pathInZip%22:%22/build%22,%22progress%22:%7B%22weight%22:20,%22caption%22:%22Applying%20WordPress%20PR%206238%22%7D%7D,%7B%22step%22:%22runPHP%22,%22code%22:%22%3C?php%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct$_GET%5B'step'%5D%20=%20'upgrade_db';%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctrequire%20'/wordpress/wp-admin/upgrade.php';%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%22%7D,%7B%22step%22:%22login%22,%22username%22:%22admin%22,%22password%22:%22password%22%7D%5D%7D

Found it! The branch name starts with _#_ and we didn't encode the name.

@bgrgicak So do I remove the # from the branch name cause I am using it for all the branches according to ticket no. But if that solves the issue. I will update all branch names.

Wrong place. I wanted to comment on this issue ​https://github.com/WordPress/wordpress-playground/issues/1260.

@bgrgicak So do I remove the # from the branch name cause I am using it for all the branches according to ticket no. But if that solves the issue. I will update all branch names.

No, this PR should fix it ​https://github.com/WordPress/wordpress-playground/pull/1275

[rcreators]

@wmalexander Finally we solved issue with playground. While working on this issue, we solved another bug somewhere else 🙂.

You can test it now. Works great.

[wmalexander]

Yes it is working now - thanks! I will let my colleague know and reply soon with any updates from his testing.

[milamj]

Being able to select the parent is a nice feature, though this can also be done when editing the page itself. Concerning the order, I think it would be more beneficial if additional feedback was provided about the menu items in the order list within that combo box. As it is, 1 of 2 and 2 of 2 is really the only feedback that is provided, which makes it difficult to know to where the menu item is being moved. Also, it would be great if the order combo box was developed so that it didn't immediately change the order when an arrow key is used and only made the change when the enter key was pressed after an item is selected. Alt-DownArrow is a work-around that screen reader users can use to  make this behavior possible, but combo boxes can be built so that this additional keystroke isn't needed.

[sabernhardt]

Moving this to the next cycle can give more time to test and/or improve the experience.