WordPress.org

Make WordPress Core

Opened 6 months ago

Closed 5 months ago

#49517 closed defect (bug) (reported-upstream)

Regression: the block editor toolbar visual order and DOM order mismatch

Reported by: afercia Owned by:
Milestone: 5.4 Priority: normal
Severity: normal Version: 5.4
Component: Editor Keywords: needs-patch has-screenshots
Focuses: accessibility Cc:

Description

This change in the block editor: https://github.com/WordPress/gutenberg/pull/19623 changed the order of the main containers within the editor toolbar.

The visual order and the DOM order now mismatch, which is a serious WCAG failure.

CSS properties that alter the visual order of elements should rarely, if ever, be used. In this case, the DOM order of edit-post-header__toolbar and edit-post-header__settings was swapped. Then, the visual order is changed by the means of the flex property flex-direction: row-reverse;.

More details: https://github.com/WordPress/gutenberg/pull/19623#issuecomment-591503443

This should be reverted soon as it's a serious accessibility regression compared to WordPress 5.3.2.

Also, it doesn't work in Internet Explorer 11 :) Screenshot incoming.

Attachments (2)

order in chrome.png (130.7 KB) - added by afercia 6 months ago.
Elements order in modern browsers (Chrome)
order in IE11.png (62.8 KB) - added by afercia 6 months ago.
Elements order in Internet Explorer 11

Download all attachments as: .zip

Change History (6)

@afercia
6 months ago

Elements order in modern browsers (Chrome)

@afercia
6 months ago

Elements order in Internet Explorer 11

#1 @afercia
6 months ago

  • Keywords has-screenshots added

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


6 months ago

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


6 months ago

#4 @jorgefilipecosta
5 months ago

  • Resolution set to reported-upstream
  • Status changed from new to closed

Thank you for reporting this issue @afercia! I'm closing this ticket as https://github.com/WordPress/gutenberg/pull/19623 was reverted.

Note: See TracTickets for help on using tickets.