Add tracking to buttons
Example for when you click the "reply" button: Reporting: button-click: main gr-change-view div#maincontent section div#mainchangeinfo div#commitandrelated div div gr-button#replybtn Change-Id: I0ce4f574e76b8d9c9c1f4fd87db026d86895f97f
This commit is contained in:
@@ -21,6 +21,7 @@ limitations under the License.
|
|||||||
<link rel="import" href="../../../behaviors/keyboard-shortcut-behavior/keyboard-shortcut-behavior.html">
|
<link rel="import" href="../../../behaviors/keyboard-shortcut-behavior/keyboard-shortcut-behavior.html">
|
||||||
<link rel="import" href="/bower_components/paper-button/paper-button.html">
|
<link rel="import" href="/bower_components/paper-button/paper-button.html">
|
||||||
<link rel="import" href="../../../styles/shared-styles.html">
|
<link rel="import" href="../../../styles/shared-styles.html">
|
||||||
|
<link rel="import" href="../../core/gr-reporting/gr-reporting.html">
|
||||||
|
|
||||||
<dom-module id="gr-button">
|
<dom-module id="gr-button">
|
||||||
<template strip-whitespace>
|
<template strip-whitespace>
|
||||||
@@ -160,6 +161,7 @@ limitations under the License.
|
|||||||
<slot></slot>
|
<slot></slot>
|
||||||
<i class="downArrow"></i>
|
<i class="downArrow"></i>
|
||||||
</paper-button>
|
</paper-button>
|
||||||
|
<gr-reporting id="reporting"></gr-reporting>
|
||||||
</template>
|
</template>
|
||||||
<script src="gr-button.js"></script>
|
<script src="gr-button.js"></script>
|
||||||
</dom-module>
|
</dom-module>
|
||||||
|
|||||||
@@ -90,6 +90,19 @@
|
|||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
e.stopImmediatePropagation();
|
e.stopImmediatePropagation();
|
||||||
}
|
}
|
||||||
|
let el = this.root;
|
||||||
|
let path = '';
|
||||||
|
while (el = el.parentNode || el.host) {
|
||||||
|
if (el.tagName && el.tagName.startsWith('GR-APP')) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if (el.tagName) {
|
||||||
|
const idString = el.id ? '#' + el.id : '';
|
||||||
|
path = el.tagName + idString + ' ' + path;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.$.reporting.reportInteraction('button-click',
|
||||||
|
path.trim().toLowerCase());
|
||||||
}
|
}
|
||||||
|
|
||||||
_disabledChanged(disabled) {
|
_disabledChanged(disabled) {
|
||||||
|
|||||||
@@ -88,13 +88,17 @@ limitations under the License.
|
|||||||
assert.equal(div.textContent, 'foobar');
|
assert.equal(div.textContent, 'foobar');
|
||||||
});
|
});
|
||||||
|
|
||||||
test('button', () => {
|
test('button', done => {
|
||||||
const clickStub = sandbox.stub();
|
const clickStub = sandbox.stub();
|
||||||
const button = instance.button('foo', {onclick: clickStub});
|
const button = instance.button('foo', {onclick: clickStub});
|
||||||
|
// If you don't attach a Polymer element to the DOM, then the ready()
|
||||||
|
// callback will not be called and then e.g. this.$ is undefined.
|
||||||
|
Polymer.dom(document.body).appendChild(button);
|
||||||
MockInteractions.tap(button);
|
MockInteractions.tap(button);
|
||||||
flush(() => {
|
flush(() => {
|
||||||
assert.isTrue(clickStub.called);
|
assert.isTrue(clickStub.called);
|
||||||
assert.equal(button.textContent, 'foo');
|
assert.equal(button.textContent, 'foo');
|
||||||
|
done();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user