tez-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From hit...@apache.org
Subject tez git commit: TEZ-3194. Tez UI: Swimlane improve in-progress experience. (Sreenath Somarajapuram via hitesh)
Date Fri, 08 Apr 2016 14:58:11 GMT
Repository: tez
Updated Branches:
  refs/heads/master 6ea7b24db -> 2d58e2535


TEZ-3194. Tez UI: Swimlane improve in-progress experience. (Sreenath Somarajapuram via hitesh)


Project: http://git-wip-us.apache.org/repos/asf/tez/repo
Commit: http://git-wip-us.apache.org/repos/asf/tez/commit/2d58e253
Tree: http://git-wip-us.apache.org/repos/asf/tez/tree/2d58e253
Diff: http://git-wip-us.apache.org/repos/asf/tez/diff/2d58e253

Branch: refs/heads/master
Commit: 2d58e2535a5746f30310bd1a19ae51ff769fe7d7
Parents: 6ea7b24
Author: Hitesh Shah <hitesh@apache.org>
Authored: Fri Apr 8 07:57:49 2016 -0700
Committer: Hitesh Shah <hitesh@apache.org>
Committed: Fri Apr 8 07:57:49 2016 -0700

----------------------------------------------------------------------
 CHANGES.txt                                     |   1 +
 .../components/em-swimlane-blocking-event.js    |  14 +-
 .../app/components/em-swimlane-event-bar.js     |  14 +-
 .../webapp/app/components/em-swimlane-event.js  |   9 +-
 .../app/components/em-swimlane-process-line.js  |  10 +-
 .../app/components/em-swimlane-vertex-name.js   |  11 +-
 .../main/webapp/app/controllers/dag/swimlane.js |  15 ++-
 .../src/main/webapp/app/styles/em-swimlane.less |  16 +++
 .../components/em-swimlane-process-visual.hbs   |   4 +-
 .../app/templates/components/em-swimlane.hbs    |   6 +-
 tez-ui2/src/main/webapp/app/utils/process.js    |   2 +-
 .../src/main/webapp/app/utils/vertex-process.js | 133 +++++++++++++------
 .../em-swimlane-process-visual-test.js          |   2 +
 .../components/em-swimlane-vertex-name-test.js  |   1 +
 .../tests/unit/utils/vertex-process-test.js     |  77 +++++++++--
 15 files changed, 226 insertions(+), 89 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/CHANGES.txt
----------------------------------------------------------------------
diff --git a/CHANGES.txt b/CHANGES.txt
index 0555d4e..83fe420 100644
--- a/CHANGES.txt
+++ b/CHANGES.txt
@@ -10,6 +10,7 @@ INCOMPATIBLE CHANGES
   TEZ-3199. Rename getCredentials in TaskCommunicatorContext to be less confusing.
 
 ALL CHANGES:
+  TEZ-3194. Tez UI: Swimlane improve in-progress experience.
   TEZ-3196. java.lang.InternalError from decompression codec is fatal to a task during shuffle
   TEZ-3161. Allow task to report different kinds of errors - fatal / kill.
   TEZ-3177. Non-DAG events should use the session domain or no domain if the data does not
