Merge pull request #1987 from s7tya/fix-gray-border

Avoid showing gray rectangle when width is negative

Author: Kobzol

site/frontend/src/pages/compare/compile/table/benchmark-detail-graph.vue

@@ -161,11 +161,15 @@ function drawCurrentDate(opts: GraphRenderOpts, date: Date) {
       let ctx = u.ctx;
       const x = u.valToPos(date.getTime() / 1000, "x", true);
 
+      // Ignore if the width is negative
+      const width = u.bbox.width - x + u.bbox.left;
+      if (width <= 0) return;
+
       // Draw a translucent rectangle representing the region that is more
       // recent than `date`.
       ctx.save();
       ctx.fillStyle = "rgba(0, 0, 0, 0.07)";
-      ctx.rect(x, u.bbox.top, u.bbox.width - x + u.bbox.left, u.bbox.height);
+      ctx.rect(x, u.bbox.top, width, u.bbox.height);
       ctx.fill();
       ctx.restore();
     },

site/frontend/src/pages/compare/runtime/benchmark-detail-graph.vue

@@ -151,11 +151,15 @@ function drawCurrentDate(opts: GraphRenderOpts, date: Date) {
       let ctx = u.ctx;
       const x = u.valToPos(date.getTime() / 1000, "x", true);
 
+      // Ignore if the width is negative
+      const width = u.bbox.width - x + u.bbox.left;
+      if (width <= 0) return;
+
       // Draw a translucent rectangle representing the region that is more
       // recent than `date`.
       ctx.save();
       ctx.fillStyle = "rgba(0, 0, 0, 0.07)";
-      ctx.rect(x, u.bbox.top, u.bbox.width - x + u.bbox.left, u.bbox.height);
+      ctx.rect(x, u.bbox.top, width, u.bbox.height);
       ctx.fill();
       ctx.restore();
     },