google-maps-services-js

google-maps-services-js copied to clipboard

Environment details

@googlemaps/[email protected]

Code example

  const res = await client.geocode({
    params: {
      address: 'Hütten 58, Hamburg, Germany',
      language: 'en',
    }
  });

  console.log(JSON.stringify(res.data));

This returns following:

{
  "results": [
    {
      "address_components": [
        {"long_name": "58", "short_name": "58", "types": ["street_number"]},
        {"long_name": "Hütten", "short_name": "Hütten", "types": ["route"]},
        {
          "long_name": "Hamburg-Mitte",
          "short_name": "Hamburg-Mitte",
          "types": ["political", "sublocality", "sublocality_level_1"]
        },
        {
          "long_name": "Hamburg",
          "short_name": "Hamburg",
          "types": ["locality", "political"]
        },
        {
          "long_name": "Hamburg",
          "short_name": "Hamburg",
          "types": ["administrative_area_level_3", "political"]
        },
        {
          "long_name": "Hamburg",
          "short_name": "HH",
          "types": ["administrative_area_level_1", "political"]
        },
        {
          "long_name": "Germany",
          "short_name": "DE",
          "types": ["country", "political"]
        },
        {"long_name": "20355", "short_name": "20355", "types": ["postal_code"]}
      ],
      "formatted_address": "Hütten 58, 20355 Hamburg, Germany",
      "geometry": {
        "location": {"lat": 53.55095069999999, "lng": 9.9760185},
        "location_type": "ROOFTOP",
        "viewport": {
          "northeast": {"lat": 53.5522996802915, "lng": 9.977367480291502},
          "southwest": {"lat": 53.5496017197085, "lng": 9.974669519708499}
        }
      },
      "place_id": "ChIJHfHMMBKPsUcRB2_I0CAh6Do",
      "plus_code": {
        "compound_code": "HX2G+9C Hamburg, Germany",
        "global_code": "9F5FHX2G+9C"
      },
      "types": ["street_address"]
    }
  ],
  "status": "OK"
}

If I rewrite it in TS using enums provided, I'll get this:

export const GMAPS_RESPONSE_MOCK: GeocodeResponseData = {
  results: [
    {
      address_components: [
        {
          long_name: '58',
          short_name: '58',
          types: [PlaceType2.street_number]
        },
        { long_name: 'Hütten', short_name: 'Hütten', types: [PlaceType2.route] },
        {
          long_name: 'Hamburg-Mitte',
          short_name: 'Hamburg-Mitte',
          types: [PlaceType2.political, PlaceType2.sublocality, PlaceType2.sublocality_level_1]
        },
        {
          long_name: 'Hamburg',
          short_name: 'Hamburg',
          types: [PlaceType2.locality, PlaceType2.political]
        },
        {
          long_name: 'Hamburg',
          short_name: 'Hamburg',
          types: [PlaceType2.administrative_area_level_3, PlaceType2.political]
        },
        {
          long_name: 'Hamburg',
          short_name: 'HH',
          types: [PlaceType2.administrative_area_level_1, PlaceType2.political]
        },
        { long_name: 'Germany', short_name: 'DE', types: [PlaceType2.country, PlaceType2.political] },
        {
          long_name: '20355',
          short_name: '20355',
          types: [PlaceType2.postal_code]
        }
      ],
      formatted_address: 'Hütten 58, 20355 Hamburg, Germany',
      geometry: {
        location: { lat: 53.55095069999999, lng: 9.9760185 },
        location_type: LocationType.ROOFTOP,
        viewport: {
          northeast: { lat: 53.5522996802915, lng: 9.977367480291502 },
          southwest: { lat: 53.5496017197085, lng: 9.974669519708499 }
        }
      },
      place_id: 'ChIJHfHMMBKPsUcRB2_I0CAh6Do',
      plus_code: { compound_code: 'HX2G+9C Hamburg, Germany', global_code: '9F5FHX2G+9C' },
      types: [PlaceType2.street_address]
    }
  ],
  status: Status.OK
};

Which fails to compile with following:

src/gmaps/__mocks__/gmapsResponse.ts:41:7 - error TS2741: Property 'bounds' is missing in type '{ location: { lat: number; lng: number; }; location_type: LocationType.ROOFTOP; viewport: { northeast: { lat: number; lng: number; }; southwest: { lat: number; lng: number; }; }; }' but required in type 'AddressGeometry'.

41       geometry: {
         ~~~~~~~~

  ../../node_modules/@googlemaps/google-maps-services-js/dist/common.d.ts:1429:5
    1429     bounds: LatLngBounds;
             ~~~~~~
    'bounds' is declared here.
  ../../node_modules/@googlemaps/google-maps-services-js/dist/common.d.ts:1344:5
    1344     geometry: AddressGeometry;
             ~~~~~~~~
    The expected type comes from property 'geometry' which is declared here on type 'GeocodeResult'

If I add bounds to geometry, I'll get this:

src/gmaps/__mocks__/gmapsResponse.ts:5:5 - error TS2739: Type '{ address_components: ({ long_name: string; short_name: string; types: PlaceType2.street_number[]; } | { long_name: string; short_name: string; types: PlaceType2.route[]; } | { long_name: string; short_name: string; types: (PlaceType2.political | ... 1 more ... | PlaceType2.sublocality_level_1)[]; } | ... 4 more ......' is missing the following properties from type 'GeocodeResult': postcode_localities, partial_match

  5     {
        ~
  6       address_components: [
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~
...
 55       types: [PlaceType2.street_address]
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 56     }
    ~~~~~

plus_code may be also optional, and I would guess that some other fields might be optional as well.

Thanks for reporting. I'm currently working through updating the OpenAPI spec at https://github.com/googlemaps/openapi-specification and will update the client libraries when that work is done.

There's also a partial_match field, which isn't defined as optional, though I tried several addresses, and none returned any value for it

Also plus_code is returned at the root level of the response object, but in Typescript it's inside GeocodeResult.

Typescript interface: responseBody.results[x].plus_code Actual: responseBody.plus_code

There's also a partial_match field, which isn't defined as optional, though I tried several addresses, and none returned any value for it

Hi, I'm experiencing the same error. How did you fix it? Thanks!

I don't have an access to source code anymore, but I'm pretty sure that I've just suppressed/overloaded the types