[wp-trac] [WordPress Trac] #46976: Twenty Nineteen: remove postcss-focus-within

WordPress Trac noreply at wordpress.org
Thu Apr 18 10:22:35 UTC 2019

#46976: Twenty Nineteen: remove postcss-focus-within
 Reporter:  afercia        |      Owner:  (none)
     Type:  defect (bug)   |     Status:  new
 Priority:  normal         |  Milestone:  Awaiting Review
Component:  Bundled Theme  |    Version:  5.0
 Severity:  normal         |   Keywords:
  Focuses:                 |
 Maybe I'm missing something but seems to me
 [https://github.com/jonathantneal/postcss-focus-within postcss-focus-
 within] added in https://github.com/WordPress/twentynineteen/pull/392
 doesn't do anything.

 It's supposed to be used together with its companion
 [https://github.com/jonathantneal/focus-within focus-within JS polyfill]
 which is not used in the theme.

 It is supposed to work this way:
 - `postcss-focus-within` processes the CSS and duplicates all the `:focus-
 within` rules with rules that use a `[focus-within]` attribute selector
 - `focus-within` adds the `[focus-within]` data-attribute in the DOM

 As Twenty Nineteen doesn't use `focus-within`, there are no `[focus-
 within]` data-attributes in the DOM.

 However, all the related CSS rules are in the stylesheet and appear to be

 Worth noting that to make the nav menu work in IE 11, a custom solution
 has been implemented in `touch-keyboard-navigation.js` which uses an `is-
 focused` CSS class.

 Also, ideally the `is-focused` CSS class should be added in the DOM only
 for browsers that don't support `:focus-within`.

Ticket URL: <https://core.trac.wordpress.org/ticket/46976>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform

More information about the wp-trac mailing list