DevTools: do not render the inspect tool title if it covers the elements.

Bug: 947458
Change-Id: I117238860ade9c6fb86c4310c07c501306201196
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1562575
Commit-Queue: Pavel Feldman <pfeldman@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#649769}

third_party/blink/renderer/core/inspector/inspect_tool_highlight.html

@@ -594,6 +594,18 @@ function _createMaterialTooltip(parentElement, bounds, contentElement, withArrow
         boxY = canvasHeight - arrowHalfWidth - titleHeight;
     }
 
+    // If tooltip intersects with the bounds, hide it.
+    if (boxX < bounds.maxX && boxX + titleWidth > bounds.minX &&
+        boxY < bounds.maxY && boxY + titleHeight > bounds.minY) {
+      tooltipContent.style.display = 'none';
+      return;
+    }
+
+    if (boxX + titleWidth >= bounds.minX && boxX + titleWidth <= bounds.maxX && boxY + titleHeight >= bounds.minY && boxY + titleHeight <= bounds.maxY) {
+      tooltipContent.style.display = 'none';
+      return;
+    }
+
     tooltipContent.style.top = boxY + "px";
     tooltipContent.style.left = boxX + "px";
     tooltipContent.style.setProperty('--arrow-visibility', arrowHidden ? 'hidden' : 'visible');