v3.0.0
版本发布时间: 2017-11-16 09:00:35
WICG/focus-visible最新发布版本:v5.2.1(2024-08-13 01:18:02)
This is a fairly minor release in that it does not radically alter the behavior of the polyfill. However there are a couple breaking changes (detailed below) which required us to bump the major version.
🚧 Breaking Changes 🚧
No longer bundling other polyfills
The :focus-ring
polyfill uses the Element.classList API which is not supported in IE 8-9. In accordance with the W3C's new Polyfill guidance, the :focus-ring
polyfill no longer bundles other polyfills so the classList
polyfill was removed. This avoids loading unnecessary or duplicate polyfills.
If you need to support these older browsers you should add the classList polyfill to your page before loading the :focus-ring
polyfill. Using a service like Polyfill.io will handle feature detecting and loading the necessary polyfills for you:
<script src="https://cdn.polyfill.io/v2/polyfill.js?features=Element.prototype.classList"></script>
Ignoring the dist/
directory
Previously we checked in a built version of the :focus-ring
polyfill in the dist/
dir. This was to make it easier to link to in our demo and because we weren't entirely sure what was the best process to publish to npm. This ended up causing a lot of annoying PR churn because every change necessitated rebuilding dist/focus-ring.js
and committing it. Having dist
checked in was also dangerous because our master branch is not guaranteed to be stable.
To fix this we've redone our demo so it now points at the latest version of the polyfill on unkpg. While we have always encouraged folks to use the polyfill by installing it from npm, we've taken this a step further and removed the dist
directory from the repo. We strongly encourage you to only use versions of the polyfill that have been published to npm. This ensures that they've been properly tested and we're confident in releasing them. If you really want to build from source and check that version into your project, be sure you clone a recent tag.
Other Changes 📌
- Radio buttons should now properly apply the
.focus-ring
class when moving focus with the arrow keys. - Fixed a nasty bug where the
.focus-ring
class was not applied if the user tabbed from the URL bar to an interactive element. - Tests! So many tests! We've added a full suit of selenium tests to verify that
:focus-ring
behaves as expected.