Skip to content

[Bug] AdvancedMarker fires "TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node' when "draggable" is true #867

@aaleksandrov-idealista

Description

@aaleksandrov-idealista

Description

My stack:

  • React 18.3.1
  • @vis.gl/react-google-maps 1.7.1
  • vite 6.0.7

The code:

        <AdvancedMarker
          position={markerCoordinates}
          // draggable
          // onDragEnd={getGeocodeData}
          collisionBehavior={CollisionBehavior.REQUIRED_AND_HIDES_OPTIONAL}
          anchorTop="-90%"
        >
          <img src={mapPinIcon} alt="pin" />
        </AdvancedMarker>

The error:
Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'

This error is getting caused by using the draggable prop on the AdvancedMarker. Removing the prop doesnt cause the crash.

mapPinIcon is a .svg image.

I've tried making a workaround to this by ensuring that AdvancedMarker was getting a Node child, by creating a container with document.createElement and appending an image with appendChild, but it still gives that error.

Image

Steps to Reproduce

In a closed environment it works... So providing a CodeSandbox seems worthless. If you need any kind of additional information I'll provide it ASAP as I'll be looking at this issue constantly

Environment

  • Library version: 1.7.1 (tried also 1.5.1 and 1.5.2)
  • Google maps version: weekly
  • Browser and Version: Chrome 142.0.7444.60
  • OS: MacOS Tahoe 26.0.1

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions