You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@spark.apache.org by sr...@apache.org on 2020/09/25 13:39:05 UTC
[spark] branch branch-2.4 updated:
[SPARK-32886][SPARK-31882][WEBUI][2.4] fix 'undefined' link in event
timeline view
This is an automated email from the ASF dual-hosted git repository.
srowen pushed a commit to branch branch-2.4
in repository https://gitbox.apache.org/repos/asf/spark.git
The following commit(s) were added to refs/heads/branch-2.4 by this push:
new cd3caab [SPARK-32886][SPARK-31882][WEBUI][2.4] fix 'undefined' link in event timeline view
cd3caab is described below
commit cd3caabea60cdbf9f131c12f7225bd97581da659
Author: Zhen Li <zh...@microsoft.com>
AuthorDate: Fri Sep 25 08:34:19 2020 -0500
[SPARK-32886][SPARK-31882][WEBUI][2.4] fix 'undefined' link in event timeline view
### What changes were proposed in this pull request?
Fix [SPARK-32886](https://issues.apache.org/jira/projects/SPARK/issues/SPARK-32886) in branch-2.4. i cherry-pick [29757](https://github.com/apache/spark/pull/29757) and partial [28690](https://github.com/apache/spark/pull/28690)(test part is ignored as conflict), which PR `29757` has dependency on PR `28690`. This change fixes two below issues in branch-2.4.
[SPARK-31882: DAG-viz is not rendered correctly with pagination.](https://issues.apache.org/jira/projects/SPARK/issues/SPARK-31882)
[SPARK-32886: '.../jobs/undefined' link from "Event Timeline" in jobs page](https://issues.apache.org/jira/projects/SPARK/issues/SPARK-32886)
### Why are the changes needed?
sarutak found `29757` has dependency on `28690`. If we only merge `29757` to 2.4 branch, it would cause UI break. And I verified both issues mentioned in [SPARK-32886](https://issues.apache.org/jira/projects/SPARK/issues/SPARK-32886) and [SPARK-31882](https://issues.apache.org/jira/projects/SPARK/issues/SPARK-31882) exist in branch-2.4. So i cherry pick them to branch 2.4 in same PR.
### Does this PR introduce _any_ user-facing change?
No.
### How was this patch tested?
Manually tested.
Closes #29833 from zhli1142015/cherry-pick-fix-for-31882-32886.
Lead-authored-by: Zhen Li <zh...@microsoft.com>
Co-authored-by: Kousuke Saruta <sa...@oss.nttdata.com>
Signed-off-by: Sean Owen <sr...@gmail.com>
---
.../org/apache/spark/ui/static/spark-dag-viz.js | 9 ++--
.../org/apache/spark/ui/static/timeline-view.js | 53 ++++++++++++++--------
.../resources/org/apache/spark/ui/static/webui.js | 7 ++-
.../main/scala/org/apache/spark/ui/UIUtils.scala | 1 +
4 files changed, 43 insertions(+), 27 deletions(-)
diff --git a/core/src/main/resources/org/apache/spark/ui/static/spark-dag-viz.js b/core/src/main/resources/org/apache/spark/ui/static/spark-dag-viz.js
index 75b959f..990b2f8 100644
--- a/core/src/main/resources/org/apache/spark/ui/static/spark-dag-viz.js
+++ b/core/src/main/resources/org/apache/spark/ui/static/spark-dag-viz.js
@@ -210,7 +210,7 @@ function renderDagVizForJob(svgContainer) {
var dot = metadata.select(".dot-file").text();
var stageId = metadata.attr("stage-id");
var containerId = VizConstants.graphPrefix + stageId;
- var isSkipped = metadata.attr("skipped") == "true";
+ var isSkipped = metadata.attr("skipped") === "true";
var container;
if (isSkipped) {
container = svgContainer
@@ -219,11 +219,8 @@ function renderDagVizForJob(svgContainer) {
.attr("skipped", "true");
} else {
// Link each graph to the corresponding stage page (TODO: handle stage attempts)
- // Use the link from the stage table so it also works for the history server
- var attemptId = 0
- var stageLink = d3.select("#stage-" + stageId + "-" + attemptId)
- .select("a.name-link")
- .attr("href");
+ var attemptId = 0;
+ var stageLink = uiRoot + appBasePath + "/stages/stage/?id=" + stageId + "&attempt=" + attemptId;
container = svgContainer
.append("a")
.attr("xlink:href", stageLink)
diff --git a/core/src/main/resources/org/apache/spark/ui/static/timeline-view.js b/core/src/main/resources/org/apache/spark/ui/static/timeline-view.js
index 5be8cff..220b76a 100644
--- a/core/src/main/resources/org/apache/spark/ui/static/timeline-view.js
+++ b/core/src/main/resources/org/apache/spark/ui/static/timeline-view.js
@@ -42,26 +42,31 @@ function drawApplicationTimeline(groupArray, eventObjArray, startTime, offset) {
setupZoomable("#application-timeline-zoom-lock", applicationTimeline);
setupExecutorEventAction();
+ function getIdForJobEntry(baseElem) {
+ var jobIdText = $($(baseElem).find(".application-timeline-content")[0]).text();
+ var jobId = jobIdText.match("\\(Job (\\d+)\\)$")[1];
+ return jobId;
+ }
+
+ function getSelectorForJobEntry(jobId) {
+ return "#job-" + jobId;
+ }
+
function setupJobEventAction() {
$(".vis-item.vis-range.job.application-timeline-object").each(function() {
- var getSelectorForJobEntry = function(baseElem) {
- var jobIdText = $($(baseElem).find(".application-timeline-content")[0]).text();
- var jobId = jobIdText.match("\\(Job (\\d+)\\)$")[1];
- return "#job-" + jobId;
- };
-
$(this).click(function() {
- var jobPagePath = $(getSelectorForJobEntry(this)).find("a.name-link").attr("href");
- window.location.href = jobPagePath
+ var jobId = getIdForJobEntry(this);
+ var jobPagePath = uiRoot + appBasePath + "/jobs/job/?id=" + jobId;
+ window.location.href = jobPagePath;
});
$(this).hover(
function() {
- $(getSelectorForJobEntry(this)).addClass("corresponding-item-hover");
+ $(getSelectorForJobEntry(getIdForJobEntry(this))).addClass("corresponding-item-hover");
$($(this).find("div.application-timeline-content")[0]).tooltip("show");
},
function() {
- $(getSelectorForJobEntry(this)).removeClass("corresponding-item-hover");
+ $(getSelectorForJobEntry(getIdForJobEntry(this))).removeClass("corresponding-item-hover");
$($(this).find("div.application-timeline-content")[0]).tooltip("hide");
}
);
@@ -125,26 +130,34 @@ function drawJobTimeline(groupArray, eventObjArray, startTime, offset) {
setupZoomable("#job-timeline-zoom-lock", jobTimeline);
setupExecutorEventAction();
+ function getStageIdAndAttemptForStageEntry(baseElem) {
+ var stageIdText = $($(baseElem).find(".job-timeline-content")[0]).text();
+ var stageIdAndAttempt = stageIdText.match("\\(Stage (\\d+\\.\\d+)\\)$")[1].split(".");
+ return stageIdAndAttempt;
+ }
+
+ function getSelectorForStageEntry(stageIdAndAttempt) {
+ return "#stage-" + stageIdAndAttempt[0] + "-" + stageIdAndAttempt[1];
+ }
+
function setupStageEventAction() {
$(".vis-item.vis-range.stage.job-timeline-object").each(function() {
- var getSelectorForStageEntry = function(baseElem) {
- var stageIdText = $($(baseElem).find(".job-timeline-content")[0]).text();
- var stageIdAndAttempt = stageIdText.match("\\(Stage (\\d+\\.\\d+)\\)$")[1].split(".");
- return "#stage-" + stageIdAndAttempt[0] + "-" + stageIdAndAttempt[1];
- };
-
$(this).click(function() {
- var stagePagePath = $(getSelectorForStageEntry(this)).find("a.name-link").attr("href")
- window.location.href = stagePagePath
+ var stageIdAndAttempt = getStageIdAndAttemptForStageEntry(this);
+ var stagePagePath = uiRoot + appBasePath +
+ "/stages/stage/?id=" + stageIdAndAttempt[0] + "&attempt=" + stageIdAndAttempt[1];
+ window.location.href = stagePagePath;
});
$(this).hover(
function() {
- $(getSelectorForStageEntry(this)).addClass("corresponding-item-hover");
+ $(getSelectorForStageEntry(getStageIdAndAttemptForStageEntry(this)))
+ .addClass("corresponding-item-hover");
$($(this).find("div.job-timeline-content")[0]).tooltip("show");
},
function() {
- $(getSelectorForStageEntry(this)).removeClass("corresponding-item-hover");
+ $(getSelectorForStageEntry(getStageIdAndAttemptForStageEntry(this)))
+ .removeClass("corresponding-item-hover");
$($(this).find("div.job-timeline-content")[0]).tooltip("hide");
}
);
diff --git a/core/src/main/resources/org/apache/spark/ui/static/webui.js b/core/src/main/resources/org/apache/spark/ui/static/webui.js
index f01c567..f25d6da 100644
--- a/core/src/main/resources/org/apache/spark/ui/static/webui.js
+++ b/core/src/main/resources/org/apache/spark/ui/static/webui.js
@@ -16,11 +16,16 @@
*/
var uiRoot = "";
+var appBasePath = "";
function setUIRoot(val) {
uiRoot = val;
}
+function setAppBasePath(path) {
+ appBasePath = path;
+}
+
function collapseTablePageLoad(name, table){
if (window.localStorage.getItem(name) == "true") {
// Set it to false so that the click function can revert it
@@ -33,7 +38,7 @@ function collapseTable(thisName, table){
var status = window.localStorage.getItem(thisName) == "true";
status = !status;
- thisClass = '.' + thisName
+ var thisClass = '.' + thisName;
// Expand the list of additional metrics.
var tableDiv = $(thisClass).parent().find('.' + table);
diff --git a/core/src/main/scala/org/apache/spark/ui/UIUtils.scala b/core/src/main/scala/org/apache/spark/ui/UIUtils.scala
index cbaa5ce..9823a6f 100644
--- a/core/src/main/scala/org/apache/spark/ui/UIUtils.scala
+++ b/core/src/main/scala/org/apache/spark/ui/UIUtils.scala
@@ -238,6 +238,7 @@ private[spark] object UIUtils extends Logging {
<html>
<head>
{commonHeaderNodes(request)}
+ <script>setAppBasePath('{activeTab.basePath}')</script>
{if (showVisualization) vizHeaderNodes(request) else Seq.empty}
{if (useDataTables) dataTablesHeaderNodes(request) else Seq.empty}
<link rel="shortcut icon"
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@spark.apache.org
For additional commands, e-mail: commits-help@spark.apache.org