我正在创建一个表单，它遵循一些 WCAG 准则。其中之一是：
G165：使用平台的默认焦点指示器，以便继承高可见度的默认焦点指示器 https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G165.
这条规则的总结是：
操作系统具有本机焦点指示，这在许多用户代理中都可用。焦点指示器的默认渲染并不总是高度可见，甚至在某些背景下可能很难看到。然而，许多平台允许用户自定义该焦点指示器的呈现。辅助技术还可以改变原生焦点指示器的外观。如果您使用本机焦点指示器，则其可见性的任何系统范围设置都将转移到网页。如果您绘制自己的焦点指示器，例如通过为页面的各个部分着色以响应用户操作，这些设置将不会保留，并且 AT 通常无法找到您的焦点指示器。
(emphasis mine)
为了遵守此规则，我想保留操作系统对表单元素的默认焦点指示器。
然而，我在这里面临着不同的问题。
在 macOS 上的 Firefox 中：
As soon as the I change the style of the element (e.g. by changing the border settings), the default focus gets lost1.
这很奇怪，因为border and outline是不同的风格属性。
在 Windows 上的 Firefox 和 Edge 中：
The browsers show a focus indicator that is only a differently colored border, when entering a form element – as long as it's unstyled. Chrome on the other hand does have an indicator as an outline – like on macOS2.
这是演示该行为的片段（或者尝试这个fiddle https://jsfiddle.net/kL0t7pjh/):
.b {
border: 1px solid red;
}
<form>
<input class="a" type="text">
<input class="b" type="text">
</form>
作为旁注：如果label- 元素存在或不存在。
我的问题是：
- 为什么 Firefox 和 Edge 在 macOS 和 Windows 上的反应如此？为什么他们使用边框而不是文档的轮廓？
- 即使应用了自定义样式，如何强制这些浏览器显示操作系统的默认焦点指示器？
- 当有人创建了自定义指示器时，即使默认指示器不再显示，它是否仍会显示在 Firefox 和 Edge 中？
带着这些问题，我想知道这个规则是否有可能实现。最后也许我必须手动设置outline on focus在所有浏览器中获得相同的行为并跳过此规则。
1 Here's a screenshot showing the problem on macOS:
2 Here's a screenshot showing the problem on Windows:
