[Bug] TerraDrawPolygonMode ignores custom modeName for internal closingPoint

[nathaliars]

Describe the bug
When attempting to draw the third point of a polygon using a custom modeName (e.g., "Polygon" instead of the default "polygon"), the terra-draw-google-maps-adapter throws a styling error.

The crash occurs because the internal "point" feature is created with the mode "polygon", ignoring the custom modeName defined in the TerraDrawPolygonMode configuration.

Since the adapter uses the mode property to look up styles, it fails to find the styles registered under the custom name (e.g., "Polygon"), passing invalid parameters and causing the following error:

terra-draw-google-maps-adapter.ts:435 Uncaught TypeError: t2[r2] is not a function

JSON Evidence
As seen in the snapshot below, the main Polygon feature respects the custom mode ("mode": "Polygon"), but the generated closing points revert to the default ("mode": "polygon"), causing the mismatch:

[
    {
        "id": "0028a6db-4700-49f7-8641-14f185b35a44",
        "type": "Feature",
        "geometry": {
            "type": "Polygon",
            "coordinates": [
                [
                    [
                        -52.57199132232667,
                        -13.26390582065197
                    ],
                    [
                        -52.03366124420167,
                        -13.36547044032876
                    ],
                    [
                        -52.18197667388916,
                        -13.691255825334935
                    ],
                    [
                        -52.18197667388916,
                        -13.691255825334935
                    ],
                    [
                        -52.57199132232667,
                        -13.26390582065197
                    ]
                ]
            ]
        },
        "properties": {
            "mode": "Polygon", // <--- Correct: My custom modeName
            "currentlyDrawing": true,
            "committedCoordinateCount": 2,
            "provisionalCoordinateCount": 3
        }
    },
    {
        "id": "93561f3b-7cd7-4572-871f-8860d1d7e2a3",
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [
                -52.57199132232667,
                -13.26390582065197
            ]
        },
        "properties": {
            "mode": "polygon",
            "closingPoint": true
        }
    },
    {
        "id": "ae53e27c-bdb6-46e0-9cff-2f85567b18be",
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [
                -52.18197667388916,
                -13.691255825334935
            ]
        },
        "properties": {
            "mode": "polygon", // <--- INCORRECT: Ignores custom modeName
            "closingPoint": true
        }
    }
]

Terra Draw npm version

{
  "terra-draw": "^1.20.0",
  "terra-draw-google-maps-adapter": "^1.1.2"
}

To Reproduce
Steps to reproduce the behavior:

1. Create a TerraDrawPolygonMode with a custom modeName.
2. Switch the drawing mode to this custom mode and start drawing a polygon.
3. When adding the third point, observe the error in the browser console.

Expected behavior
All internally generated features related to the polygon (including closing points) should respect the configured modeName. This ensures consistent style resolution and prevents runtime errors in the adapter.

[JamesLMilner]

Hey @nathaliars thanks for the detailed bug report, appreciated. I haven't had a moment to reproduce it yet but will get back on this issue when I have. Hopefully it's an easy fix or resolution!

[JamesLMilner]

Hey @nathaliars - I can't actually reproduce this (please see the screenshot below):

How are you using Terra Draw, is it with a script tag or a bundler (if so which one)?

[nathaliars]

Hey @nathaliars - I can't actually reproduce this (please see the screenshot below):

How are you using Terra Draw, is it with a script tag or a bundler (if so which one)?

Hi @JamesLMilner.
I'm using Terra Draw inside a React + TypeScript project bundled with Vite (ESM build).

Also, I'm rendering the map using @vis.gl/react-google-maps instead of the Google Maps JS script tag directly.

Packages and versions:

• terra-draw 1.20.0
• terra-draw-google-maps-adapter 1.1.2
• @vis.gl/react-google-maps 1.7.1

I'm importing Terra Draw normally using:

import { TerraDraw } from "terra-draw";

[JamesLMilner]

@nathaliars it's hard to pinpoint exactly what is going on. I did dig into but couldn't see anything obvious about what might be happening.

Can you share with me the code where you update the modeName? Are you doing it after the mode has been created?

[JamesLMilner]

I've added some more unit tests around this to try and narrow down the issue. Even trying my hardest to reproduce with unit test cases I wasn't able to: #753

If you have some example code where this failing I can try and look into it further.

[JamesLMilner]

If I checkout the tag 1.20.0 and run the new tests I added in #753 for terra-draw.spec.ts I can see they fail. This must have been fixed accidentally when migrating to using MutateFeatureBehavior for #723.

@nathaliars I will release a new version soon and you can test and let me know if it it's resolved?

[nathaliars]

Hey @JamesLMilner .
Sorry for the late reply, I was traveling for the holidays.
Thanks a lot for looking into this. I’ll test it and report back if the issue is resolved. Happy holidays!

[JamesLMilner]

@nathaliars happy holidays to you too! 1.21.0 is released, which should hopefully resolve this. Let me know how you get on.