如何简洁获取文档中所有可Tab导航/可聚焦元素？

我正在优化Web应用的可访问性，希望遍历所有潜在的可Tab导航/可聚焦元素。注意到jQuery有专属伪选择器:tabbable但并非原生实现，且我不打算使用jQuery。

参考了两篇博客的方案：

• 2017-07-17：《如何获取DOM中第一个和最后一个可聚焦元素》
• 2020-01-29：《获取键盘可聚焦元素》

它们的类似实现代码为：

const keyboardfocusableElements = document.querySelectorAll(
  'a[href], button, input, textarea, select, details, [tabindex]'
);

我尝试扩展元素列表至：audio、button、canvas、details、iframe、input、select、summary、textarea、video、[accesskey]、[contenteditable]、[href]、[tabindex]，实现代码为：

const tabbableElements = document.querySelectorAll(
  'audio, button, canvas, details, iframe, input, select, summary, textarea, video, [accesskey], [contenteditable], [href], [tabindex]'
);

但该实现不够优雅，想询问是否存在更简洁的实现方式，比如CSS Level 4伪选择器？

内容的提问来源于stack exchange，提问作者Rounin