Fix links in gr-diff showContext buttons

Previously, when gr-diff-builder generated context buttons, it reset the
textContent after gr-button was created. This ended up removing the
paper-button from inside gr-button, and hence lost all button like
qualities.

This change replaces with the appropriate Polymer DOM API, and modifies
the gr-button styles accordingly.

Bug: Issue 8626
Change-Id: Ic9a33c6bc74d676b21a039dd8714e4001bcda207
diff --git a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
index 99cfb03..fc23837 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
+++ b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
@@ -160,12 +160,15 @@
       .contextControl {
         background-color: #fff7d4;
         border: 1px solid #f6e6a5;
-        color: rgba(0,0,0.54);
       }
       .contextControl gr-button {
         display: inline-block;
-        font-family: var(--monospace-font-family);
         text-decoration: none;
+        --gr-button-color: rgba(0,0,0,.54);
+        --gr-button: {
+          font-family: var(--monospace-font-family);
+          padding: .2em;
+        }
       }
       .contextControl td:not(.lineNum) {
         text-align: center;
diff --git a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.js b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.js
index 9841564..f280c33 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.js
@@ -321,7 +321,7 @@
     },
 
     _handleTap(e) {
-      const el = Polymer.dom(e).rootTarget;
+      const el = Polymer.dom(e).localTarget;
 
       if (el.classList.contains('showContext')) {
         this.$.diffBuilder.showContext(e.detail.groups, e.detail.section);