[airflow] branch main updated: fix setting task nodes class names (#18607)

[bb...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

bbovenzi pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/airflow.git


The following commit(s) were added to refs/heads/main by this push:
     new 26680d4  fix setting task nodes class names (#18607)
26680d4 is described below

commit 26680d4a274c4bac036899167e6fea6351e73358
Author: David Caron <dc...@gmail.com>
AuthorDate: Wed Sep 29 12:30:44 2021 -0400

    fix setting task nodes class names (#18607)
    
    The stroke colour and tooltips were not set
    correctly for some tasks (depending on the ordering of `g.nodes`).
---
 airflow/www/static/js/graph.js | 43 +++++++++++++++++++++---------------------
 1 file changed, 21 insertions(+), 22 deletions(-)

diff --git a/airflow/www/static/js/graph.js b/airflow/www/static/js/graph.js
index a0f347b..097c861 100644
--- a/airflow/www/static/js/graph.js
+++ b/airflow/www/static/js/graph.js
@@ -467,29 +467,28 @@ function groupTooltip(node, tis) {
 function updateNodesStates(tis) {
   g.nodes().forEach((nodeId) => {
     const { elem } = g.node(nodeId);
-    if (!elem) {
-      return;
+    if (elem) {
+      const classes = `node enter ${getNodeState(nodeId, tis)}`;
+      elem.setAttribute('class', classes);
+      elem.setAttribute('data-toggle', 'tooltip');
+
+      const taskId = nodeId;
+      const node = g.node(nodeId);
+      elem.onmouseover = (evt) => {
+        let tt;
+        if (taskId in tis) {
+          tt = tiTooltip(tis[taskId]);
+        } else if (node.children) {
+          tt = groupTooltip(node, tis);
+        } else if (taskId in tasks) {
+          tt = taskNoInstanceTooltip(taskId, tasks[taskId]);
+          elem.setAttribute('class', `${classes} not-allowed`);
+        }
+        if (tt) taskTip.show(tt, evt.target); // taskTip is defined in graph.html
+      };
+      elem.onmouseout = taskTip.hide;
+      elem.onclick = taskTip.hide;
     }
-    const classes = `node enter ${getNodeState(nodeId, tis)}`;
-    elem.setAttribute('class', classes);
-    elem.setAttribute('data-toggle', 'tooltip');
-
-    const taskId = nodeId;
-    const node = g.node(nodeId);
-    elem.onmouseover = (evt) => {
-      let tt;
-      if (taskId in tis) {
-        tt = tiTooltip(tis[taskId]);
-      } else if (node.children) {
-        tt = groupTooltip(node, tis);
-      } else if (taskId in tasks) {
-        tt = taskNoInstanceTooltip(taskId, tasks[taskId]);
-        elem.setAttribute('class', `${classes} not-allowed`);
-      }
-      if (tt) taskTip.show(tt, evt.target); // taskTip is defined in graph.html
-    };
-    elem.onmouseout = taskTip.hide;
-    elem.onclick = taskTip.hide;
   });
 }