From 376ba8cf51711a8b6b61f1b6c344e6cee21763ec Mon Sep 17 00:00:00 2001
From: Kawika Avilla <kavilla414@gmail.com>
Date: Wed, 20 Apr 2022 18:56:20 -0700
Subject: [PATCH] [Bug] fix copy as curl (#1472)

* [Bug] fix copy as curl

Copy as curl doesn't work in Dev Tools console due to usage of a
deprecated method:

https://developer.mozilla.org/en-US/docs/Web/API/Document/queryCommandSupported#browser_compatibility

Issue Resolved:
https://github.com/opensearch-project/OpenSearch-Dashboards/issues/1471

Signed-off-by: Kawika Avilla <kavilla414@gmail.com>

* Adds browser compatibility comment

Signed-off-by: Bishoy Boktor <boktorbb@amazon.com>

Co-authored-by: Bishoy Boktor <boktorbb@amazon.com>
---
 .../application/components/console_menu.tsx   | 28 ++++++++++++-------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/plugins/console/public/application/components/console_menu.tsx b/src/plugins/console/public/application/components/console_menu.tsx
index efe8a8937978..c3015dc7ffa2 100644
--- a/src/plugins/console/public/application/components/console_menu.tsx
+++ b/src/plugins/console/public/application/components/console_menu.tsx
@@ -64,8 +64,8 @@ export class ConsoleMenu extends Component<Props, State> {
     });
   };
 
-  copyAsCurl() {
-    this.copyText(this.state.curlCode);
+  async copyAsCurl() {
+    await this.copyText(this.state.curlCode);
     const { addNotification } = this.props;
     if (addNotification) {
       addNotification({
@@ -76,13 +76,20 @@ export class ConsoleMenu extends Component<Props, State> {
     }
   }
 
-  copyText(text: string) {
-    const textField = document.createElement('textarea');
-    textField.innerText = text;
-    document.body.appendChild(textField);
-    textField.select();
-    document.execCommand('copy');
-    textField.remove();
+  async copyText(text: string) {
+    if (window.navigator?.clipboard) {
+      /**
+       * Browser Compatibility Chart
+       *
+       * Chrome: 66
+       * Edge: 79
+       * Firefox: 63
+       * Opera: 53
+       * Internet Explorer: Not supported
+       *
+       */
+      await window.navigator.clipboard.writeText(text);
+    }
   }
 
   onButtonClick = () => {
@@ -130,7 +137,8 @@ export class ConsoleMenu extends Component<Props, State> {
       <EuiContextMenuItem
         key="Copy as cURL"
         id="ConCopyAsCurl"
-        disabled={!document.queryCommandSupported('copy')}
+        data-test-subj="copyAsCurl"
+        disabled={!window.navigator?.clipboard}
         onClick={() => {
           this.closePopover();
           this.copyAsCurl();