Opened 4 years ago
Last modified 4 years ago
#46976 new defect (bug)
Twenty Nineteen: remove postcss-focus-within
| Reported by: |
|
Owned by: | |
|---|---|---|---|
| Milestone: | Awaiting Review | Priority: | normal |
| Severity: | normal | Version: | 5.0 |
| Component: | Bundled Theme | Keywords: | |
| Focuses: | Cc: |
Description
Maybe I'm missing something but seems to me 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 focus-within JS polyfill which is not used in the theme.
It is supposed to work this way:
postcss-focus-withinprocesses the CSS and duplicates all the:focus-withinrules with rules that use a[focus-within]attribute selectorfocus-withinadds 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 unnecessary.
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.
cc @allancole for a gut check on whether this is necessary or not.