[csswg-drafts] [selectors] `:focusable` pseudo-class (#7269)

LeaVerou has just created a new issue for https://github.com/w3c/csswg-drafts:

== [selectors] `:focusable` pseudo-class ==
I was reading [this article](https://www.smashingmagazine.com/2022/04/cta-modal-build-web-component/) and I reached this gem:

```js
const FOCUSABLE_SELECTORS = [
  '[contenteditable]',
  '[tabindex="0"]:not([disabled])',
  'a[href]',
  'audio[controls]',
  'button:not([disabled])',
  'iframe',
  "input:not([disabled]):not([type='hidden'])",
  'select:not([disabled])',
  'summary',
  'textarea:not([disabled])',
  'video[controls]',
].join(',');
```

Authors should not have to do all this just to target focusable elements. Adding a pseudo-class for focusability seems like pretty low-hanging fruit (so low-hanging that I'd swear I've seen it discussed before, but I couldn't find anything so…)

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7269 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 11 May 2022 15:37:08 UTC