1 files changed, 78 insertions, 7 deletions

diff --git a/spec/frontend/shortcuts_spec.js b/spec/frontend/shortcuts_spec.js
index 3d16074154c..538b3afa50f 100644
--- a/spec/frontend/shortcuts_spec.js
+++ b/spec/frontend/shortcuts_spec.js
@@ -1,6 +1,18 @@
 import $ from 'jquery';
+import { flatten } from 'lodash';
 import Shortcuts from '~/behaviors/shortcuts/shortcuts';
 
+const mockMousetrap = {
+  bind: jest.fn(),
+  unbind: jest.fn(),
+};
+
+jest.mock('mousetrap', () => {
+  return jest.fn().mockImplementation(() => mockMousetrap);
+});
+
+jest.mock('mousetrap/plugins/pause/mousetrap-pause', () => {});
+
 describe('Shortcuts', () => {
   const fixtureName = 'snippets/show.html';
   const createEvent = (type, target) =>
@@ -10,16 +22,16 @@ describe('Shortcuts', () => {
 
   preloadFixtures(fixtureName);
 
-  describe('toggleMarkdownPreview', () => {
-    beforeEach(() => {
-      loadFixtures(fixtureName);
+  beforeEach(() => {
+    loadFixtures(fixtureName);
 
-      jest.spyOn(document.querySelector('.js-new-note-form .js-md-preview-button'), 'focus');
-      jest.spyOn(document.querySelector('.edit-note .js-md-preview-button'), 'focus');
+    jest.spyOn(document.querySelector('.js-new-note-form .js-md-preview-button'), 'focus');
+    jest.spyOn(document.querySelector('.edit-note .js-md-preview-button'), 'focus');
 
-      new Shortcuts(); // eslint-disable-line no-new
-    });
+    new Shortcuts(); // eslint-disable-line no-new
+  });
 
+  describe('toggleMarkdownPreview', () => {
     it('focuses preview button in form', () => {
       Shortcuts.toggleMarkdownPreview(
         createEvent('KeyboardEvent', document.querySelector('.js-new-note-form .js-note-text')),
@@ -43,4 +55,63 @@ describe('Shortcuts', () => {
       expect(document.querySelector('.edit-note .js-md-preview-button').focus).toHaveBeenCalled();
     });
   });
+
+  describe('markdown shortcuts', () => {
+    let shortcuts;
+
+    beforeEach(() => {
+      // Get all shortcuts specified with md-shortcuts attributes in the fixture.
+      // `shortcuts` will look something like this:
+      // [
+      //   [ 'mod+b' ],
+      //   [ 'mod+i' ],
+      //   [ 'mod+k' ]
+      // ]
+      shortcuts = $('.edit-note .js-md')
+        .map(function getShortcutsFromToolbarBtn() {
+          const mdShortcuts = $(this).data('md-shortcuts');
+
+          // jQuery.map() automatically unwraps arrays, so we
+          // have to double wrap the array to counteract this:
+          // https://stackoverflow.com/a/4875669/1063392
+          return mdShortcuts ? [mdShortcuts] : undefined;
+        })
+        .get();
+    });
+
+    describe('initMarkdownEditorShortcuts', () => {
+      beforeEach(() => {
+        Shortcuts.initMarkdownEditorShortcuts($('.edit-note textarea'));
+      });
+
+      it('attaches a Mousetrap handler for every markdown shortcut specified with md-shortcuts', () => {
+        const expectedCalls = shortcuts.map(s => [s, expect.any(Function)]);
+
+        expect(mockMousetrap.bind.mock.calls).toEqual(expectedCalls);
+      });
+
+      it('attaches a stopCallback that allows each markdown shortcut specified with md-shortcuts', () => {
+        flatten(shortcuts).forEach(s => {
+          expect(mockMousetrap.stopCallback(null, null, s)).toBe(false);
+        });
+      });
+    });
+
+    describe('removeMarkdownEditorShortcuts', () => {
+      it('does nothing if initMarkdownEditorShortcuts was not previous called', () => {
+        Shortcuts.removeMarkdownEditorShortcuts($('.edit-note textarea'));
+
+        expect(mockMousetrap.unbind.mock.calls).toEqual([]);
+      });
+
+      it('removes Mousetrap handlers for every markdown shortcut specified with md-shortcuts', () => {
+        Shortcuts.initMarkdownEditorShortcuts($('.edit-note textarea'));
+        Shortcuts.removeMarkdownEditorShortcuts($('.edit-note textarea'));
+
+        const expectedCalls = shortcuts.map(s => [s]);
+
+        expect(mockMousetrap.unbind.mock.calls).toEqual(expectedCalls);
+      });
+    });
+  });
 });