Error on initialisation: Uncaught TypeError: Class constructors cannot be invoked without 'new'

[portbury]

Recently, all attempts to initialise a MarkerWithLabel fail with:

index.dev.js:260  Uncaught TypeError: Class constructors cannot be invoked without 'new'
    at new MarkerSafe (index.dev.js:260:32)
    at new MarkerWithLabel (index.dev.js:292:13)

I discovered this issue in our own environment, but the exact same issue occurs in all four of the Examples provided in the GitHub Readme: https://github.com/googlemaps/js-markerwithlabel?tab=readme-ov-file#example

I have tried in Firefox 135.0.1, Edge 133.0.3065.92 and Chrome 134.0.6998.45 on both macos and Windows - all produce the same error.

[andreasringdal]

We have same issue Full stack trace from console.log

[Iameora]

same problem as well, the entire web portal is blocked because I use markers with labels

[davidpadych]

We are experiencing the same issue where markers are not displaying in our production applications. With an older version of the Google Maps JS API, such as 3.59, it works. This issue does not seem to be related to the report mentioned ...

As of February 21st, 2024, google.maps.Marker is deprecated. Please use google.maps.marker.AdvancedMarkerElement instead. At this time, google.maps.Marker is not scheduled to be discontinued, but google.maps.marker.AdvancedMarkerElement is recommended over google.maps.Marker. While google.maps.Marker will continue to receive bug fixes for any major regressions, existing bugs in google.maps.Marker will not be addressed. At least 12 months notice will be given before support is discontinued. Please see https://developers.google.com/maps/deprecations for additional details and https://developers.google.com/maps/documentation/javascript/advanced-markers/migration for the migration guide.

[andreasringdal]

Can confirm that adding v=3.59 when including works as a temporary fix

[AndrewYehozha]

They have changed something in a new 3.60.3 version, however, there is no changelog https://developers.google.com/maps/documentation/javascript/releases

[davidpadych]

I confirm that it is still functional in version 3.60.2. This should be reported to Google because they apparently released patch 3.60.3 and it broke. Do you have any suggestions on where else to report this?

[kostis1313]

Can confirm that adding v=3.59 when including works as a temporary fix

How can i do this here?

Thanks!

[AndrewYehozha]

[DanOrsborne]

Impacting us too. Version pin to 3.59 resolved it for us

[andreasringdal]

I confirm that it is still functional in version 3.60.2. This should be reported to Google because they apparently released patch 3.60.3 and it broke. Do you have any suggestions on where else to report this?

Does v= use all levels of the version parameter? Works with v=3.59 but not with v=3.60.2. Is it using the latest patch build available for the minor version?

[bigbossx]

don't know why google map js SDK v3.60 use es6 syntax directly, it's breaking change but release in v3 with weekly mode

is js-markerwithlabel planning support > v3.6 ?

[nicolus]

Same here, crashed production for us until we pushed an emergency hotfix to force v3.59 in the URL.

[Sisok]

Emergency hot fix with 3.59 fixed it. Thanks!!

[mattlisiv]

For reference, if anybody is using the react-wrapper and want to pin a version as a workaround:

// Rename to temp disable typing
import { Wrapper as MapWrapper } from "@googlemaps/react-wrapper";

<MapWrapper version="3.59"...

[mikemonaco]

Switching from new MarkerWithLabel({ to new google.maps.Marker({ resolved the issue for me as a temporary hotfix. Obviously I lost the "label" portion of the marker but that was ok given the pins were not loading otherwise.

I also just tested pinning to v=3.59 and reverting back to new MarkerWithLabel({ and that also works as others have already confirmed.

[mikemonaco]

I've reporting this issue to Google: https://issuetracker.google.com/issues/401168185

Please upvote it!

[mikemonaco]

It's also worth noting, Google only maintains four fully supported versions at any given time, so pinning to 3.59 is ok for now, but eventually that will roll off the supported versions and requesting v=3.59 will result in you being served the latest version. You can verify this by trying to pin to v=3.56 and notice the MarkerWithLabel issue returns.

TLDR; use the v=3.59 workaround as a temporary fix only.

[fernandomantoan]

Same problem here! Defining the version to 3.59 fixed for now.

[davidpadych]

They rolled back to version 3.60.2... no hot fix needed anymore see https://issuetracker.google.com/issues/401168185

thx @mikemonaco

[FifoTheHein]

In case this is useful for the devs of this library.

I managed to solve this issue by updating the MarkerWithLabel code.

Replacing the weird custom extend method

function extend(type1, type2) {
        // eslint-disable-next-line prefer-const
        for (let property in type2.prototype) {
            type1.prototype[property] = type2.prototype[property];
        }

with code properly extending the existing maps classes. (using ES6 extends) e.g:

class MarkerSafe extends google.maps.Marker {
  constructor(options) {
    super(options);
  }
}

It works perfectly with the rolled-back javascript maps version as well.