Add test for :focus-visible and fix wrong references in :focus-within (…

…Modernizr#2665) * Create focusvisible.js * Fix wrong reference to CSS focus-within feature * Fix wrong reference for CSS focus-within feature * Add css-focus-visible to caniuse integration tests * Include focusvisible in config-all.json * Add authors tag to focusvisible.js
TusharNaugain · Oct 14, 2021 · a8a24bf · a8a24bf
1 parent 049b6ca
commit a8a24bf
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 2 deletions.
diff --git a/feature-detects/css/focusvisible.js b/feature-detects/css/focusvisible.js
@@ -0,0 +1,19 @@
+/*!
+{
+  "name": "CSS :focus-visible pseudo-selector",
+  "caniuse": "css-focus-visible",
+  "property": "focusvisible",  
+  "authors": ["@esaborit4code"],
+  "tags": ["css"]
+}
+!*/
+define(['Modernizr'], function(Modernizr) {
+  Modernizr.addTest('focusvisible', function() {
+    try {
+      document.querySelector(':focus-visible');
+    } catch (error) {
+      return false;
+    }
+    return true;
+  });
+});
diff --git a/feature-detects/css/focuswithin.js b/feature-detects/css/focuswithin.js
@@ -1,7 +1,7 @@
 /*!
 {
   "name": "CSS :focus-within pseudo-selector",
-  "caniuse": "css-focus-visible",
+  "caniuse": "css-focus-within",
   "property": "focuswithin",
   "tags": ["css"]
 }

diff --git a/lib/config-all.json b/lib/config-all.json
@@ -81,6 +81,7 @@
     "css/flexboxtweener",
     "css/flexgap",
     "css/flexwrap",
+    "css/focusvisible",
     "css/focuswithin",
     "css/fontdisplay",
     "css/fontface",

diff --git a/test/browser/integration/caniuse.js b/test/browser/integration/caniuse.js
@@ -83,7 +83,8 @@ window.caniusecb = function(caniuse) {
       flexbox: 'flexbox',
       flexboxlegacy: 'flexbox',
       flexboxtweener: 'flexbox',
-      focuswithin: 'css-focus-visible',
+      focusvisible: 'css-focus-visible',
+      focuswithin: 'css-focus-within',
       fontdisplay: 'css-font-rendering-controls',
       fontface: 'fontface',
       formvalidationapi: 'form-validation',