Bug 1530341 - (Part 2) Add Copy All Changes button to Changes panel. r=gl

Depends on D20808

Adds a Copy All Changes button to the toolbar of the Changes panel.
When pressed, this builds a stylesheet out of the changes for all sources tracked (stylesheets, element styles, etc)
The output format is the same as the now defunct Bug 1524548 with the added code comment as separator between the sources.

Differential Revision: https://phabricator.services.mozilla.com/D21008

devtools/client/inspector/changes/ChangesView.js

@@ -40,6 +40,7 @@ class ChangesView {
     this.onChangesFront = this.onChangesFront.bind(this);
     this.onContextMenu = this.onContextMenu.bind(this);
     this.onCopy = this.onCopy.bind(this);
+    this.onCopyAllChanges = this.copyAllChanges.bind(this);
     this.onCopyRule = this.copyRule.bind(this);
     this.destroy = this.destroy.bind(this);
 
@@ -58,6 +59,7 @@ class ChangesView {
     const changesApp = ChangesApp({
       onContextMenu: this.onContextMenu,
       onCopy: this.onCopy,
+      onCopyAllChanges: this.onCopyAllChanges,
       onCopyRule: this.onCopyRule,
     });
 
@@ -106,6 +108,14 @@ class ChangesView {
     }
   }
 
+  /**
+   * Handler for the "Copy All Changes" button. Simple wrapper that just calls
+   * |this.copyChanges()| with no filters in order to trigger default operation.
+   */
+  copyAllChanges() {
+    this.copyChanges();
+  }
+
   /**
    * Handler for the "Copy Changes" option from the context menu.
    * Builds a CSS text with the aggregated changes and copies it to the clipboard.