Modified: trunk/Tools/ChangeLog (249110 => 249111)
--- trunk/Tools/ChangeLog 2019-08-26 19:08:57 UTC (rev 249110)
+++ trunk/Tools/ChangeLog 2019-08-26 19:18:15 UTC (rev 249111)
@@ -1,3 +1,22 @@
+2019-08-26 Jonathan Bedard <[email protected]>
+
+ results.webkit.org: Allow clicking on the tooltip arrow
+ https://bugs.webkit.org/show_bug.cgi?id=201103
+
+ Rubber-stamped by Aakash Jain.
+
+ By design, the arrow sits above the canvas and intercepts mouse events from it.
+ This will often make an element that has a tooltip unclickable.
+
+ * resultsdbpy/resultsdbpy/view/static/js/timeline.js:
+ (xAxisFromScale):
+ (TimelineFromEndpoint.prototype.render.onDotEnterFactory):
+ (TimelineFromEndpoint.prototype.render):
+ * resultsdbpy/resultsdbpy/view/static/js/tooltip.js:
+ (_ToolTip):
+ (_ToolTip.prototype.toString): Trigger onClick callback when the arrow is clicked.
+ (_ToolTip.prototype.set): Set the onClick callback.
+
2019-08-26 Aakash Jain <[email protected]>
[EWS] Do not append additional '(failure)' string at the end of custom failure message in EWS Buildbot
Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/timeline.js (249110 => 249111)
--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/timeline.js 2019-08-26 19:08:57 UTC (rev 249110)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/timeline.js 2019-08-26 19:18:15 UTC (rev 249111)
@@ -205,21 +205,23 @@
});
}
+ function onScaleClick(node) {
+ if (!node.label.id)
+ return;
+ let params = {
+ branch: node.label.branch ? [node.label.branch] : queryToParams(document.URL.split('?')[1]).branch,
+ uuid: [node.label.uuid],
+ }
+ if (!params.branch)
+ delete params.branch;
+ const query = paramsToQuery(params);
+ window.open(`/commit?${query}`, '_blank');
+ }
+
return Timeline.CanvasXAxisComponent(scaleForRepository(scale), {
isTop: isTop,
height: 130,
- onScaleClick: (node) => {
- if (!node.label.id)
- return;
- let params = {
- branch: node.label.branch ? [node.label.branch] : queryToParams(document.URL.split('?')[1]).branch,
- uuid: [node.label.uuid],
- }
- if (!params.branch)
- delete params.branch;
- const query = paramsToQuery(params);
- window.open(`/commit?${query}`, '_blank');
- },
+ onScaleClick: onScaleClick,
onScaleEnter: (node, event, canvas) => {
const scrollDelta = document.documentElement.scrollTop || document.body.scrollTop;
ToolTip.set(
@@ -230,7 +232,8 @@
</div>`,
node.tipPoints.map((point) => {
return {x: canvas.x + point.x, y: canvas.y + scrollDelta + point.y};
- })
+ }),
+ (event) => {return onScaleClick(node);},
);
},
onScaleLeave: (event, canvas) => {
@@ -620,7 +623,8 @@
</div>`,
data.tipPoints.map((point) => {
return {x: canvas.x + point.x, y: canvas.y + scrollDelta + point.y};
- })
+ }),
+ (event) => {onDotClickFactory(configuration)(data);},
);
}
}
Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/tooltip.js (249110 => 249111)
--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/tooltip.js 2019-08-26 19:08:57 UTC (rev 249110)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/tooltip.js 2019-08-26 19:18:15 UTC (rev 249111)
@@ -35,6 +35,7 @@
constructor() {
this.ref = null;
this.arrow = null;
+ this._onArrowClick_ = null;
}
toString() {
const self = this;
@@ -99,9 +100,19 @@
onStateUpdate: (element, stateDiff, state) => {
if (!state.direction || !state.location) {
element.style.display = 'none';
+ element._onclick_ = null;
+ element.style.cursor = null;
return;
}
+ if (self.onArrowClick) {
+ element._onclick_ = self.onArrowClick;
+ element.style.cursor = 'pointer';
+ } else {
+ element._onclick_ = null;
+ element.style.cursor = null;
+ }
+
element.classList = [`tooltip arrow-${state.direction}`];
element.style.left = `${state.location.x - 15}px`;
if (state.direction == 'down')
@@ -116,7 +127,7 @@
<div class="tooltip-content" ref="${this.ref}">
</div>`;
}
- set(content, points) {
+ set(content, points, _onArrowClick_ = null) {
if (!this.ref) {
console.error('Cannot set ToolTip content, no tooltip on the page');
return;
@@ -125,7 +136,7 @@
console.error('Tool tips require a location');
return;
}
-
+ this._onArrowClick_ = onArrowClick;
this.ref.setState({content: content, points: points});
}
unset() {