Tooltip not Working at HTML Map HTM

[dafnikaravola]

Describe the bug
Following Bug] #2528, I face the same issue: I am running the Kepler GL Demo Locally. I saved the HTML and then opened it from my own folder. When opening the HTML locally, the tooltip function does not work. Not when I click on data on the map, and also not when I hover over the data on the map.

To Reproduce
Steps to reproduce the behavior:

1. Go to Share, Export Map, HTML, Allow users to edit map, and Export
2. Click on downloaded HTML in download folder
3. Hover over datapoints on map
4. Nothing happens

Expected behavior
I expect the tooltip to pop up when hovering over the datapoints on the map.

**Desktop
Chrome & Opera (tried both)
Version 3.0.0

Additional context
Other users #2528 reported issue fixed by changing kepler.gl version to older one (2.5.5 for example). I tried several older versions but none of them work.

[liuwo23]

I will try fixed it

[liuwo23]

I found the issue, it was due to the version of React. In the mouse event propagation, when it passed from the component to the “__onMouseMoveDebounced” function, all the values in the event were lost. When I changed the React version in the exported HTML to 17.0.1 and 18.4.0, the issue disappeared. So, the bug lies with the React version 16.14.0.

[liuwo23]

The current React version in the project is 18.2.0, while in the exported HTML it is 16.14.0, which is causing this bug due to version inconsistency.

[dafnikaravola]

Hi, thanks for taking the time.

I tried to replace the React version in the HTML (screenshot below). However, version 18.4.0 does not load the map at all, whereas version 17.0.1 loads the map but not the tooltips

[liuwo23]

Hi, thanks for taking the time.

I tried to replace the React version in the HTML (screenshot below). However, version 18.4.0 does not load the map at all, whereas version 17.0.1 loads the map but not the tooltips

You also need to change the version of react-dom. You can try the following scripts：

Explain
<script src="https://unpkg.com/react@18.2.0/umd/react.production.min.js" crossorigin></script> <script src="https://unpkg.com/react-dom@18.2.0/umd/react-dom.production.min.js" crossorigin></script> <script src="https://unpkg.com/redux@4.2.1/dist/redux.js" crossorigin></script> <script src="https://unpkg.com/react-redux@8.1.2/dist/react-redux.min.js" crossorigin></script> <script src="https://unpkg.com/styled-components@4.4.1/dist/styled-components.min.js" crossorigin></script>

[liuwo23]

[mccahan]

@liuwo23 do you happen to know when your fix will make it into a release?

[liuwo23]

@liuwo23 do you happen to know when your fix will make it into a release?

@mccahan This needs to be reminded to the project manager. @ibgreen