[Bug] - Div Id not set to the div correctly
I maintainer di solito rispondono entro 3 giorni
@jacobsamo ci sta già lavorando.
Dal 30/7/2025.
Valutazione
Questa issue non è ancora stata valutata.
Descrizione
Description
For some reason, when accessing the map using useMap() and then calling map.getDiv() the id for the div is an empty string even though it's set on the <Map> component.
I found this bug when trying to get Terra Draw to work correctly
<Map
id="google-map-container"
defaultCenter={mapOptions.center}
defaultZoom={mapOptions.zoom}
defaultBounds={
mapOptions.bounds &&
"north" in mapOptions.bounds &&
"south" in mapOptions.bounds &&
"east" in mapOptions.bounds &&
"west" in mapOptions.bounds
? mapOptions.bounds
: undefined
}
mapTypeId={map.mapTypeId?.toLowerCase() ?? "hybrid"}
onZoomChanged={(z) => setZoom(z.detail.zoom)}
mapId={env.NEXT_PUBLIC_GOOGLE_MAPS_MAPID}
disableDefaultUI={true}
onClick={(e) => handleClick(e)}
gestureHandling="greedy"
reuseMaps
>
// children
</Map>
A workaround for this is doing map.getDiv().id = "google-map-container"
Steps to Reproduce
- Access a map using
useMap() - Call
map.getDiv()and check the id - Id is an empty string (
"") even though it's set on the map itself.
Environment
- Library version: ^1.5.4
- Google maps version: weekly
- Browser and Version: Arc - Based on Chromium version 138.0.7204.158 (Official Build) (arm64)
- OS: macOS Sonoma - version 14.5
Logs
Browser logs:
drawing-test.tsx:211 Error initializing Terra Draw: Error: Google Map container div requires and id to be set
at new o (terra-draw-google-maps-adapter.ts:29:10)
at DrawingTest.useEffect.initializeTerraDrawWhenReady (drawing-test.tsx:95:25)
at DrawingTest.useEffect (drawing-test.tsx:220:5)
at Object.react_stack_bottom_frame (react-dom-client.development.js:23637:20)
at runWithFiberInDEV (react-dom-client.development.js:872:30)
at commitHookEffectListMount (react-dom-client.development.js:12295:29)
at commitHookPassiveMountEffects (react-dom-client.development.js:12416:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14337:13)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14464:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14330:11)
at recursivelyTraversePassiveMountEffects (react-dom-client.development.js:14310:11)
at commitPassiveMountOnFiber (react-dom-client.development.js:14340:11)
error @ intercept-console-error.ts:44
overrideMethod @ hook.js:608
DrawingTest.useEffect.initializeTerraDrawWhenReady @ drawing-test.tsx:211
DrawingTest.useEffect @ drawing-test.tsx:220
react_stack_bottom_frame @ react-dom-client.development.js:23637
runWithFiberInDEV @ react-dom-client.development.js:872
commitHookEffectListMount @ react-dom-client.development.js:12295
commitHookPassiveMountEffects @ react-dom-client.development.js:12416
commitPassiveMountOnFiber @ react-dom-client.development.js:14337
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14435
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14408
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14340
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14464
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
commitPassiveMountOnFiber @ react-dom-client.development.js:14330
recursivelyTraversePassiveMountEffects @ react-dom-client.development.js:14310
- Lingua principale
- TypeScript
- Stelle
- 1.9k
- Fork
- 195
- Merge medio
- 2g 18h
- PR unite (30g)
- 15
Preparare l'ambiente
- Nessun Dockerfile né file Docker Compose
- Nessun modello di pull request
- Leggi la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Altre issue di visgl/react-google-maps
-
bug needs more info
Difficoltà 3/5 1-2 giorni Idoneità per principianti 45/100
visgl/react-google-maps#1039 · 1 commento ·
I maintainer di solito rispondono entro 3 giorni
-
bug
Difficoltà 4/5 3-5 giorni Idoneità per principianti 35/100
visgl/react-google-maps#918 · 9 commenti ·
I maintainer di solito rispondono entro 3 giorni
-
bug
Difficoltà 4/5 3-5 giorni Idoneità per principianti 45/100
visgl/react-google-maps#905 ·
I maintainer di solito rispondono entro 3 giorni
-
google maps issue
Difficoltà 3/5 1-2 giorni Idoneità per principianti 45/100
visgl/react-google-maps#889 · 1 commento ·
I maintainer di solito rispondono entro 3 giorni
-
bug
Difficoltà 3/5 1-2 giorni Idoneità per principianti 35/100
visgl/react-google-maps#884 · 1 commento ·
I maintainer di solito rispondono entro 3 giorni
Tutte le issue di visgl/react-google-maps
Issue simili
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 76/100
I maintainer di solito rispondono entro 1 giorno
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 76/100
rohitg00/agentmemory#1428 ·
I maintainer di solito rispondono entro 1 giorno
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 86/100
boxlite-ai/boxlite#1729 ·
I maintainer di solito rispondono entro 1 giorno
-
detectors enhancement good first issue
Difficoltà 2/5 1-3 ore Idoneità per principianti 86/100
SM260845/readme-gen#1 ·
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 88/100
angular/angularfire#3774 ·
I maintainer di solito rispondono entro 2 giorni