[AI Assistance] Alert after copy

Fixed: 406078894
Change-Id: I6c5a030ab793139535ca03f18b73d5f10445ebb8
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6433741
Reviewed-by: Danil Somsikov <[email protected]>
Commit-Queue: Nikolay Vitkov <[email protected]>
Reviewed-by: Alex Rudenko <[email protected]>

Author: Lightning00Blade

config/gni/devtools_grd_files.gni

@@ -746,6 +746,7 @@ grd_files_release_sources = [
   "front_end/ui/components/cards/cards.js",
   "front_end/ui/components/chrome_link/chrome_link.js",
   "front_end/ui/components/code_highlighter/code_highlighter.js",
+  "front_end/ui/components/copy_to_clipboard/copy_to_clipboard.js",
   "front_end/ui/components/dialogs/dialogs.js",
   "front_end/ui/components/diff_view/diff_view.js",
   "front_end/ui/components/expandable_list/expandable_list.js",
@@ -2278,6 +2279,7 @@ grd_files_debug_sources = [
   "front_end/ui/components/chrome_link/chromeLink.css.js",
   "front_end/ui/components/code_highlighter/CodeHighlighter.js",
   "front_end/ui/components/code_highlighter/codeHighlighter.css.js",
+  "front_end/ui/components/copy_to_clipboard/copyToClipboard.js",
   "front_end/ui/components/dialogs/ButtonDialog.js",
   "front_end/ui/components/dialogs/Dialog.js",
   "front_end/ui/components/dialogs/ShortcutDialog.js",

front_end/core/host/InspectorFrontendHostAPI.ts

@@ -299,6 +299,10 @@ export interface InspectorFrontendHostAPI {
 
   closeWindow(): void;
 
+  /**
+   * Don't use directly - use {@link CopyToClipboard.copyTextToClipboard} instead.
+   * @deprecated Marked to restrict usage.
+   */
   copyText(text: string|null|undefined): void;
 
   inspectedURLChanged(url: Platform.DevToolsPath.UrlString): void;

front_end/core/sdk/DOMModel.ts

@@ -36,7 +36,6 @@
 import type * as ProtocolProxyApi from '../../generated/protocol-proxy-api.js';
 import * as Protocol from '../../generated/protocol.js';
 import * as Common from '../common/common.js';
-import * as Host from '../host/host.js';
 import * as Platform from '../platform/platform.js';
 import * as Root from '../root/root.js';
 
@@ -574,14 +573,6 @@ export class DOMNode {
     });
   }
 
-  async copyNode(): Promise<string|null> {
-    const {outerHTML} = await this.#agent.invoke_getOuterHTML({nodeId: this.id});
-    if (outerHTML !== null) {
-      Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(outerHTML);
-    }
-    return outerHTML;
-  }
-
   path(): string {
     function getNodeKey(node: DOMNode): number|'u'|'a'|'d'|null {
       if (!node.#nodeNameInternal.length) {

front_end/panels/changes/BUILD.gn

@@ -34,6 +34,7 @@ devtools_module("changes") {
     "../../panels/snippets:bundle",
     "../../panels/utils:bundle",
     "../../third_party/diff:bundle",
+    "../../ui/components/copy_to_clipboard:bundle",
     "../../ui/components/diff_view:bundle",
     "../../ui/legacy:bundle",
     "../../ui/lit:bundle",

front_end/panels/changes/CombinedDiffView.ts

@@ -4,14 +4,14 @@
 /* eslint-disable rulesdir/no-lit-render-outside-of-view */
 
 import * as Common from '../../core/common/common.js';
-import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as Persistence from '../../models/persistence/persistence.js';
 import type * as Workspace from '../../models/workspace/workspace.js';
 import * as WorkspaceDiff from '../../models/workspace_diff/workspace_diff.js';
 import type * as Diff from '../../third_party/diff/diff.js';
 import * as Buttons from '../../ui/components/buttons/buttons.js';
+import * as CopyToClipboard from '../../ui/components/copy_to_clipboard/copy_to_clipboard.js';
 import type * as DiffView from '../../ui/components/diff_view/diff_view.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Lit from '../../ui/lit/lit.js';
@@ -133,7 +133,7 @@ export class CombinedDiffView extends UI.Widget.Widget {
       return;
     }
 
-    Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(content.text);
+    CopyToClipboard.copyTextToClipboard(content.text, i18nString(UIStrings.copied));
     this.#copiedFiles[fileUrl] = true;
     this.requestUpdate();
     setTimeout(() => {

front_end/panels/elements/BUILD.gn

@@ -90,6 +90,7 @@ devtools_module("elements") {
     "../../panels/utils:bundle",
     "../../ui/components/adorners:bundle",
     "../../ui/components/code_highlighter:bundle",
+    "../../ui/components/copy_to_clipboard:bundle",
     "../../ui/components/floating_button:bundle",
     "../../ui/components/highlighting:bundle",
     "../../ui/components/text_editor:bundle",

front_end/panels/elements/ElementsTreeOutline.ts

@@ -41,6 +41,7 @@ import * as SDK from '../../core/sdk/sdk.js';
 import * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 import * as Adorners from '../../ui/components/adorners/adorners.js';
 import * as CodeHighlighter from '../../ui/components/code_highlighter/code_highlighter.js';
+import * as CopyToClipboard from '../../ui/components/copy_to_clipboard/copy_to_clipboard.js';
 import * as IconButton from '../../ui/components/icon_button/icon_button.js';
 import * as IssueCounter from '../../ui/components/issue_counter/issue_counter.js';
 import * as UI from '../../ui/legacy/legacy.js';
@@ -376,8 +377,11 @@ export class ElementsTreeOutline extends
     if (isCut && (node.isShadowRoot() || node.ancestorUserAgentShadowRoot())) {
       return;
     }
-
-    void node.copyNode();
+    void node.getOuterHTML().then(outerHTML => {
+      if (outerHTML !== null) {
+        CopyToClipboard.copyTextToClipboard(outerHTML);
+      }
+    });
     this.setClipboardData({node, isCut});
   }
 

front_end/panels/timeline/BUILD.gn

@@ -116,6 +116,7 @@ devtools_module("timeline") {
     "../../services/trace_bounds:bundle",
     "../../ui/components/buttons:bundle",
     "../../ui/components/code_highlighter:bundle",  # trace event highlighting
+    "../../ui/components/copy_to_clipboard:bundle",
     "../../ui/components/icon_button:bundle",
     "../../ui/components/linkifier:bundle",
     "../../ui/components/menus:bundle",

front_end/panels/timeline/TimelineSelectorStatsView.ts

@@ -11,6 +11,7 @@ import * as i18n from '../../core/i18n/i18n.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import type * as Protocol from '../../generated/protocol.js';
 import * as Trace from '../../models/trace/trace.js';
+import * as CopyToClipboard from '../../ui/components/copy_to_clipboard/copy_to_clipboard.js';
 import type * as Linkifier from '../../ui/components/linkifier/linkifier.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import {html, render} from '../../ui/lit/lit.js';
@@ -215,8 +216,7 @@ export class TimelineSelectorStatsView extends UI.Widget.VBox {
         ].join('\t'));
       }
       const data = tableData.join('\n');
-      void navigator.clipboard.writeText(data);
-      UI.ARIAUtils.alert(i18nString(UIStrings.tableCopiedToClipboard));
+      CopyToClipboard.copyTextToClipboard(data, i18nString(UIStrings.tableCopiedToClipboard));
     });
   }
 

front_end/ui/components/copy_to_clipboard/BUILD.gn

@@ -0,0 +1,26 @@
+# Copyright 2021 The Chromium Authors. All rights reserved.
+# Use of this source code is governed by a BSD-style license that can be
+# found in the LICENSE file.
+
+import("../../../../scripts/build/ninja/devtools_entrypoint.gni")
+import("../../../../scripts/build/ninja/devtools_module.gni")
+import("../../../../scripts/build/ninja/generate_css.gni")
+import("../../../../scripts/build/typescript/typescript.gni")
+import("../visibility.gni")
+
+devtools_module("copy_to_clipboard") {
+  sources = [ "copyToClipboard.ts" ]
+
+  deps = [
+    "../../../core/host:bundle",
+    "../../../ui/legacy:bundle",
+  ]
+}
+
+devtools_entrypoint("bundle") {
+  entrypoint = "copy_to_clipboard.ts"
+
+  deps = [ ":copy_to_clipboard" ]
+
+  visibility = default_components_visibility
+}