feat(ui): add copyContent to clipboard button to terminal component (#3688)

Author: pikax

packages/@vue/cli-ui/locales/en.json

@@ -175,7 +175,8 @@
         "terminal-view": {
           "buttons": {
             "clear": "Clear console",
-            "scroll": "Scroll to bottom"
+            "scroll": "Scroll to bottom",
+            "content-copy": "Copy content"
           }
         },
         "top-bar": {

packages/@vue/cli-ui/src/components/content/TerminalView.vue

@@ -15,6 +15,12 @@
         icon="lens"
         class="separator"
       />
+      <VueButton
+        class="icon-button flat"
+        icon-left="content_copy"
+        v-tooltip="$t('org.vue.components.terminal-view.buttons.content-copy')"
+        @click="copyContent()"
+      />
       <VueButton
         class="icon-button flat"
         icon-left="subdirectory_arrow_left"
@@ -196,6 +202,29 @@ export default {
       this.$_terminal.scrollToBottom()
     },
 
+    copyContent () {
+      const textarea = this.$_terminal.textarea
+      if (!textarea) {
+        return
+      }
+      const textValue = textarea.value
+      const emptySelection = !this.$_terminal.hasSelection()
+      try {
+        if (emptySelection) {
+          this.$_terminal.selectAll()
+        }
+        var selection = this.$_terminal.getSelection()
+        textarea.value = selection
+        textarea.select()
+        document.execCommand('copy')
+      } finally {
+        textarea.value = textValue
+        if (emptySelection) {
+          this.$_terminal.clearSelection()
+        }
+      }
+    },
+
     handleLink (event, uri) {
       if (this.openLinks) {
         window.open(uri, '_blank')