Only take out one key of the sequence instead of resetting it completely

Issue #1283

src/components/Shortcuts/ShortcutProvider.js

@@ -40,7 +40,9 @@ export default class ShortcutProvider extends Component {
     }
 
     handleKeyDown = event => {
-        const { key } = event;
+        /* .toUpperCase() is essential to normalize all keys when dealing with
+         * combinations containing the SHIFT key */
+        const key = event.key.toUpperCase();
         const { keySequence, fired } = this;
         const { hotkeys } = this.props;
 
@@ -73,9 +75,16 @@ export default class ShortcutProvider extends Component {
         console.warn(`Handler defined for key sequence "${serializedSequence}" is not a function.`, handler);
     };
 
-    handleKeyUp = () => {
-        this.keySequence = [];
-        this.fired = {};
+    handleKeyUp = event => {
+        /* .toUpperCase() is essential to normalize all keys when dealing with
+         * combinations containing the SHIFT key */
+        const key = event.key.toUpperCase();
+
+        this.keySequence = this.keySequence.filter(
+            _key => _key !== key
+        );
+
+        delete this.fired[key];
     };
 
     handleBlur = () => {

src/components/Shortcuts/ShortcutProvider.test.js

@@ -236,19 +236,42 @@ describe('ShortcutProvider', () => {
             const shortcutProvider = new ShortcutProvider;
             shortcutProvider.props = { hotkeys: {} };
 
-            const key = 'a';
+            const key = 'A';
 
             expect(shortcutProvider.fired[key]).to.equal(undefined);
 
             shortcutProvider.handleKeyDown({ key });
 
             expect(shortcutProvider.fired[key]).to.equal(true);
-            expect(shortcutProvider.keySequence).to.deep.equal(['a']);
+            expect(shortcutProvider.keySequence).to.deep.equal(['A']);
 
             shortcutProvider.handleKeyDown({ key });
 
             expect(shortcutProvider.fired[key]).to.equal(true);
-            expect(shortcutProvider.keySequence).to.deep.equal(['a']);
+            expect(shortcutProvider.keySequence).to.deep.equal(['A']);
+        });
+
+        it('should handle differently capitalized keys the same', () => {
+            const shortcutProvider = new ShortcutProvider;
+            shortcutProvider.props = { hotkeys: {} };
+
+            const keyLowerCase = 'a';
+            const keyUpperCase = 'A';
+
+            expect(shortcutProvider.fired[keyLowerCase]).to.equal(undefined);
+            expect(shortcutProvider.fired[keyUpperCase]).to.equal(undefined);
+
+            shortcutProvider.handleKeyDown({ key: keyUpperCase });
+
+            expect(shortcutProvider.fired[keyLowerCase]).to.equal(undefined);
+            expect(shortcutProvider.fired[keyUpperCase]).to.equal(true);
+            expect(shortcutProvider.keySequence).to.deep.equal(['A']);
+
+            shortcutProvider.handleKeyDown({ key: keyLowerCase });
+
+            expect(shortcutProvider.fired[keyLowerCase]).to.equal(undefined);
+            expect(shortcutProvider.fired[keyUpperCase]).to.equal(true);
+            expect(shortcutProvider.keySequence).to.deep.equal(['A']);
         });
 
         it('should call latest registered handler for that hotkey', () => {
@@ -320,6 +343,31 @@ describe('ShortcutProvider', () => {
         });
     });
 
+    describe('handleKeyUp', () => {
+        it('should take key out of sequence', () => {
+            const shortcutProvider = new ShortcutProvider;
+
+            const key1 = 'A';
+            const key2 = 'B';
+            const key3 = 'C';
+
+            shortcutProvider.keySequence = [ key1, key2, key3 ];
+            shortcutProvider.fired = {
+                [key1]: true,
+                [key2]: true,
+                [key3]: true
+            };
+
+            shortcutProvider.handleKeyUp({ key: key2 });
+
+            expect(shortcutProvider.keySequence).to.deep.equal([ key1, key3 ]);
+            expect(shortcutProvider.fired).to.deep.equal({
+                [key1]: true,
+                [key3]: true
+            });
+        });
+    });
+
     describe('handleBlur', () => {
         it('should reset key sequence', () => {
             const shortcutProvider = new ShortcutProvider;