Add keyboard shortcuts for expanding and collapsing all messages

This change adds keyboard shortcuts for expanding and collapsing all
messages on change views for feature parody with the GWT UI.

The 'x' key expands all comments, and the 'z' key collapses all
comments.  In addition, the expand all/collapse all text on toggle
button changes when the keyboard shortcuts are pressed (i.e. when x is
clicked and all messages expand, the text will change to 'Collapse
All').

Bug: Issue 5193
Change-Id: Ia60abe22eec3ef9b4ab5baebdb74d13f3efa8eeb

polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.js

@@ -128,6 +128,8 @@
       'a': '_handleAKey',
       'd': '_handleDKey',
       'u': '_handleUKey',
+      'x': '_handleXKey',
+      'z': '_handleZKey',
     },
 
     attached: function() {
@@ -643,6 +645,22 @@
       this._determinePageBack();
     },
 
+    _handleXKey: function(e) {
+      if (this.shouldSuppressKeyboardShortcut(e) ||
+          this.modifierPressed(e)) { return; }
+
+      e.preventDefault();
+      this.$.messageList.handleExpandCollapse(true);
+    },
+
+    _handleZKey: function(e) {
+      if (this.shouldSuppressKeyboardShortcut(e) ||
+          this.modifierPressed(e)) { return; }
+
+      e.preventDefault();
+      this.$.messageList.handleExpandCollapse(false);
+    },
+
     _determinePageBack: function() {
       // Default backPage to '/' if user came to change view page
       // via an email link, etc.

polygerrit-ui/app/elements/change/gr-change-view/gr-change-view_test.html

@@ -79,6 +79,20 @@ limitations under the License.
         assert.isFalse(overlayEl.opened);
       });
 
+      test('X should expand all messages', function() {
+        var handleExpand =
+            sandbox.stub(element.$.messageList, 'handleExpandCollapse');
+        MockInteractions.pressAndReleaseKeyOn(element, 88, null, 'x');
+        assert(handleExpand.calledWith(true));
+      });
+
+      test('Z should collapse all messages', function() {
+         var handleExpand =
+            sandbox.stub(element.$.messageList, 'handleExpandCollapse');
+        MockInteractions.pressAndReleaseKeyOn(element, 90, null, 'z');
+        assert(handleExpand.calledWith(false));
+      });
+
       test('shift + R should fetch and navigate to the latest patch set',
           function(done) {
         element._changeNum = '42';

polygerrit-ui/app/elements/change/gr-messages-list/gr-messages-list.js

@@ -106,15 +106,22 @@
       el.classList.add('highlighted');
     },
 
-    _handleExpandCollapseTap: function(e) {
-      e.preventDefault();
-      this._expanded = !this._expanded;
+    /**
+    * @param {boolean} expand
+    */
+    handleExpandCollapse: function(expand) {
+      this._expanded = expand;
       var messageEls = Polymer.dom(this.root).querySelectorAll('gr-message');
       for (var i = 0; i < messageEls.length; i++) {
-        messageEls[i].expanded = this._expanded;
+        messageEls[i].expanded = expand;
       }
     },
 
+    _handleExpandCollapseTap: function(e) {
+      e.preventDefault();
+      this.handleExpandCollapse(!this._expanded);
+    },
+
     _handleAutomatedMessageToggleTap: function(e) {
       e.preventDefault();
       this._hideAutomated = !this._hideAutomated;

polygerrit-ui/app/elements/change/gr-messages-list/gr-messages-list_test.html

@@ -86,6 +86,29 @@ limitations under the License.
       }
     });
 
+    test('expand/collapse from external keypress', function() {
+      element.handleExpandCollapse(true);
+      var allMessageEls =
+          Polymer.dom(element.root).querySelectorAll('gr-message');
+      for (var i = 0; i < allMessageEls.length; i++) {
+        assert.isTrue(allMessageEls[i].expanded);
+      }
+
+      // Expand/collapse all text also changes.
+      assert.equal(element.$$('#collapse-messages').textContent.trim(),
+        'Collapse all');
+
+      element.handleExpandCollapse(false);
+      var allMessageEls =
+          Polymer.dom(element.root).querySelectorAll('gr-message');
+      for (var i = 0; i < allMessageEls.length; i++) {
+        assert.isFalse(allMessageEls[i].expanded);
+      }
+      // Expand/collapse all text also changes.
+      assert.equal(element.$$('#collapse-messages').textContent.trim(),
+        'Expand all');
+    });
+
     test('hide messages does not appear when no automated messages',
         function() {
       assert.isOk(element.$$('#automatedMessageToggleContainer[hidden]'));