Add keyboard edit shortcut for wiki

app/assets/javascripts/dispatcher.js

@@ -33,6 +33,7 @@
 /* global Labels */
 /* global Shortcuts */
 /* global Sidebar */
+/* global ShortcutsWiki */
 import Issue from './issue';
@@ -416,7 +417,7 @@ const ShortcutsBlob = require('./shortcuts_blob');
               break;
             case 'wikis':
               new gl.Wikis();
-              shortcut_handler = new ShortcutsNavigation();
+              shortcut_handler = new ShortcutsWiki();
               new ZenMode();
               new gl.GLForm($('.wiki-form'));
               break;

app/assets/javascripts/main.js

@@ -35,6 +35,7 @@ import './shortcuts_navigation';
 import './shortcuts_find_file';
 import './shortcuts_issuable';
 import './shortcuts_network';
+import './shortcuts_wiki';
 // behaviors
 import './behaviors/';

app/assets/javascripts/shortcuts_wiki.js

+/* eslint-disable func-names, space-before-function-paren, max-len, no-var, one-var, no-restricted-syntax, vars-on-top, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, wrap-iife, one-var-declaration-per-line, quotes, prefer-arrow-callback, consistent-return, prefer-template, no-mixed-operators */
+/* global Mousetrap */
+/* global ShortcutsNavigation */
+
+require('mousetrap');
+require('./shortcuts_navigation');
+
+(function() {
+  var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
+    hasProp = {}.hasOwnProperty;
+
+  this.ShortcutsWiki = (function(superClass) {
+    extend(ShortcutsWiki, superClass);
+
+    function ShortcutsWiki() {
+      ShortcutsWiki.__super__.constructor.call(this);
+      Mousetrap.bind('e', (function(_this) {
+        return function() {
+          _this.editWiki();
+          return false;
+        };
+      })(this));
+    }
+
+    ShortcutsWiki.prototype.editWiki = function() {
+      var $editBtn;
+      $editBtn = $('.wiki-edit');
+      return gl.utils.visitUrl($editBtn.attr('href'));
+    };
+    return ShortcutsWiki;
+  })(ShortcutsNavigation);
+}).call(window);

app/views/help/_shortcuts.html.haml

@@ -105,6 +105,23 @@
                   %td.shortcut
                     .key esc
                   %td Go back
+              %tbody
+                %tr
+                  %th
+                  %th Project File
+                %tr
+                  %td.shortcut
+                    .key y
+                  %td Go to file permalink
+              %tbody.hidden-shortcut.merge_requests{ style: 'display:none' }
+                %tr
+                  %th
+                  %th Wiki pages
+                %tr
+                  %td.shortcut
+                    .key e
+                  %td Edit wiki page
+                %tr
           .col-lg-4
             %table.shortcut-mappings
               %tbody

app/views/projects/wikis/_main_links.html.haml

@@ -5,5 +5,5 @@
   = link_to namespace_project_wiki_history_path(@project.namespace, @project, @page), class: "btn" do
     Page history
   - if can?(current_user, :create_wiki, @project) && @page.latest?
-    = link_to namespace_project_wiki_edit_path(@project.namespace, @project, @page), class: "btn" do
+    = link_to namespace_project_wiki_edit_path(@project.namespace, @project, @page), class: "btn wiki-edit" do
       Edit

changelogs/unreleased/29816-create-keyboard-shortcut-for-editing-wiki-page.yml

+---
+title: Add keyboard edit shotcut for wiki
+merge_request: 10245
+author: George Andrinopoulos

doc/workflow/shortcuts.md

@@ -75,3 +75,9 @@ You can see GitLab's keyboard shortcuts by using 'shift + ?'
 | <kbd>r</kbd> | Reply (quoting selected text) |
 | <kbd>e</kbd> | Edit issue/merge request |
 | <kbd>l</kbd> | Change label |
+
+## Wiki pages
+
+| Keyboard Shortcut | Description |
+| ----------------- | ----------- |
+| <kbd>e</kbd> | Edit wiki page|

spec/features/projects/wiki/shortcuts_spec.rb

+require 'spec_helper'
+
+feature 'Wiki shortcuts', :feature, :js do
+  let(:user) { create(:user) }
+  let(:project) { create(:empty_project, namespace: user.namespace) }
+  let(:wiki_page) do
+    WikiPages::CreateService.new(project, user, title: 'home', content: 'Home page').execute
+  end
+
+  before do
+    login_as(user)
+    visit namespace_project_wiki_path(project.namespace, project, wiki_page)
+  end
+
+  scenario 'Visit edit wiki page using "e" heyboard shortcut' do
+    find('body').native.send_key('e')
+
+    expect(find('.wiki-page-title')).to have_content('Edit Page')
+  end
+end