resolves #7 don't intercept key events sent to editable inputs

bespokejs · Aug 11, 2015 · cbbaec4 · cbbaec4
1 parent be9a9d6
commit cbbaec4
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 29 deletions.
diff --git a/dist/bespoke-keys.js b/dist/bespoke-keys.js
@@ -1,5 +1,5 @@
 /*!
- * bespoke-keys v1.0.0
+ * bespoke-keys v1.1.0
  *
  * Copyright 2015, Mark Dalgleish
  * This content is released under the MIT license
@@ -9,20 +9,25 @@
 !function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var n;"undefined"!=typeof window?n=window:"undefined"!=typeof global?n=global:"undefined"!=typeof self&&(n=self);var o=n;o=o.bespoke||(o.bespoke={}),o=o.plugins||(o.plugins={}),o.keys=e()}}(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);throw new Error("Cannot find module '"+o+"'")}var f=n[o]={exports:{}};t[o][0].call(f.exports,function(e){var n=t[o][1][e];return s(n?n:e)},f,f.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(_dereq_,module,exports){
 module.exports = function(options) {
   return function(deck) {
-    var isHorizontal = options !== 'vertical';
+    var isHorizontal = options !== 'vertical',
+      elementIsReadOnly = function(element) {
+        return !(element.readOnly === false || element.isContentEditable);
+      };
 
     document.addEventListener('keydown', function(e) {
-      if (e.which == 34 || // PAGE DOWN
-        (e.which == 32 && !e.shiftKey) || // SPACE WITHOUT SHIFT
-        (isHorizontal && e.which == 39) || // RIGHT
-        (!isHorizontal && e.which == 40) // DOWN
-      ) { deck.next(); }
+      if (elementIsReadOnly(e.target)) {
+        if (e.which == 34 || // PAGE DOWN
+          (e.which == 32 && !e.shiftKey) || // SPACE WITHOUT SHIFT
+          (isHorizontal && e.which == 39) || // RIGHT
+          (!isHorizontal && e.which == 40) // DOWN
+        ) { deck.next(); }
 
-      if (e.which == 33 || // PAGE UP
-        (e.which == 32 && e.shiftKey) || // SPACE + SHIFT
-        (isHorizontal && e.which == 37) || // LEFT
-        (!isHorizontal && e.which == 38) // UP
-      ) { deck.prev(); }
+        if (e.which == 33 || // PAGE UP
+          (e.which == 32 && e.shiftKey) || // SPACE + SHIFT
+          (isHorizontal && e.which == 37) || // LEFT
+          (!isHorizontal && e.which == 38) // UP
+        ) { deck.prev(); }
+      }
     });
   };
 };

diff --git a/dist/bespoke-keys.min.js b/dist/bespoke-keys.min.js
diff --git a/lib/bespoke-keys.js b/lib/bespoke-keys.js
@@ -1,19 +1,24 @@
 module.exports = function(options) {
   return function(deck) {
-    var isHorizontal = options !== 'vertical';
+    var isHorizontal = options !== 'vertical',
+      elementIsReadOnly = function(element) {
+        return !(element.readOnly === false || element.isContentEditable);
+      };
 
     document.addEventListener('keydown', function(e) {
-      if (e.which == 34 || // PAGE DOWN
-        (e.which == 32 && !e.shiftKey) || // SPACE WITHOUT SHIFT
-        (isHorizontal && e.which == 39) || // RIGHT
-        (!isHorizontal && e.which == 40) // DOWN
-      ) { deck.next(); }
+      if (elementIsReadOnly(e.target)) {
+        if (e.which == 34 || // PAGE DOWN
+          (e.which == 32 && !e.shiftKey) || // SPACE WITHOUT SHIFT
+          (isHorizontal && e.which == 39) || // RIGHT
+          (!isHorizontal && e.which == 40) // DOWN
+        ) { deck.next(); }
 
-      if (e.which == 33 || // PAGE UP
-        (e.which == 32 && e.shiftKey) || // SPACE + SHIFT
-        (isHorizontal && e.which == 37) || // LEFT
-        (!isHorizontal && e.which == 38) // UP
-      ) { deck.prev(); }
+        if (e.which == 33 || // PAGE UP
+          (e.which == 32 && e.shiftKey) || // SPACE + SHIFT
+          (isHorizontal && e.which == 37) || // LEFT
+          (!isHorizontal && e.which == 38) // UP
+        ) { deck.prev(); }
+      }
     });
   };
 };
diff --git a/test/spec/bespoke-keysSpec.js b/test/spec/bespoke-keysSpec.js
@@ -7,18 +7,19 @@ describe("bespoke-keys", function() {
     keys = require('../../lib-instrumented/bespoke-keys.js');
 
   var deck,
-
+    inputBox = null,
     createDeck = function(optionValue) {
       var parent = document.createElement('article');
-      parent.innerHTML = '<section></section><section></section>';
+      parent.innerHTML = '<section><input type="text"></section><section></section>';
+      inputBox = parent.querySelector('input');
 
       deck = bespoke.from(parent, [
         keys(optionValue)
       ]);
     },
 
-    pressKey = function(which, isShift) {
-      simulant.fire(document, 'keydown', { which: which, shiftKey: !!isShift });
+    pressKey = function(which, isShift, element) {
+      simulant.fire((element || document), 'keydown', { which: which, shiftKey: !!isShift });
     };
 
   describe("horizontal deck", function() {
@@ -46,6 +47,10 @@ describe("bespoke-keys", function() {
             expect(deck.slide()).toBe(1);
           });
 
+          it("should not go to the next slide when pressing the space bar in an input field", function() {
+            pressKey(32, false, inputBox);
+            expect(deck.slide()).toBe(0);
+          });
         });
 
         describe("previous slide", function() {