need protection.

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/components/em-swimlane-blocking-event.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/components/em-swimlane-blocking-event.js b/tez-ui2/src/main/webapp/app/components/em-swimlane-blocking-event.js
index 1743540..a487699 100644
--- a/tez-ui2/src/main/webapp/app/components/em-swimlane-blocking-event.js
+++ b/tez-ui2/src/main/webapp/app/components/em-swimlane-blocking-event.js
@@ -44,12 +44,14 @@ export default Ember.Component.extend({
     if(blockTime && this.get("blocking.endEvent.time") >= blockTime) {
       blockerEventHeight = (this.get("blocking.index") - this.get("process.index")) * 30;
 
-      this.$().css({
-        "left": this.get("processor").timeToPositionPercent(blockTime) + "%"
-      });
-      this.$(".event-line").css({
-        "height": `${blockerEventHeight}px`,
-        "border-color": this.get("process").getColor()
+      Ember.run.later(this, function () {
+        this.$().css({
+          "left": this.get("processor").timeToPositionPercent(blockTime) + "%"
+        });
+        this.$(".event-line").css({
+          "height": `${blockerEventHeight}px`,
+          "border-color": this.get("process").getColor()
+        });
       });
     }
   }),

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/components/em-swimlane-event-bar.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/components/em-swimlane-event-bar.js b/tez-ui2/src/main/webapp/app/components/em-swimlane-event-bar.js
index 11be2ff..224489b 100644
--- a/tez-ui2/src/main/webapp/app/components/em-swimlane-event-bar.js
+++ b/tez-ui2/src/main/webapp/app/components/em-swimlane-event-bar.js
@@ -52,12 +52,14 @@ export default Ember.Component.extend({
         color = this.get("bar.color") || this.get("process").getBarColor(this.get("barIndex"));
 
     if(fromEventPos && toEventPos) {
-      this.$().show();
-      this.$(".event-bar").css({
-        left: fromEventPos + "%",
-        right: (100 - toEventPos) + "%",
-        "background-color": color,
-        "border-color": this.get("process").getColor()
+      Ember.run.later(this, function () {
+        this.$().show();
+        this.$(".event-bar").css({
+          left: fromEventPos + "%",
+          right: (100 - toEventPos) + "%",
+          "background-color": color,
+          "border-color": this.get("process").getColor()
+        });
       });
     }
     else {

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/components/em-swimlane-event.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/components/em-swimlane-event.js b/tez-ui2/src/main/webapp/app/components/em-swimlane-event.js
index 20dc943..4eef7f0 100644
--- a/tez-ui2/src/main/webapp/app/components/em-swimlane-event.js
+++ b/tez-ui2/src/main/webapp/app/components/em-swimlane-event.js
@@ -30,11 +30,14 @@ export default Ember.Component.extend({
   didInsertElement: Ember.observer("event.time", "processor.timeWindow", function () {
     var color = this.get("process").getColor();
 
-    this.$().css({
-      "left": this.get("processor").timeToPositionPercent(this.get("event.time")) + "%"
-    });
     this.$(".event-line").css("border-color", color);
     this.$(".event-bubble").css("border-color", color);
+
+    Ember.run.later(this, function () {
+      this.$().css({
+        "left": this.get("processor").timeToPositionPercent(this.get("event.time")) + "%"
+      });
+    });
   }),
 
   sendMouseAction: function (name, mouseEvent) {

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/components/em-swimlane-process-line.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/components/em-swimlane-process-line.js b/tez-ui2/src/main/webapp/app/components/em-swimlane-process-line.js
index 2309004..2d6e2b6 100644
--- a/tez-ui2/src/main/webapp/app/components/em-swimlane-process-line.js
+++ b/tez-ui2/src/main/webapp/app/components/em-swimlane-process-line.js
@@ -29,10 +29,12 @@ export default Ember.Component.extend({
         startPos = processor.timeToPositionPercent(this.get("process.startEvent.time")),
         endPos = processor.timeToPositionPercent(this.get("process.endEvent.time"));
 
-    this.$(".process-line").css({
-      left: startPos + "%",
-      right: (100 - endPos) + "%",
-      "background-color": this.get("process").getColor()
+    Ember.run.later(this, function () {
+      this.$(".process-line").css({
+        left: startPos + "%",
+        right: (100 - endPos) + "%",
+        "background-color": this.get("process").getColor()
+      });
     });
   }),
 

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/components/em-swimlane-vertex-name.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/components/em-swimlane-vertex-name.js b/tez-ui2/src/main/webapp/app/components/em-swimlane-vertex-name.js
index 136125a..36a7bbc 100644
--- a/tez-ui2/src/main/webapp/app/components/em-swimlane-vertex-name.js
+++ b/tez-ui2/src/main/webapp/app/components/em-swimlane-vertex-name.js
@@ -32,10 +32,13 @@ export default Ember.Component.extend({
     });
   },
 
-  progressText: Ember.computed("process.vertex.progress", function () {
-    var percent = parseInt(this.get("process.vertex.progress") * 100);
-    if(!isNaN(percent) && percent > 0 && percent < 100) {
-      return `${percent}%`;
+  progressText: Ember.computed("process.vertex.finalStatus", "process.vertex.progress", function
() {
+    if(this.get("process.vertex.finalStatus") === "RUNNING") {
+      let progress = this.get("process.vertex.progress");
+      if(!isNaN(progress)) {
+        let percent = parseInt(progress * 100);
+        return `${percent}%`;
+      }
     }
   }),
 

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/controllers/dag/swimlane.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/controllers/dag/swimlane.js b/tez-ui2/src/main/webapp/app/controllers/dag/swimlane.js
index 466f080..259d72f 100644
--- a/tez-ui2/src/main/webapp/app/controllers/dag/swimlane.js
+++ b/tez-ui2/src/main/webapp/app/controllers/dag/swimlane.js
@@ -124,12 +124,15 @@ export default MultiTableController.extend({
     });
 
     // Add process(vertex) dependencies based on dagPlan
-    dagPlanEdges.forEach(function (edge) {
-      var process = processHash[edge.outputVertexName];
-      if(process && processHash[edge.inputVertexName]) {
-        process.blockers.push(processHash[edge.inputVertexName]);
-      }
-    });
+    if(dagPlanEdges) {
+      dagPlanEdges.forEach(function (edge) {
+        var process = processHash[edge.outputVertexName];
+        if(process && processHash[edge.inputVertexName]) {
+          process.blockers.push(processHash[edge.inputVertexName]);
+          process.edgeHash.set(edge.inputVertexName, edge);
+        }
+      });
+    }
 
     return Ember.A(processes);
   }),

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/styles/em-swimlane.less
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/styles/em-swimlane.less b/tez-ui2/src/main/webapp/app/styles/em-swimlane.less
index b229a82..77ea646 100644
--- a/tez-ui2/src/main/webapp/app/styles/em-swimlane.less
+++ b/tez-ui2/src/main/webapp/app/styles/em-swimlane.less
@@ -17,6 +17,7 @@
  */
 
 @process-height: 30px;
+@event-anim-duration: .2s;
 
 .em-swimlane {
   position: relative;
@@ -169,6 +170,10 @@
   .process-line {
     top: unit(unit(@process-height) * 0.5 - 1, get-unit(@process-height));
     height: 3px;
+
+    left: 0%;
+    right: 100%;
+    transition: left @event-anim-duration ease-out, right @event-anim-duration ease-out;
   }
 
   .event-bar {
@@ -178,11 +183,18 @@
     border-radius: 2px;
     border: 1px solid;
     margin-right: -1px;
+
+    left: 0%;
+    right: 100%;
+    transition: left @event-anim-duration ease-out, right @event-anim-duration ease-out;
   }
 
   .em-swimlane-event {
     top: unit(unit(@process-height) * 0.5, get-unit(@process-height));
 
+    left: 0%;
+    transition: left @event-anim-duration ease-out;
+
     .event-line {
       position: absolute;
       top: -9px;
@@ -210,6 +222,10 @@
   .em-swimlane-blocking-event {
     top: unit(unit(@process-height) * 0.5, get-unit(@process-height));
 
+    left: 0%;
+    height: 0;
+    transition: left @event-anim-duration ease-out, height @event-anim-duration ease-out;
+
     .event-line {
       position: absolute;
       top: 0px;

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
b/tez-ui2/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
index 5f2f204..2c6a9e2 100644
--- a/tez-ui2/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
+++ b/tez-ui2/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
@@ -24,7 +24,7 @@
   hideTooltip="hideTooltip"
   click="click"
 }}
-{{#each process.blocking as |blocking|}}
+{{#each process.blocking key="_id" as |blocking|}}
   {{em-swimlane-blocking-event
     process=process
     blocking=blocking
@@ -45,7 +45,7 @@
     click="click"
   }}
 {{/each}}
-{{#each process.events as |event|}}
+{{#each process.events key="name" as |event|}}
   {{em-swimlane-event
     process=process
     event=event

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/templates/components/em-swimlane.hbs
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/templates/components/em-swimlane.hbs b/tez-ui2/src/main/webapp/app/templates/components/em-swimlane.hbs
index e55c202..9857cbb 100644
--- a/tez-ui2/src/main/webapp/app/templates/components/em-swimlane.hbs
+++ b/tez-ui2/src/main/webapp/app/templates/components/em-swimlane.hbs
@@ -17,7 +17,7 @@
 }}
 
 <div class="process-names">
-  {{#each normalizedProcesses as |process|}}
+  {{#each normalizedProcesses key="_id" as |process|}}
     {{component nameComponent
       process=process
       showTooltip="showTooltip"
@@ -30,7 +30,7 @@
   </div>
 </div><div class="process-visuals">
   <div class="zoom-panel">
-    {{#each normalizedProcesses as |process|}}
+    {{#each normalizedProcesses key="_id" as |process|}}
       {{component visualComponent
         process=process
         processor=processor
@@ -42,7 +42,7 @@
 
     {{#if consolidate}}
       <div class="consolidated-view">
-        {{#each normalizedProcesses as |process|}}
+        {{#each normalizedProcesses key="_id" as |process|}}
           {{em-swimlane-consolidated-process
             focusedProcess=focusedProcess
             process=process

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/utils/process.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/utils/process.js b/tez-ui2/src/main/webapp/app/utils/process.js
index 2920f39..3ac6720 100644
--- a/tez-ui2/src/main/webapp/app/utils/process.js
+++ b/tez-ui2/src/main/webapp/app/utils/process.js
@@ -23,7 +23,7 @@ export default Ember.Object.extend({
   _id: null,
 
   name: null,
-  events: [],
+  events: [], // An array of objects with name and time as mandatory(else error) properties.
   eventBars: null,
 
   index: 0,

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/app/utils/vertex-process.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/app/utils/vertex-process.js b/tez-ui2/src/main/webapp/app/utils/vertex-process.js
index 64de314..626cd22 100644
--- a/tez-ui2/src/main/webapp/app/utils/vertex-process.js
+++ b/tez-ui2/src/main/webapp/app/utils/vertex-process.js
@@ -32,14 +32,21 @@ export default Process.extend({
 
   getVisibleProps: null,
 
+  edgeHash: null,
+
   eventBars: [{
-    fromEvent: "VERTEX_TASK_START",
-    toEvent: "VERTEX_TASK_FINISH",
+    fromEvent: "FIRST_TASK_STARTED",
+    toEvent: "LAST_TASK_FINISHED",
   }, {
     fromEvent: "DEPENDENT_VERTICES_COMPLETE",
-    toEvent: "VERTEX_TASK_FINISH",
+    toEvent: "LAST_TASK_FINISHED",
   }],
 
+  init: function () {
+    this._super();
+    this.set("edgeHash", Ember.Object.create());
+  },
+
   eventsHash: Ember.computed("vertex.events.@each.timestamp", function () {
     var events = {},
         eventsArr = this.get("vertex.events");
@@ -61,7 +68,7 @@ export default Process.extend({
 
   events: Ember.computed("eventsHash",
     "vertex.initTime", "vertex.startTime", "vertex.endTime",
-    "vertex.firstTaskStartTime", "vertex.lastTaskFinishTime", "unblockTime",
+    "vertex.firstTaskStartTime", "vertex.lastTaskFinishTime", "unblockDetails",
     function () {
       var events = [],
           eventsHash = this.get("eventsHash"),
@@ -72,7 +79,7 @@ export default Process.extend({
 
           firstTaskStartTime = this.get("vertex.firstTaskStartTime"),
           lastTaskFinishTime = this.get("vertex.lastTaskFinishTime"),
-          unblockTime = this.get("unblockTime");
+          unblockDetails = this.get("unblockDetails");
 
       if(initTime > 0) {
         eventsHash["VERTEX_INITIALIZED"] = {
@@ -89,22 +96,23 @@ export default Process.extend({
       }
 
       if(firstTaskStartTime > 0) {
-        eventsHash["VERTEX_TASK_START"] = {
-          name: "VERTEX_TASK_START",
+        eventsHash["FIRST_TASK_STARTED"] = {
+          name: "FIRST_TASK_STARTED",
           time: firstTaskStartTime
         };
       }
 
-      if(unblockTime > 0 && unblockTime >= firstTaskStartTime) {
+      if(unblockDetails && unblockDetails.time >= firstTaskStartTime) {
         eventsHash["DEPENDENT_VERTICES_COMPLETE"] = {
           name: "DEPENDENT_VERTICES_COMPLETE",
-          time: unblockTime
+          time: unblockDetails.time,
+          edge: unblockDetails.edge
         };
       }
 
       if(lastTaskFinishTime > 0) {
-        eventsHash["VERTEX_TASK_FINISH"] = {
-          name: "VERTEX_TASK_FINISH",
+        eventsHash["LAST_TASK_FINISHED"] = {
+          name: "LAST_TASK_FINISHED",
           time: lastTaskFinishTime
         };
       }
@@ -124,28 +132,59 @@ export default Process.extend({
     }
   ),
 
-  unblockTime: Ember.computed("blockers.@each.completeTime", function () {
+  unblockDetails: Ember.computed("blockers.@each.completeTime", function () {
     var blockers = this.get("blockers"),
-        time;
+        data = {
+          time: 0
+        };
 
     if(blockers) {
-      time = 0;
-      for(var i = 0, length = blockers.length; i < length; i++) {
-        let blockerComplete = blockers[i].get("completeTime");
+      blockers.every(function (currentBlocker) {
+        var blockerComplete = currentBlocker.get("completeTime");
 
         if(!blockerComplete) {
-          time = undefined;
-          break;
+          this.blocker = undefined;
+          return false;
         }
-        else if(blockerComplete > time) {
-          time = blockerComplete;
+        else if(blockerComplete > this.time) {
+          this.blocker = currentBlocker;
+          this.time = blockerComplete;
         }
-      }
+
+        return true;
+      }, data);
     }
 
-    return time;
+    if(data.blocker) {
+      return {
+        time: data.blocker.get("completeTime"),
+        edge: this.get("edgeHash").get(data.blocker.get("name"))
+      };
+    }
   }),
 
+  getTipProperties: function (propHash, propArray) {
+    propArray = propArray || [];
+
+    MoreObject.forEach(propHash, function (key, value) {
+      if(MoreObject.isString(value)) {
+        propArray.push({
+          name: key,
+          value: value,
+        });
+      }
+      else if (MoreObject.isNumber(value)) {
+        propArray.push({
+          name: key,
+          value: value,
+          type: "number"
+        });
+      }
+    });
+
+    return propArray;
+  },
+
   getTooltipContents: function (type, options) {
     var contents,
         that = this,
@@ -174,6 +213,7 @@ export default Process.extend({
         }];
       break;
       case "event":
+        var edge;
         contents = options.events.map(function (event) {
           var properties = [{
             name: "Time",
@@ -181,28 +221,36 @@ export default Process.extend({
             type: "date"
           }];
 
+          if(event.edge) {
+            edge = event.edge;
+          }
           if(event.info) {
-            MoreObject.forEach(event.info, function (key, value) {
-              if(MoreObject.isString(value)) {
-                properties.push({
-                  name: key,
-                  value: value,
-                });
-              }
-              else if (MoreObject.isNumber(value)) {
-                properties.push({
-                  name: key,
-                  value: value,
-                  type: "number"
-                });
-              }
-            });
+            properties = this.getTipProperties(event.info, properties);
           }
+
           return {
             title: event.name,
             properties: properties
           };
-        });
+        }, this);
+
+        if(edge) {
+          let sourceClass = edge.edgeSourceClass || "",
+              destClass = edge.edgeDestinationClass || "";
+
+          contents.push({
+            title: "Edge From Final Dependent Vertex",
+            properties: this.getTipProperties({
+              "Input Vertex": edge.inputVertexName,
+              "Output Vertex": edge.outputVertexName,
+              "Data Movement": edge.dataMovementType,
+              "Data Source": edge.dataSourceType,
+              "Scheduling": edge.schedulingType,
+              "Source Class": sourceClass.substr(sourceClass.lastIndexOf(".") + 1),
+              "Destination Class": destClass.substr(destClass.lastIndexOf(".") + 1),
+            })
+          });
+        }
       break;
     }
 
@@ -210,13 +258,16 @@ export default Process.extend({
   },
 
   consolidateStartTime: Ember.computed("vertex.firstTaskStartTime",
-      "vertex.unblockTime", function () {
-        return Math.max(this.get("vertex.firstTaskStartTime") || 0, this.get("unblockTime")
|| 0);
+      "unblockDetails.time", function () {
+        return Math.max(
+          this.get("vertex.firstTaskStartTime") || 0,
+          this.get("unblockDetails.time") || 0
+        );
   }),
   consolidateEndTime: Ember.computed.oneWay("vertex.endTime"),
 
   getConsolidateColor: function () {
-    return this.getBarColor(this.get("unblockTime") ? 1 : 0);
+    return this.getBarColor(this.get("unblockDetails") ? 1 : 0);
   },
 
 });

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-process-visual-test.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-process-visual-test.js
b/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-process-visual-test.js
index 393a13a..20bdba9 100644
--- a/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-process-visual-test.js
+++ b/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-process-visual-test.js
@@ -51,8 +51,10 @@ test('Basic creation test', function(assert) {
 test('Events test', function(assert) {
   this.set("process", Process.create({
     events: [{
+      name: "event1",
       time: 5
     }, {
+      name: "event2",
       time: 7
     }]
   }));

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-vertex-name-test.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-vertex-name-test.js
b/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-vertex-name-test.js
index 44a4411..f085be3 100644
--- a/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-vertex-name-test.js
+++ b/tez-ui2/src/main/webapp/tests/integration/components/em-swimlane-vertex-name-test.js
@@ -55,6 +55,7 @@ test('Name test', function(assert) {
 test('Progress test', function(assert) {
   this.set("process", Process.create({
     vertex: {
+      finalStatus: "RUNNING",
       progress: 0.5
     }
   }));

http://git-wip-us.apache.org/repos/asf/tez/blob/2d58e253/tez-ui2/src/main/webapp/tests/unit/utils/vertex-process-test.js
----------------------------------------------------------------------
diff --git a/tez-ui2/src/main/webapp/tests/unit/utils/vertex-process-test.js b/tez-ui2/src/main/webapp/tests/unit/utils/vertex-process-test.js
index dfad264..3faa4fe 100644
--- a/tez-ui2/src/main/webapp/tests/unit/utils/vertex-process-test.js
+++ b/tez-ui2/src/main/webapp/tests/unit/utils/vertex-process-test.js
@@ -34,7 +34,7 @@ test('Basic creation test', function(assert) {
 
   assert.ok(process.events);
   assert.ok(process.eventBars);
-  assert.ok(process.unblockTime);
+  assert.ok(process.unblockDetails);
 
   assert.ok(process.eventsHash);
   assert.ok(process.getTooltipContents);
@@ -44,40 +44,54 @@ test('Basic creation test', function(assert) {
   assert.ok(process.getConsolidateColor);
 });
 
-test('unblockTime test', function(assert) {
-  var process = VertexProcess.create();
-  assert.equal(process.get("unblockTime"), undefined);
+test('unblockDetails test', function(assert) {
+  var process = VertexProcess.create(),
+      testEdge2 = {}, testEdge3 = {}, testEdge4 = {};
+  assert.equal(process.get("unblockDetails"), undefined);
 
   process = VertexProcess.create({
     blockers: [VertexProcess.create({
       vertex: {
+        name: "v1",
         endTime: 10
       }
     }), VertexProcess.create({
       vertex: {
+        name: "v2",
         endTime: 15
       }
     }), VertexProcess.create({
       vertex: {
+        name: "v3",
         endTime: 20
       }
     })]
   });
+  process.get("edgeHash").setProperties({
+    v2: testEdge2,
+    v3: testEdge3,
+    v4: testEdge4
+  });
 
-  assert.ok(process.get("unblockTime"), 20);
+  assert.equal(process.get("unblockDetails.edge"), testEdge3);
+  assert.equal(process.get("unblockDetails.time"), 20);
 
   process.blockers[2].set("vertex", Ember.Object.create({
+    name: "v4",
     endTime: 12
   }));
-  assert.ok(process.get("unblockTime"), 15);
+  assert.equal(process.get("unblockDetails.edge"), testEdge2);
+  assert.equal(process.get("unblockDetails.time"), 15);
 
   process.blockers[2].vertex.set("endTime", 25);
-  assert.ok(process.get("unblockTime"), 25);
+  assert.equal(process.get("unblockDetails.edge"), testEdge4);
+  assert.equal(process.get("unblockDetails.time"), 25);
 });
 
 test('events test', function(assert) {
   var process = VertexProcess.create({
     vertex: Ember.Object.create({
+      name: "v1",
       events: [{
         eventtype: "testEvent1"
         //No timestamp, will be removed
@@ -98,8 +112,8 @@ test('events test', function(assert) {
   assert.equal(process.get("events.0.name"), "testEvent2");
   assert.equal(process.get("events.1.name"), "VERTEX_INITIALIZED");
   assert.equal(process.get("events.2.name"), "VERTEX_STARTED");
-  assert.equal(process.get("events.3.name"), "VERTEX_TASK_START");
-  assert.equal(process.get("events.4.name"), "VERTEX_TASK_FINISH");
+  assert.equal(process.get("events.3.name"), "FIRST_TASK_STARTED");
+  assert.equal(process.get("events.4.name"), "LAST_TASK_FINISHED");
   assert.equal(process.get("events.5.name"), "VERTEX_FINISHED");
 
   assert.equal(process.get("events.0.time"), 10);
@@ -112,6 +126,7 @@ test('events test', function(assert) {
   // unblockTime < firstTaskStartTime, and we don't consider as a relevant event
   process.set("blockers", [VertexProcess.create({
     vertex: Ember.Object.create({
+      name: "v2",
       endTime: 30
     })
   })]);
@@ -119,6 +134,7 @@ test('events test', function(assert) {
 
   process.set("blockers", [VertexProcess.create({
     vertex: Ember.Object.create({
+      name: "v3",
       endTime: 55
     })
   })]);
@@ -129,9 +145,8 @@ test('events test', function(assert) {
 });
 
 test('getTooltipContents-event test', function(assert) {
-  var process = VertexProcess.create();
-
-  var eventTooltip = process.getTooltipContents("event", {
+  var process = VertexProcess.create(),
+      eventTooltip = process.getTooltipContents("event", {
     events: [{
       name: "TestEventName1",
       time: 10
@@ -142,10 +157,23 @@ test('getTooltipContents-event test', function(assert) {
         inf1: "val1",
         inf2: 30
       }
+    }, {
+      name: "TestEventName3",
+      time: 40,
+      edge: {
+        edgeId: "221296172",
+        inputVertexName: "Map 4",
+        outputVertexName: "Map 1",
+        dataMovementType: "BROADCAST",
+        dataSourceType: "PERSISTED",
+        schedulingType: "SEQUENTIAL",
+        edgeSourceClass: "org.apache.tez.runtime.library.output.UnorderedKVOutput",
+        edgeDestinationClass: "org.apache.tez.runtime.library.input.UnorderedKVInput"
+      }
     }]
   });
 
-  assert.equal(eventTooltip.length, 2);
+  assert.equal(eventTooltip.length, 4);
 
   assert.equal(eventTooltip[0].title, "TestEventName1");
   assert.equal(eventTooltip[0].properties.length, 1);
@@ -166,6 +194,29 @@ test('getTooltipContents-event test', function(assert) {
   assert.equal(eventTooltip[1].properties[2].name, "inf2");
   assert.equal(eventTooltip[1].properties[2].value, 30);
   assert.equal(eventTooltip[1].properties[2].type, "number");
+
+  assert.equal(eventTooltip[2].title, "TestEventName3");
+  assert.equal(eventTooltip[2].properties.length, 1);
+  assert.equal(eventTooltip[2].properties[0].name, "Time");
+  assert.equal(eventTooltip[2].properties[0].value, 40);
+  assert.equal(eventTooltip[2].properties[0].type, "date");
+
+  assert.equal(eventTooltip[3].title, "Edge From Final Dependent Vertex");
+  assert.equal(eventTooltip[3].properties.length, 7);
+  assert.equal(eventTooltip[3].properties[0].name, "Input Vertex");
+  assert.equal(eventTooltip[3].properties[0].value, "Map 4");
+  assert.equal(eventTooltip[3].properties[1].name, "Output Vertex");
+  assert.equal(eventTooltip[3].properties[1].value, "Map 1");
+  assert.equal(eventTooltip[3].properties[2].name, "Data Movement");
+  assert.equal(eventTooltip[3].properties[2].value, "BROADCAST");
+  assert.equal(eventTooltip[3].properties[3].name, "Data Source");
+  assert.equal(eventTooltip[3].properties[3].value, "PERSISTED");
+  assert.equal(eventTooltip[3].properties[4].name, "Scheduling");
+  assert.equal(eventTooltip[3].properties[4].value, "SEQUENTIAL");
+  assert.equal(eventTooltip[3].properties[5].name, "Source Class");
+  assert.equal(eventTooltip[3].properties[5].value, "UnorderedKVOutput");
+  assert.equal(eventTooltip[3].properties[6].name, "Destination Class");
+  assert.equal(eventTooltip[3].properties[6].value, "UnorderedKVInput");
 });
 
 test('getTooltipContents-process test', function(assert) {


Mime
View raw message