Describe the bug
When a tooltip or popover contains a URL (e.g.
on the tooltip), the loaded resource is not unloaded when the tooltip is closed. Repeatedly opening and closing such tooltips causes memory usage in the browser (Safari/macOS) to increase indefinitely, eventually leading to excessive memory consumption.
Context: I use an external service to serve images and videos from an iPhone in the tooltip. Apologies, I used copilot to draft this ticket when looking at the map-popover file (I'm not a typescript programmer).
To Reproduce
Steps to reproduce the behavior:
- Go to a kepler.gl map on macOS Safari
- Hover over a map feature to display a tooltip containing an image, video, or iframe loaded from a URL.
- Close the tooltip/popover.
- Repeat steps 2–3 multiple times (depends on the resource size) started as soon as I loaded a few videos.
- Observe memory usage in Safari Web Inspector or Activity Monitor. Memory grows steadily with each cycle; resources are never released.
Expected behavior
When the tooltip/popover is closed or unmounted, any loaded resources (iframes, blob: URLs, images, videos, etc.) should be properly unloaded and released, so memory usage returns to baseline.
Screenshots
N/A (Observed with memory/heap growth in Safari Web Inspector and Activity Monitor)
Desktop (please complete the following information):
- OS: macOS
- Browser: Safari
- Version: (latest)
Additional context
- Reference implementation where leak occurs:
src/components/src/map/map-popover.tsx
- Root cause: resources loaded inside the tooltip (iframes, blob URLs, media files) are not explicitly unloaded when the popover closes or unmounts. Browsers may keep these resources alive if not explicitly revoked/unloaded.
- Suggested remediation: On popover close/unmount, explicitly unload embedded resources by setting iframe src to 'about:blank', revoking blob: URLs, and detaching DOM nodes. Run cleanup before calling parent's onClose and also in the unmount effect. See conversation/code for details.
Describe the bug
on the tooltip), the loaded resource is not unloaded when the tooltip is closed. Repeatedly opening and closing such tooltips causes memory usage in the browser (Safari/macOS) to increase indefinitely, eventually leading to excessive memory consumption.
When a tooltip or popover contains a URL (e.g.
Context: I use an external service to serve images and videos from an iPhone in the tooltip. Apologies, I used copilot to draft this ticket when looking at the map-popover file (I'm not a typescript programmer).
To Reproduce
Steps to reproduce the behavior:
Expected behavior
When the tooltip/popover is closed or unmounted, any loaded resources (iframes, blob: URLs, images, videos, etc.) should be properly unloaded and released, so memory usage returns to baseline.
Screenshots
N/A (Observed with memory/heap growth in Safari Web Inspector and Activity Monitor)
Desktop (please complete the following information):
Additional context
src/components/src/map/map-popover.tsx