fix: hide Kepler editor tooltip “top-left jump” on invalid hover coords (#3294)

* fix tooltip coordinate

Signed-off-by: bdjulbic <bdjulbic@foursquare.com>

* reformat and add test

Signed-off-by: bdjulbic <bdjulbic@foursquare.com>

---------

Signed-off-by: bdjulbic <bdjulbic@foursquare.com>

Author: bdjulbic

src/components/src/map-container.tsx

@@ -858,12 +858,19 @@ export default function MapContainerFactory(
         getCursor?: ({isDragging}: {isDragging: boolean}) => string;
       } = {};
       if (primaryMap) {
-        extraDeckParams.getTooltip = info =>
-          EditorLayerUtils.getTooltip(info, {
+        // Omit hover updates when the pointer position is invalid, ie. over UI overlays or
+        // outside the map container. In those cases x/y may be < 0
+        extraDeckParams.getTooltip = info => {
+          const x = Number(info?.x);
+          const y = Number(info?.y);
+          if (Number.isNaN(x) || Number.isNaN(y) || x < 0 || y < 0) return null;
+
+          return EditorLayerUtils.getTooltip(info, {
             editorMenuActive,
             editor,
             theme
           });
+        };
 
         extraDeckParams.getCursor = ({isDragging}: {isDragging: boolean}) => {
           const editorCursor = EditorLayerUtils.getCursor({

test/browser-headless/component/map-container-test.js

@@ -116,6 +116,13 @@ test('MapContainerFactory - _renderDeckOverlay', t => {
   const divWrapper = instance._renderDeckOverlay(...args);
   const DeckGl = divWrapper.props.children;
 
+  t.ok(typeof DeckGl.props.getTooltip === 'function', 'DeckGl should receive getTooltip prop');
+  t.equal(
+    DeckGl.props.getTooltip({x: -1, y: -1, pixel: [-1, -1]}),
+    null,
+    'getTooltip should return null for invalid hover coordinates'
+  );
+
   const clickEvents = [];
   const hoverEvents = [];