Merge "Support copy file path when hover on path in change table"

This commit is contained in:
Tao Zhou
2020-02-26 13:55:21 +00:00
committed by Gerrit Code Review
3 changed files with 48 additions and 10 deletions

View File

@@ -36,6 +36,7 @@ limitations under the License.
<link rel="import" href="../../shared/gr-select/gr-select.html"> <link rel="import" href="../../shared/gr-select/gr-select.html">
<link rel="import" href="../../shared/gr-count-string-formatter/gr-count-string-formatter.html"> <link rel="import" href="../../shared/gr-count-string-formatter/gr-count-string-formatter.html">
<link rel="import" href="../../shared/gr-tooltip-content/gr-tooltip-content.html"> <link rel="import" href="../../shared/gr-tooltip-content/gr-tooltip-content.html">
<link rel="import" href="../../shared/gr-copy-clipboard/gr-copy-clipboard.html">
<link rel="import" href="../gr-file-list-constants.html"> <link rel="import" href="../gr-file-list-constants.html">
<dom-module id="gr-file-list"> <dom-module id="gr-file-list">
@@ -115,14 +116,10 @@ limitations under the License.
.path { .path {
cursor: pointer; cursor: pointer;
flex: 1; flex: 1;
text-decoration: none;
/* Wrap it into multiple lines if too long. */ /* Wrap it into multiple lines if too long. */
white-space: normal; white-space: normal;
word-break: break-word; word-break: break-word;
} }
.path:hover :first-child {
text-decoration: underline;
}
.oldPath { .oldPath {
color: var(--deemphasized-text-color); color: var(--deemphasized-text-color);
} }
@@ -245,6 +242,26 @@ limitations under the License.
display: inline-block; display: inline-block;
margin: -2px 0; margin: -2px 0;
padding: var(--spacing-s) 0; padding: var(--spacing-s) 0;
text-decoration: none;
}
.pathLink:hover {
text-decoration: underline;
}
/** copy on file path **/
.pathLink gr-copy-clipboard,
.oldPath gr-copy-clipboard {
display: inline-block;
visibility: hidden;
vertical-align: bottom;
text-decoration: none;
--gr-button: {
padding: 0px;
}
}
.pathLink:hover gr-copy-clipboard,
.oldPath:hover gr-copy-clipboard {
visibility: visible;
} }
/** small screen breakpoint: 768px */ /** small screen breakpoint: 768px */
@@ -273,7 +290,7 @@ limitations under the License.
} }
.expanded .fullFileName, .expanded .fullFileName,
.truncatedFileName { .truncatedFileName {
display: block; display: inline;
} }
.expanded .truncatedFileName, .expanded .truncatedFileName,
.fullFileName { .fullFileName {
@@ -330,11 +347,18 @@ limitations under the License.
class="truncatedFileName"> class="truncatedFileName">
[[computeTruncatedPath(file.__path)]] [[computeTruncatedPath(file.__path)]]
</span> </span>
<gr-copy-clipboard
hide-input
text="[[file.__path]]"></gr-copy-clipboard>
</a> </a>
<div class="oldPath" hidden$="[[!file.old_path]]" hidden <template is="dom-if" if="[[file.old_path]]">
title$="[[file.old_path]]"> <div class="oldPath" title$="[[file.old_path]]">
[[file.old_path]] [[file.old_path]]
</div> <gr-copy-clipboard
hide-input
text="[[file.old_path]]"></gr-copy-clipboard>
</div>
</template>
</span> </span>
<div class="comments desktop"> <div class="comments desktop">
<span class="drafts"> <span class="drafts">

View File

@@ -53,7 +53,10 @@
Polymer.dom(e).rootTarget.select(); Polymer.dom(e).rootTarget.select();
} }
_copyToClipboard() { _copyToClipboard(e) {
e.preventDefault();
e.stopPropagation();
if (this.hideInput) { if (this.hideInput) {
this.$.input.style.display = 'block'; this.$.input.style.display = 'block';
} }

View File

@@ -90,5 +90,16 @@ limitations under the License.
flushAsynchronousOperations(); flushAsynchronousOperations();
assert.equal(getComputedStyle(element.$.input).display, 'none'); assert.equal(getComputedStyle(element.$.input).display, 'none');
}); });
test('stop events propagation', () => {
const divParent = document.createElement('div');
divParent.appendChild(element);
const clickStub = sinon.stub();
divParent.addEventListener('click', clickStub);
element.stopPropagation = true;
const copyBtn = element.shadowRoot.querySelector('.copyToClipboard');
MockInteractions.tap(copyBtn);
assert.isFalse(clickStub.called);
});
}); });
</script> </script>