From 6cb038535ef65f2c8d65aacb3099d863413d7892 Mon Sep 17 00:00:00 2001
From: narcolepticinsomniac <therealdoctorgonzo@gmail.com>
Date: Mon, 6 Jan 2020 19:13:49 -0500
Subject: [PATCH] Copyable elements accessibility (#808)

---
 popup/popup.css | 12 +++++++++---
 popup/popup.js  |  9 ++++++---
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/popup/popup.css b/popup/popup.css
index 1205a58d..f6764db8 100644
--- a/popup/popup.css
+++ b/popup/popup.css
@@ -714,13 +714,19 @@ body.blocked .actions > .main-controls {
   margin: 0;
 }
 
-.blocked-info strong {
+.blocked-info .copy {
   cursor: pointer;
   transition: all .1s;
   border-bottom: 1px dotted #000;
+  text-decoration: none;
+  font-weight: bold;
 }
 
-.blocked-info strong.copied {
+.blocked-info .copy:hover {
+  color: #000;
+}
+
+.blocked-info .copy.copied {
   background: hsl(170, 40%, 80%);
   color: #000;
 }
@@ -745,7 +751,7 @@ body.blocked .actions > .main-controls {
   display: block;
 }
 
-.blocked-info strong:after {
+.blocked-info .copy:after {
   content: '';
   background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAMAAAC67D+PAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAGUExURQAAAAAAAKVnuc8AAAABdFJOUwBA5thmAAAAIElEQVQI12NgYGCEAgYgkwEMGBFijEhixDMZkUSRLQAACpYALjrE2uIAAAAASUVORK5CYII=)center no-repeat;
   height: 10px;
diff --git a/popup/popup.js b/popup/popup.js
index e3ba2f9c..01424323 100644
--- a/popup/popup.js
+++ b/popup/popup.js
@@ -142,10 +142,12 @@ function initPopup() {
           const note = (FIREFOX < 59 ? t('unreachableAMOHintOldFF') : t('unreachableAMOHint')) +
                        (FIREFOX < 60 ? '' : '\n' + t('unreachableAMOHintNewFF'));
           const renderToken = s => s[0] === '<'
-            ? $create('strong', {
+            ? $create('a', {
               textContent: s.slice(1, -1),
               onclick: handleEvent.copyContent,
-              tabIndex: -1,
+              href: '#',
+              className: 'copy',
+              tabIndex: 0,
               title: t('copy'),
             })
             : s;
@@ -590,7 +592,8 @@ Object.assign(handleEvent, {
   },
 
   copyContent(event) {
-    const target = event.target;
+    event.preventDefault();
+    const target = document.activeElement;
     const message = $('.copy-message');
     navigator.clipboard.writeText(target.textContent);
     target.classList.add('copied');