Release 0.0.26 (#82)

Author: lewis-sanchez

SECURITY.md

@@ -0,0 +1,41 @@
+<!-- BEGIN MICROSOFT SECURITY.MD V0.0.7 BLOCK -->
+
+## Security
+
+Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/).
+
+If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](https://aka.ms/opensource/security/definition), please report it to us as described below.
+
+## Reporting Security Issues
+
+**Please do not report security vulnerabilities through public GitHub issues.**
+
+Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://aka.ms/opensource/security/create-report).
+
+If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com).  If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://aka.ms/opensource/security/pgpkey).
+
+You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://aka.ms/opensource/security/msrc). 
+
+Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue:
+
+  * Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.)
+  * Full paths of source file(s) related to the manifestation of the issue
+  * The location of the affected source code (tag/branch/commit or direct URL)
+  * Any special configuration required to reproduce the issue
+  * Step-by-step instructions to reproduce the issue
+  * Proof-of-concept or exploit code (if possible)
+  * Impact of the issue, including how an attacker might exploit the issue
+
+This information will help us triage your report more quickly.
+
+If you are reporting for a bug bounty, more complete reports can contribute to a higher bounty award. Please visit our [Microsoft Bug Bounty Program](https://aka.ms/opensource/security/bounty) page for more details about our active programs.
+
+## Preferred Languages
+
+We prefer all communications to be in English.
+
+## Policy
+
+Microsoft follows the principle of [Coordinated Vulnerability Disclosure](https://aka.ms/opensource/security/cvd).
+
+<!-- END MICROSOFT SECURITY.MD BLOCK -->

dist/build.js

@@ -92858,6 +92858,8 @@ const GRAPH_PADDING_BOTTOM = 80;
 const GRAPH_PADDING_LEFT = 80;
 const CELL_WIDTH = 70;
 const CELL_HEIGHT = 70;
+const STANDARD_NODE_DISTANCE = 173;
+const IDEAL_LONG_LABEL_NODE_DISTANCE = 240;
 
 class PolygonRoot {
     constructor(cell, fillColor, strokeColor, strokeWidth) {
@@ -92915,7 +92917,7 @@ class GraphNodeLayoutHelper {
             else {
                 this.layoutPoints.push(new Point(xPosition, yPosition));
             }
-            
+
             return;
         }
 
@@ -93152,12 +93154,7 @@ azdataQueryPlan.prototype.init = function (container, iconPaths, badgeIconPaths)
             let splitLabel = cell.value.label.split(/\r\n|\n/);
             let cellLabel = splitLabel.map(str => {
                 let label = '';
-                if (str.length > 20) {
-                    label += str.substring(0, 17) + '...';
-                }
-                else {
-                    label += str;
-                }
+                label += str;
 
                 return label;
             });
@@ -93303,16 +93300,16 @@ azdataQueryPlan.prototype.placeGraphNodes = function () {
     var startY = (this.paddingY + 150) / 2;
 
     // Recursively layout all nodes starting with root
-    this.SetNodePositionRecursive(this.queryPlanGraph, startX, startY);
+    this.setNodePositionRecursive(this.queryPlanGraph, startX, startY);
 }
 
-azdataQueryPlan.prototype.SetNodePositionRecursive = function (node, x, y) {
+azdataQueryPlan.prototype.setNodePositionRecursive = function (node, x, y) {
 
     // Recursively setting all the x positions in the graph.
     this.setNodeXPositionRecursive(node, x);
     var layoutHelper = new GraphNodeLayoutHelper();
     this.setNodeYPositionRecursive(node, layoutHelper, this.spacingY, y);
-
+    this.adjustGraphNodeHorizontalPositions(node);
 }
 
 azdataQueryPlan.prototype.setNodeXPositionRecursive = function (node, x) {
@@ -93324,7 +93321,7 @@ azdataQueryPlan.prototype.setNodeXPositionRecursive = function (node, x) {
 
     // Using a mxUtils function to determine how much space is needed for the label.
     // Cleaning the label string as mention in the mxGraph docs https://jgraph.github.io/mxgraph/docs/js-api/files/util/mxUtils-js.html#mxUtils.getSizeForString 
-    var cleanedLabel = node.label.replace(/\n/g, "<br>");
+    var cleanedLabel = node.label.replace(/\n|\r\n/g, "<br>");
 
     // Assuming default stylings for 
     var size = mxUtils.getSizeForString(cleanedLabel, mxConstants.DEFAULT_FONTSIZE,
@@ -93346,12 +93343,11 @@ azdataQueryPlan.prototype.setNodeXPositionRecursive = function (node, x) {
     // This will later help us in determining the y coordinates for them.
     node.maxChildrenXPosition = node.position.x;
     // Display each child node at the X position just computed
-    node.children.forEach(n => {
-        n.parent = node;
-        this.setNodeXPositionRecursive(n, x);
-        node.maxChildrenXPosition = Math.max(node.maxChildrenXPosition, n.maxChildrenXPosition);
+    node.children.forEach(childNode => {
+        childNode.parent = node;
+        this.setNodeXPositionRecursive(childNode, x);
+        node.maxChildrenXPosition = Math.max(node.maxChildrenXPosition, childNode.maxChildrenXPosition);
     });
-
 }
 
 azdataQueryPlan.prototype.setNodeYPositionRecursive = function (node, layoutHelper, y) {
@@ -93372,6 +93368,65 @@ azdataQueryPlan.prototype.setNodeYPositionRecursive = function (node, layoutHelp
     layoutHelper.updateNodeLayout(leftPosition, yToUpdate);
 }
 
+azdataQueryPlan.prototype.adjustGraphNodeHorizontalPositions = function (node) {
+    let levelsTable = this.getNodesByHorizontalLevel(node);
+
+    Object.keys(levelsTable).map(key => {
+        for (let levelNodeIndex = 1; levelNodeIndex < levelsTable[key].length; ++levelNodeIndex) {
+            let previousNode = levelsTable[key][levelNodeIndex - 1];
+            let currentNode = levelsTable[key][levelNodeIndex]
+
+            let previousLabel = previousNode.label.split(/\r\n|\n/).filter(str => str.length > 20);
+            if (previousLabel.length !== 0) {
+                let distanceFromPreviousNode = currentNode.position.x - previousNode.position.x;
+                if (distanceFromPreviousNode <= STANDARD_NODE_DISTANCE) {
+                    let shiftToRightAmount = IDEAL_LONG_LABEL_NODE_DISTANCE - distanceFromPreviousNode;
+                    currentNode.position.x += shiftToRightAmount;
+
+                    this.shiftParentAndChildNodePositionsHorizontally(currentNode.parent, shiftToRightAmount);
+                }
+            }
+        }
+    });
+}
+
+azdataQueryPlan.prototype.shiftParentAndChildNodePositionsHorizontally = function (parent, shiftAmount) {
+    let stack = [...parent.children];
+
+    while (stack.length !== 0) {
+        let currentNode = stack.pop();
+        let currentNodeParent = currentNode.parent;
+        if (currentNode.position.x - currentNodeParent.position.x < IDEAL_LONG_LABEL_NODE_DISTANCE) {
+            currentNode.position.x += shiftAmount;
+        }
+
+        for (let childIndex = 0; childIndex < currentNode.children.length; ++childIndex) {
+            stack.push(currentNode.children[childIndex]);
+        }
+    }
+}
+
+azdataQueryPlan.prototype.getNodesByHorizontalLevel = function (node) {
+    let table = {};
+    let stack = [node];
+
+    while (stack.length !== 0) {
+        let entry = stack.pop();
+        if (entry.position.y in table) {
+            table[entry.position.y].push(entry);
+        }
+        else {
+            table[entry.position.y] = [];
+            table[entry.position.y].push(entry);
+        }
+
+        for (let i = 0; i < entry.children.length; ++i) {
+            stack.push(entry.children[i]);
+        }
+    }
+
+    return table;
+}
 
 azdataQueryPlan.prototype.zoomIn = function () {
     if (this.graph.view.getScale() * this.graph.zoomFactor <= 2) {
@@ -93512,7 +93567,7 @@ azdataQueryPlan.prototype.redrawBadges = function () {
  * @param {*} strokeWidth thickness of the stroke
  */
 azdataQueryPlan.prototype.drawPolygon = function (cell, fillColor, strokeColor, strokeWidth) {
-    if(!this.polygonModels){
+    if (!this.polygonModels) {
         this.polygonModels = [];
     }
     this.polygonModels.push({
@@ -93536,26 +93591,29 @@ azdataQueryPlan.prototype.removeDrawnPolygons = function () {
 }
 
 azdataQueryPlan.prototype.renderPolygons = function () {
-    if(this.drawnPolygons?.length > 0){
+    if (this.drawnPolygons?.length > 0) {
         this.drawnPolygons.forEach(polygon => {
             polygon.destroy();
         });
     }
     this.drawnPolygons = [];
-    this.polygonModels.forEach(p => {
-        const points = this.getPolygonPerimeter(p.root);
-        const scale = this.graph.view.getScale();
-        var polygon = new mxPolygon(
-            points.map(point => new mxPoint(point.x * scale, point.y * scale)),
-            p.fillColor,
-            p.strokeColor,
-            p.strokeWidth
-        );
-        this.drawnPolygons.push(polygon);
-        polygon.init(this.graph.getView().getBackgroundPane());
-        polygon.isDashed = true;
-        polygon.redraw();
-    });
+
+    if (this.polygonModels) {
+        this.polygonModels.forEach(p => {
+            const points = this.getPolygonPerimeter(p.root);
+            const scale = this.graph.view.getScale();
+            var polygon = new mxPolygon(
+                points.map(point => new mxPoint(point.x * scale, point.y * scale)),
+                p.fillColor,
+                p.strokeColor,
+                p.strokeWidth
+            );
+            this.drawnPolygons.push(polygon);
+            polygon.init(this.graph.getView().getBackgroundPane());
+            polygon.isDashed = true;
+            polygon.redraw();
+        });
+    }
 }
 
 /**
@@ -93566,8 +93624,10 @@ azdataQueryPlan.prototype.renderPolygons = function () {
 azdataQueryPlan.prototype.getPolygonPerimeter = function (cell) {
     let points = [];
     points = points.concat(this.getLeftSidePoints(cell));
-    points = points.concat(this.getBottomSidePoints(cell));
-    points = points.concat(this.getRightSidePoints(cell));
+
+    let rightSidePoints = this.getRightSidePoints(cell);
+    points = points.concat(this.getBottomSidePoints(cell, rightSidePoints[0].x));
+    points = points.concat(rightSidePoints);
 
     return points;
 }
@@ -93584,7 +93644,7 @@ azdataQueryPlan.prototype.getLeftSidePoints = function (cell) {
     let points = [];
     let xPosition = cell.geometry.x - 15; // subtracting to push the x coordinate to the left.
     points.push({ x: xPosition, y: cell.geometry.y });
-    points.push({ x: xPosition, y: cell.geometry.y + NODE_HEIGHT })
+    points.push({ x: xPosition, y: cell.geometry.y + NODE_HEIGHT });
 
     return points;
 }
@@ -93594,27 +93654,66 @@ azdataQueryPlan.prototype.getLeftSidePoints = function (cell) {
  * @param {*} cell The starting node where highlighting will begin.
  * @returns An array of points for the bottom side of the polygon.
  */
-azdataQueryPlan.prototype.getBottomSidePoints = function (cell) {
+azdataQueryPlan.prototype.getBottomSidePoints = function (cell, polygonRightSideConstraint) {
     let points = [];
-    var stack = [cell];
+    let bottomSideLeafNodes = this.getBottomSideLeafNodes(cell, polygonRightSideConstraint);
+
+    for (let index = 0; index < bottomSideLeafNodes.length; ++index) {
+        let leafNode = bottomSideLeafNodes[index].value;
+        let leftOfLeafNode = leafNode;
+
+        // Finds the left most node directly to the left of the leaf node.
+        while (leftOfLeafNode.position.y === leftOfLeafNode.parent.position.y) {
+            leftOfLeafNode = leftOfLeafNode.parent;
+        }
+
+        if (points.length === 0) {
+            let parent = leftOfLeafNode.parent;
+            let auxiliaryPoint = { x: leftOfLeafNode.position.x - NODE_WIDTH, y: parent.position.y + NODE_HEIGHT };
+            points.push(auxiliaryPoint);
+        }
+        else if (points.length !== 0 && points[points.length - 1].y - NODE_HEIGHT !== leftOfLeafNode.position.y) {
+            let auxiliaryPoint = { x: leftOfLeafNode.position.x - NODE_WIDTH, y: points[points.length - 1].y };
+            points.push(auxiliaryPoint);
+        }
+
+        points.push({ x: leftOfLeafNode.position.x - NODE_WIDTH, y: leftOfLeafNode.position.y + NODE_HEIGHT });
+
+        if (leftOfLeafNode.position.x < leafNode.position.x) {
+            points.push({ x: leafNode.position.x + NODE_WIDTH, y: leafNode.position.y + NODE_HEIGHT});
+        }
+    }
+
+    return points;
+}
+
+azdataQueryPlan.prototype.getBottomSideLeafNodes = function (cell, polygonRightSideConstraint) {
+    let leafNodeTable = {};
+    let stack = [cell];
 
     while (stack.length !== 0) {
         let entry = stack.pop();
-        points.push({ x: entry.geometry.x + NODE_HEIGHT, y: entry.geometry.y + NODE_WIDTH });
-
-        if (entry?.value?.children?.length > 0) {
-            let nextNode = this.graph.model.getCell(entry.value.children[entry.value.children.length - 1].id);
 
-            if (entry.value.children.length > 1) {
-                let auxiliaryPoint = { x: entry.geometry.x + NODE_WIDTH, y: nextNode.geometry.y + NODE_HEIGHT };
-                points.push(auxiliaryPoint);
+        if (entry.value.children.length === 0 && entry.geometry.x <= polygonRightSideConstraint) {
+            if (entry.geometry.x in leafNodeTable) {
+                let previouslyCachedEntry = leafNodeTable[entry.geometry.x];
+                if (entry.geometry.y > previouslyCachedEntry.geometry.y) {
+                    leafNodeTable[entry.geometry.x] = entry;
+                }
+            }
+            else {
+                leafNodeTable[entry.geometry.x] = entry;
             }
+        }
 
-            stack.push(nextNode);
+        for (let nodeIndex = 0; nodeIndex < entry.value.children.length; ++nodeIndex) {
+            stack.push(this.graph.model.getCell(entry.value.children[nodeIndex].id));
         }
     }
 
-    return points;
+    let leafNodes = Object.keys(leafNodeTable).map(key => leafNodeTable[key])
+
+    return leafNodes;
 }
 
 /**
@@ -93629,8 +93728,12 @@ azdataQueryPlan.prototype.getRightSidePoints = function (cell) {
     for (let nodeIndex = 0; nodeIndex < leafNodes.length; ++nodeIndex) {
         let leafNode = leafNodes[nodeIndex];
 
-        points.push({ x: leafNode.geometry.x + NODE_WIDTH, y: leafNode.geometry.y + NODE_HEIGHT });
-        points.push({ x: leafNode.geometry.x + NODE_WIDTH, y: leafNode.geometry.y });
+        let longestSubLabel = Math.max(...(leafNode.value.label.split(/\r\n|\n/).map(str => str.length)));
+        // These values to work best for drawing regions around labels of different lengths, so the label is always inside the polygon.
+        let additionalRightSideSpacing = longestSubLabel % 10 * 25;
+
+        points.push({ x: leafNode.geometry.x + NODE_WIDTH + additionalRightSideSpacing, y: leafNode.geometry.y + NODE_HEIGHT });
+        points.push({ x: leafNode.geometry.x + NODE_WIDTH + additionalRightSideSpacing, y: leafNode.geometry.y });
     }
 
     return points;