Make WordPress Core

Opened 8 years ago

Last modified 7 months ago

#42822 new defect (bug)

CodeMirror: HTML attributes values hints not fully operable with a keyboard

Reported by: afercia's profile afercia Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 4.9
Component: Widgets Keywords: has-screenshots needs-patch needs-test-info
Focuses: accessibility, javascript Cc:

Description

To reproduce, add an HTML widget either in the Widgets screen or in the Customizer:

  • start typing a HTML tag, for example "<i" for an input field:

https://cldup.com/BYoQlC_wZw.png

  • a list of hints appears and it is possible to use the down and up arrow keys to select one of the hints in the list, pressing Enter inserts the tag
  • after the input, start typing the "type" attribute followed by a "="
  • a list of possible values for the type attribute appears
  • press the down arrow key to try to select one of the hints
  • as soon as you release the down arrow key (on keyup), the selection moves back to the first hint thus making impossible to select any of the other hints

https://cldup.com/AGpOpY5-ZN.png

Worth noting:

  • typing a letter after the "=" seems to make selection via arrow keys work again, for example type type=t and selection via keyboard works
  • seems the attribute values hints don't work at all in the theme/plugin editors, where typing for example <input type= does nothing
  • doesn't seem to happen in the Additional CSS in the Customizer, where all the hints appear to be operable with a keyboard

I'm really not sure if this is related to something specific to the HTML widget or if it's something that should be fixed upstream. Setting the "Widgets" component for now.

Change History (7)

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


8 years ago

#2 @afercia
8 years ago

  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to Future Release

Agreed during today's bug-scrub this is something that should be fixed, hopefully by someone more familiar with CodeMirror and the HTML widget. Moving to future release. /cc @westonruter

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


8 years ago

This ticket was mentioned in Slack in #accessibility by rianrietveld. View the logs.


7 years ago

This ticket was mentioned in Slack in #core by jorbin. View the logs.


7 months ago

#6 follow-up: @jorbin
7 months ago

  • Keywords needs-testing added

There is some hope that this is fixed upstream in CodeMirror which #48456 aims to upgrade. That's not a small task and will require an owner to see it through. Alternatively, it may make sense to move to something else entirely (see GB#10423) for the project. Also, this is not currently the default experience, it's only the experience if you install the classic widgets plugin.

This also seems to be inconsistent and could use more testing to reliably determine in what cases this takes place (is it just widgets? Is it the theme/plugin editor as well?)

#7 in reply to: ↑ 6 @SirLouen
7 months ago

  • Keywords needs-test-info added; needs-testing removed

Replying to jorbin:

This also seems to be inconsistent and could use more testing to reliably determine in what cases this takes place (is it just widgets? Is it the theme/plugin editor as well?)

Wrong workflow keyword, I think you meant, needs-test-info (aka we need more use-cases). Switching.

Note: See TracTickets for help on using tickets.