arrow-key-navigation - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist-node/index.js

@@ -11,5 +11,10 @@ 'use strict';
 /* global document, addEventListener, removeEventListener, getSelection */
-// this query is adapted from via a11y-dialog
-var focusablesQuery = 'a[href], area[href], input, select, textarea, ' + 'button, iframe, object, embed, [contenteditable], [tabindex], video[controls], audio[controls]';
-var textInputTypes = ['text', 'search', 'number', 'email', 'url'];
+// This query is adapted from a11y-dialog
+// https://github.com/edenspiekermann/a11y-dialog/blob/cf4ed81/a11y-dialog.js#L6-L18
+var focusablesQuery = 'a[href], area[href], input, select, textarea, ' + 'button, iframe, object, embed, [contenteditable], [tabindex], video[controls], audio[controls]'; // TODO: email/number types are a special type, in that they return selectionStart/selectionEnd as null
+// As far as I can tell, there is no way to actually get the caret position from these inputs. So we
+// don't do the proper caret handling for those inputs, unfortunately.
+// https://html.spec.whatwg.org/multipage/input.html#do-not-apply
+
+var textInputTypes = ['text', 'search', 'url', 'password', 'tel'];
 var checkboxRadioInputTypes = ['checkbox', 'radio'];
@@ -29,3 +34,4 @@ var focusTrapTest = undefined;
 
-    if (element === activeElement || !element.disabled && !/^-/.test(element.getAttribute('tabindex') || '') && (element.offsetWidth > 0 || element.offsetHeight > 0)) {
+    if (element === activeElement || !element.disabled && !/^-/.test(element.getAttribute('tabindex') || '') && !element.hasAttribute('inert') && ( // see https://github.com/GoogleChrome/inert-polyfill
+    element.offsetWidth > 0 || element.offsetHeight > 0)) {
       res.push(element);
@@ -32,0 +38,0 @@ }

dist-src/index.js

@@ -6,6 +6,11 @@ /**
 /* global document, addEventListener, removeEventListener, getSelection */
-// this query is adapted from via a11y-dialog
+// This query is adapted from a11y-dialog
+// https://github.com/edenspiekermann/a11y-dialog/blob/cf4ed81/a11y-dialog.js#L6-L18
 var focusablesQuery = 'a[href], area[href], input, select, textarea, ' +
     'button, iframe, object, embed, [contenteditable], [tabindex], video[controls], audio[controls]';
-var textInputTypes = ['text', 'search', 'number', 'email', 'url'];
+// TODO: email/number types are a special type, in that they return selectionStart/selectionEnd as null
+// As far as I can tell, there is no way to actually get the caret position from these inputs. So we
+// don't do the proper caret handling for those inputs, unfortunately.
+// https://html.spec.whatwg.org/multipage/input.html#do-not-apply
+var textInputTypes = ['text', 'search', 'url', 'password', 'tel'];
 var checkboxRadioInputTypes = ['checkbox', 'radio'];
@@ -22,3 +27,5 @@ var focusTrapTest = undefined;
         var element = elements[i];
-        if (element === activeElement || (!element.disabled && !/^-/.test(element.getAttribute('tabindex') || '') &&
+        if (element === activeElement || (!element.disabled &&
+            !/^-/.test(element.getAttribute('tabindex') || '') &&
+            !element.hasAttribute('inert') && // see https://github.com/GoogleChrome/inert-polyfill
             (element.offsetWidth > 0 || element.offsetHeight > 0))) {
@@ -25,0 +32,0 @@ res.push(element);

dist-web/index.js

@@ -6,6 +6,11 @@ /**
 /* global document, addEventListener, removeEventListener, getSelection */
-// this query is adapted from via a11y-dialog
+// This query is adapted from a11y-dialog
+// https://github.com/edenspiekermann/a11y-dialog/blob/cf4ed81/a11y-dialog.js#L6-L18
 var focusablesQuery = 'a[href], area[href], input, select, textarea, ' +
     'button, iframe, object, embed, [contenteditable], [tabindex], video[controls], audio[controls]';
-var textInputTypes = ['text', 'search', 'number', 'email', 'url'];
+// TODO: email/number types are a special type, in that they return selectionStart/selectionEnd as null
+// As far as I can tell, there is no way to actually get the caret position from these inputs. So we
+// don't do the proper caret handling for those inputs, unfortunately.
+// https://html.spec.whatwg.org/multipage/input.html#do-not-apply
+var textInputTypes = ['text', 'search', 'url', 'password', 'tel'];
 var checkboxRadioInputTypes = ['checkbox', 'radio'];
@@ -22,3 +27,5 @@ var focusTrapTest = undefined;
         var element = elements[i];
-        if (element === activeElement || (!element.disabled && !/^-/.test(element.getAttribute('tabindex') || '') &&
+        if (element === activeElement || (!element.disabled &&
+            !/^-/.test(element.getAttribute('tabindex') || '') &&
+            !element.hasAttribute('inert') && // see https://github.com/GoogleChrome/inert-polyfill
             (element.offsetWidth > 0 || element.offsetHeight > 0))) {
@@ -25,0 +32,0 @@ res.push(element);

package.json

 {
   "name": "arrow-key-navigation",
   "description": "Add left/right key navigation to a KaiOS app or web app",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "license": "Apache-2.0",
@@ -6,0 +6,0 @@ "files": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

51233

increased by5.71%

Lines of code

463

increased by4.28%

No dependency changes