From 91b2e2c781632f0762c30549c918316e962c825b Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Thu, 10 Dec 2020 20:37:34 +0100 Subject: [PATCH 1/6] Catch navigator.clipboard errors --- src/common/util/copy-clipboard.ts | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/src/common/util/copy-clipboard.ts b/src/common/util/copy-clipboard.ts index 3c89e40982bc..1708858c85ac 100644 --- a/src/common/util/copy-clipboard.ts +++ b/src/common/util/copy-clipboard.ts @@ -1,12 +1,17 @@ -export const copyToClipboard = (str) => { +export const copyToClipboard = async (str) => { if (navigator.clipboard) { - navigator.clipboard.writeText(str); - } else { - const el = document.createElement("textarea"); - el.value = str; - document.body.appendChild(el); - el.select(); - document.execCommand("copy"); - document.body.removeChild(el); + try { + await navigator.clipboard.writeText(str); + return; + } catch { + // just continue with the fallback coding below + } } + + const el = document.createElement("textarea"); + el.value = str; + document.body.appendChild(el); + el.select(); + document.execCommand("copy"); + document.body.removeChild(el); }; From ff7c5f1a39154165e258713146dea498bb14fc1a Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Wed, 30 Dec 2020 10:49:17 +0100 Subject: [PATCH 2/6] Await copyToClipboard() calls --- src/panels/config/automation/ha-automation-editor.ts | 2 +- src/panels/config/info/system-health-card.ts | 4 ++-- src/panels/config/script/ha-script-editor.ts | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/panels/config/automation/ha-automation-editor.ts b/src/panels/config/automation/ha-automation-editor.ts index fed4eb04a5c8..afaf9b1cbde6 100644 --- a/src/panels/config/automation/ha-automation-editor.ts +++ b/src/panels/config/automation/ha-automation-editor.ts @@ -397,7 +397,7 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) { private async _copyYaml() { if (this._editor?.yaml) { - copyToClipboard(this._editor.yaml); + await copyToClipboard(this._editor.yaml); } } diff --git a/src/panels/config/info/system-health-card.ts b/src/panels/config/info/system-health-card.ts index 95947cce0d3a..781637153445 100644 --- a/src/panels/config/info/system-health-card.ts +++ b/src/panels/config/info/system-health-card.ts @@ -197,7 +197,7 @@ class SystemHealthCard extends LitElement { }); } - private _copyInfo(ev: CustomEvent): void { + private async _copyInfo(ev: CustomEvent) { const github = ev.detail.index === 1; let haContent: string | undefined; const domainParts: string[] = []; @@ -250,7 +250,7 @@ class SystemHealthCard extends LitElement { } } - copyToClipboard( + await copyToClipboard( `${github ? "## " : ""}System Health\n${haContent}\n\n${domainParts.join( "\n\n" )}` diff --git a/src/panels/config/script/ha-script-editor.ts b/src/panels/config/script/ha-script-editor.ts index 8683d5d31f52..c04ee4873046 100644 --- a/src/panels/config/script/ha-script-editor.ts +++ b/src/panels/config/script/ha-script-editor.ts @@ -546,7 +546,7 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) { private async _copyYaml() { if (this._editor?.yaml) { - copyToClipboard(this._editor.yaml); + await copyToClipboard(this._editor.yaml); } } From 592531a223afb17815e41f5078704f1f45cd48ad Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Mon, 4 Jan 2021 11:11:15 +0100 Subject: [PATCH 3/6] Update src/panels/config/info/system-health-card.ts Co-authored-by: Bram Kragten --- src/panels/config/info/system-health-card.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/panels/config/info/system-health-card.ts b/src/panels/config/info/system-health-card.ts index 781637153445..91e7eb843477 100644 --- a/src/panels/config/info/system-health-card.ts +++ b/src/panels/config/info/system-health-card.ts @@ -197,7 +197,7 @@ class SystemHealthCard extends LitElement { }); } - private async _copyInfo(ev: CustomEvent) { + private async _copyInfo(ev: CustomEvent): Promise { const github = ev.detail.index === 1; let haContent: string | undefined; const domainParts: string[] = []; From de6ee900ba01345da151dea47e714f518e0caf32 Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Mon, 4 Jan 2021 11:15:10 +0100 Subject: [PATCH 4/6] Add toast after clipboard copy --- src/panels/config/automation/ha-automation-editor.ts | 3 ++- src/panels/config/script/ha-script-editor.ts | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/panels/config/automation/ha-automation-editor.ts b/src/panels/config/automation/ha-automation-editor.ts index afaf9b1cbde6..1339eb829d5e 100644 --- a/src/panels/config/automation/ha-automation-editor.ts +++ b/src/panels/config/automation/ha-automation-editor.ts @@ -395,9 +395,10 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) { return cleanConfig; } - private async _copyYaml() { + private async _copyYaml(): Promise { if (this._editor?.yaml) { await copyToClipboard(this._editor.yaml); + showToast(this, { message: this.hass.localize("ui.common.copied") }); } } diff --git a/src/panels/config/script/ha-script-editor.ts b/src/panels/config/script/ha-script-editor.ts index c04ee4873046..f4caf76ccf0e 100644 --- a/src/panels/config/script/ha-script-editor.ts +++ b/src/panels/config/script/ha-script-editor.ts @@ -544,9 +544,10 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) { return this._config; } - private async _copyYaml() { + private async _copyYaml(): Promise { if (this._editor?.yaml) { await copyToClipboard(this._editor.yaml); + showToast(this, { message: this.hass.localize("ui.common.copied") }); } } From 543afaca364fb3207398cbc191eb2f79a1ede78d Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Mon, 4 Jan 2021 11:43:27 +0100 Subject: [PATCH 5/6] Make system log also use copyToClipboard() + better toast text --- .../config/automation/ha-automation-editor.ts | 4 ++- src/panels/config/info/system-health-card.ts | 4 ++- .../config/logs/dialog-system-log-detail.ts | 29 +++++-------------- src/panels/config/script/ha-script-editor.ts | 4 ++- src/translations/en.json | 3 +- 5 files changed, 18 insertions(+), 26 deletions(-) diff --git a/src/panels/config/automation/ha-automation-editor.ts b/src/panels/config/automation/ha-automation-editor.ts index 1339eb829d5e..996daed1736b 100644 --- a/src/panels/config/automation/ha-automation-editor.ts +++ b/src/panels/config/automation/ha-automation-editor.ts @@ -398,7 +398,9 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) { private async _copyYaml(): Promise { if (this._editor?.yaml) { await copyToClipboard(this._editor.yaml); - showToast(this, { message: this.hass.localize("ui.common.copied") }); + showToast(this, { + message: this.hass.localize("ui.common.copied_clipboard"), + }); } } diff --git a/src/panels/config/info/system-health-card.ts b/src/panels/config/info/system-health-card.ts index 91e7eb843477..44b3d4d3e300 100644 --- a/src/panels/config/info/system-health-card.ts +++ b/src/panels/config/info/system-health-card.ts @@ -256,7 +256,9 @@ class SystemHealthCard extends LitElement { )}` ); - showToast(this, { message: this.hass.localize("ui.common.copied") }); + showToast(this, { + message: this.hass.localize("ui.common.copied_clipboard"), + }); } static get styles(): CSSResult { diff --git a/src/panels/config/logs/dialog-system-log-detail.ts b/src/panels/config/logs/dialog-system-log-detail.ts index 320657f8c40b..f20694a8caae 100644 --- a/src/panels/config/logs/dialog-system-log-detail.ts +++ b/src/panels/config/logs/dialog-system-log-detail.ts @@ -14,6 +14,7 @@ import { TemplateResult, } from "lit-element"; import { fireEvent } from "../../../common/dom/fire_event"; +import { copyToClipboard } from "../../../common/util/copy-clipboard"; import "../../../components/ha-dialog"; import "../../../components/ha-svg-icon"; import { @@ -27,6 +28,7 @@ import { haStyleDialog } from "../../../resources/styles"; import type { HomeAssistant } from "../../../types"; import type { SystemLogDetailDialogParams } from "./show-dialog-system-log-detail"; import { formatSystemLogTime } from "./util"; +import { showToast } from "../../../util/toast"; class DialogSystemLogDetail extends LitElement { @property({ attribute: false }) public hass!: HomeAssistant; @@ -83,15 +85,6 @@ class DialogSystemLogDetail extends LitElement { - ${this.hass.localize("ui.common.copied")}

@@ -162,23 +155,15 @@ class DialogSystemLogDetail extends LitElement { } } - private _copyLog(): void { + private async _copyLog(): Promise { const copyElement = this.shadowRoot?.querySelector( ".contents" ) as HTMLElement; - const selection = window.getSelection()!; - const range = document.createRange(); - - range.selectNodeContents(copyElement); - selection.removeAllRanges(); - selection.addRange(range); - - document.execCommand("copy"); - window.getSelection()!.removeAllRanges(); - - this._toolTip!.show(); - setTimeout(() => this._toolTip?.hide(), 3000); + await copyToClipboard(copyElement.innerText); + showToast(this, { + message: this.hass.localize("ui.common.copied_clipboard"), + }); } static get styles(): CSSResult[] { diff --git a/src/panels/config/script/ha-script-editor.ts b/src/panels/config/script/ha-script-editor.ts index f4caf76ccf0e..76c0f886b0a4 100644 --- a/src/panels/config/script/ha-script-editor.ts +++ b/src/panels/config/script/ha-script-editor.ts @@ -547,7 +547,9 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) { private async _copyYaml(): Promise { if (this._editor?.yaml) { await copyToClipboard(this._editor.yaml); - showToast(this, { message: this.hass.localize("ui.common.copied") }); + showToast(this, { + message: this.hass.localize("ui.common.copied_clipboard"), + }); } } diff --git a/src/translations/en.json b/src/translations/en.json index aa10caf7156d..e45f4f7ef5f4 100755 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -291,7 +291,8 @@ "successfully_saved": "Successfully saved", "successfully_deleted": "Successfully deleted", "error_required": "Required", - "copied": "Copied" + "copied": "Copied", + "copied_clipboard": "Copied to clipboard" }, "components": { "logbook": { From 0e0f30b6698b5e214e850d6e3dcc69539b17413b Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Mon, 4 Jan 2021 11:48:28 +0100 Subject: [PATCH 6/6] Final cleanup --- src/panels/config/logs/dialog-system-log-detail.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/panels/config/logs/dialog-system-log-detail.ts b/src/panels/config/logs/dialog-system-log-detail.ts index f20694a8caae..e3acd3f5f133 100644 --- a/src/panels/config/logs/dialog-system-log-detail.ts +++ b/src/panels/config/logs/dialog-system-log-detail.ts @@ -2,7 +2,6 @@ import "../../../components/ha-header-bar"; import "@material/mwc-icon-button/mwc-icon-button"; import { mdiContentCopy, mdiClose } from "@mdi/js"; import "@polymer/paper-tooltip/paper-tooltip"; -import type { PaperTooltipElement } from "@polymer/paper-tooltip/paper-tooltip"; import { css, CSSResult, @@ -10,7 +9,6 @@ import { internalProperty, LitElement, property, - query, TemplateResult, } from "lit-element"; import { fireEvent } from "../../../common/dom/fire_event"; @@ -37,8 +35,6 @@ class DialogSystemLogDetail extends LitElement { @internalProperty() private _manifest?: IntegrationManifest; - @query("paper-tooltip") private _toolTip?: PaperTooltipElement; - public async showDialog(params: SystemLogDetailDialogParams): Promise { this._params = params; this._manifest = undefined;