Skip to content

Commit 06c5972

Browse files
crisbetocrisbeto
committed
feat(google-maps): switch to non-deprecated typings
Moves the `google-maps` package away from the deprecated typings. Fixes #22818.
1 parent c2a20c4 commit 06c5972

32 files changed

+84
-77
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@
5959
"@angular/core": "13.0.0-next.2",
6060
"@angular/forms": "13.0.0-next.2",
6161
"@angular/platform-browser": "13.0.0-next.2",
62-
"@types/googlemaps": "^3.43.1",
62+
"@types/google.maps": "^3.45.6",
6363
"@types/youtube": "^0.0.42",
6464
"core-js-bundle": "^3.8.2",
6565
"material-components-web": "13.0.0-canary.0a9069300.0",

‎src/dev-app/google-map/google-map-demo.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -112,11 +112,13 @@ export class GoogleMapDemo {
112112
}
113113

114114
handleClick(event: google.maps.MapMouseEvent) {
115-
this.markerPositions.push(event.latLng.toJSON());
115+
if (event.latLng) {
116+
this.markerPositions.push(event.latLng.toJSON());
117+
}
116118
}
117119

118120
handleMove(event: google.maps.MapMouseEvent) {
119-
this.display = event.latLng.toJSON();
121+
this.display = event.latLng?.toJSON();
120122
}
121123

122124
clickMarker(marker: MapMarker) {

‎src/google-maps/BUILD.bazel

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ ng_module(
1414
"//src:dev_mode_types",
1515
"@npm//@angular/common",
1616
"@npm//@angular/core",
17-
"@npm//@types/googlemaps",
17+
"@npm//@types/google.maps",
1818
"@npm//rxjs",
1919
],
2020
)

‎src/google-maps/google-map/google-map.spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -257,7 +257,7 @@ describe('GoogleMap', () => {
257257

258258
const component = fixture.debugElement.query(By.directive(GoogleMap)).componentInstance;
259259

260-
mapSpy.getBounds.and.returnValue(null);
260+
mapSpy.getBounds.and.returnValue(undefined);
261261
expect(component.getBounds()).toBe(null);
262262

263263
component.getCenter();
@@ -272,7 +272,7 @@ describe('GoogleMap', () => {
272272
component.getMapTypeId();
273273
expect(mapSpy.getMapTypeId).toHaveBeenCalled();
274274

275-
mapSpy.getProjection.and.returnValue(null);
275+
mapSpy.getProjection.and.returnValue(undefined);
276276
expect(component.getProjection()).toBe(null);
277277

278278
component.getStreetView();

‎src/google-maps/google-map/google-map.ts

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {
1313
ChangeDetectionStrategy,
@@ -372,7 +372,7 @@ export class GoogleMap implements OnChanges, OnInit, OnDestroy {
372372
*/
373373
getCenter(): google.maps.LatLng {
374374
this._assertInitialized();
375-
return this.googleMap.getCenter();
375+
return this.googleMap.getCenter()!;
376376
}
377377

378378
/**
@@ -381,7 +381,7 @@ export class GoogleMap implements OnChanges, OnInit, OnDestroy {
381381
*/
382382
getClickableIcons(): boolean {
383383
this._assertInitialized();
384-
return this.googleMap.getClickableIcons();
384+
return this.googleMap.getClickableIcons()!;
385385
}
386386

387387
/**
@@ -390,7 +390,7 @@ export class GoogleMap implements OnChanges, OnInit, OnDestroy {
390390
*/
391391
getHeading(): number {
392392
this._assertInitialized();
393-
return this.googleMap.getHeading();
393+
return this.googleMap.getHeading()!;
394394
}
395395

396396
/**
@@ -399,7 +399,7 @@ export class GoogleMap implements OnChanges, OnInit, OnDestroy {
399399
*/
400400
getMapTypeId(): google.maps.MapTypeId|string {
401401
this._assertInitialized();
402-
return this.googleMap.getMapTypeId();
402+
return this.googleMap.getMapTypeId()!;
403403
}
404404

405405
/**
@@ -408,7 +408,7 @@ export class GoogleMap implements OnChanges, OnInit, OnDestroy {
408408
*/
409409
getProjection(): google.maps.Projection|null {
410410
this._assertInitialized();
411-
return this.googleMap.getProjection();
411+
return this.googleMap.getProjection() || null;
412412
}
413413

414414
/**
@@ -426,7 +426,7 @@ export class GoogleMap implements OnChanges, OnInit, OnDestroy {
426426
*/
427427
getTilt(): number {
428428
this._assertInitialized();
429-
return this.googleMap.getTilt();
429+
return this.googleMap.getTilt()!;
430430
}
431431

432432
/**
@@ -435,7 +435,7 @@ export class GoogleMap implements OnChanges, OnInit, OnDestroy {
435435
*/
436436
getZoom(): number {
437437
this._assertInitialized();
438-
return this.googleMap.getZoom();
438+
return this.googleMap.getZoom()!;
439439
}
440440

441441
/**

‎src/google-maps/map-anchor-point.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
export interface MapAnchorPoint {
1313
getAnchor(): google.maps.MVCObject;

‎src/google-maps/map-base-layer.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {Directive, NgZone, OnDestroy, OnInit} from '@angular/core';
1313

‎src/google-maps/map-bicycling-layer/map-bicycling-layer.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {Directive} from '@angular/core';
1313

‎src/google-maps/map-circle/map-circle.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {Directive, Input, NgZone, OnDestroy, OnInit, Output} from '@angular/core';
1313
import {BehaviorSubject, combineLatest, Observable, Subject} from 'rxjs';
@@ -183,7 +183,7 @@ export class MapCircle implements OnInit, OnDestroy {
183183
*/
184184
getBounds(): google.maps.LatLngBounds {
185185
this._assertInitialized();
186-
return this.circle.getBounds();
186+
return this.circle.getBounds()!;
187187
}
188188

189189
/**
@@ -192,7 +192,7 @@ export class MapCircle implements OnInit, OnDestroy {
192192
*/
193193
getCenter(): google.maps.LatLng {
194194
this._assertInitialized();
195-
return this.circle.getCenter();
195+
return this.circle.getCenter()!;
196196
}
197197

198198
/**

‎src/google-maps/map-directions-renderer/map-directions-renderer.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {
1313
Directive,
@@ -108,7 +108,7 @@ export class MapDirectionsRenderer implements OnInit, OnChanges, OnDestroy {
108108
*/
109109
getDirections(): google.maps.DirectionsResult {
110110
this._assertInitialized();
111-
return this.directionsRenderer.getDirections();
111+
return this.directionsRenderer.getDirections()!;
112112
}
113113

114114
/**
@@ -117,7 +117,7 @@ export class MapDirectionsRenderer implements OnInit, OnChanges, OnDestroy {
117117
*/
118118
getPanel(): Node {
119119
this._assertInitialized();
120-
return this.directionsRenderer.getPanel();
120+
return this.directionsRenderer.getPanel()!;
121121
}
122122

123123
/**

‎src/google-maps/map-directions-renderer/map-directions-service.spec.ts

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -31,19 +31,28 @@ describe('MapDirectionsService', () => {
3131
});
3232

3333
it('initializes the Google Maps Directions Service when `route` is called', () => {
34-
mapDirectionsService.route({}).subscribe();
34+
mapDirectionsService.route({
35+
origin: 'home',
36+
destination: 'work',
37+
travelMode: 'BICYCLING' as google.maps.TravelMode
38+
}).subscribe();
39+
3540
expect(directionsServiceConstructorSpy).toHaveBeenCalled();
3641
});
3742

3843
it('calls route on inputs', () => {
39-
const result = {};
40-
const status = 'OK';
41-
directionsServiceSpy.route.and.callFake((_request: google.maps.DirectionsRequest,
42-
callback: Function) => {
43-
callback(result, status);
44+
const result: google.maps.DirectionsResult = {routes: []};
45+
const status = 'OK' as google.maps.DirectionsStatus;
46+
directionsServiceSpy.route.and.callFake((_request, callback) => {
47+
callback?.(result, status);
48+
return Promise.resolve(result);
4449
});
45-
const request: google.maps.DirectionsRequest = {};
46-
mapDirectionsService.route(request).subscribe(response => {
50+
51+
mapDirectionsService.route({
52+
origin: 'home',
53+
destination: 'work',
54+
travelMode: 'BICYCLING' as google.maps.TravelMode
55+
}).subscribe(response => {
4756
expect(response).toEqual({result, status} as MapDirectionsResponse);
4857
});
4958
});

‎src/google-maps/map-directions-renderer/map-directions-service.ts

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {Injectable, NgZone} from '@angular/core';
1313
import {Observable} from 'rxjs';
@@ -42,17 +42,12 @@ export class MapDirectionsService {
4242
this._directionsService = new google.maps.DirectionsService();
4343
}
4444

45-
const callback =
46-
(
47-
result: google.maps.DirectionsResult|undefined,
48-
status: google.maps.DirectionsStatus
49-
) => {
45+
this._directionsService.route(request, (result, status) => {
5046
this._ngZone.run(() => {
51-
observer.next({result, status});
47+
observer.next({result: result || undefined, status});
5248
observer.complete();
5349
});
54-
};
55-
this._directionsService.route(request, callback);
50+
});
5651
});
5752
}
5853
}

‎src/google-maps/map-geocoder/map-geocoder.spec.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -33,12 +33,13 @@ describe('MapGeocoder', () => {
3333

3434
it('calls geocode on inputs', () => {
3535
const results: google.maps.GeocoderResult[] = [];
36-
const status = 'OK';
37-
geocoderSpy.geocode.and.callFake((_: google.maps.GeocoderRequest, callback: Function) => {
38-
callback(results, status);
36+
const status = 'OK' as google.maps.GeocoderStatus;
37+
geocoderSpy.geocode.and.callFake((_request, callback) => {
38+
callback?.(results, status);
39+
return Promise.resolve({results});
3940
});
40-
const request: google.maps.DirectionsRequest = {};
41-
geocoder.geocode(request).subscribe(response => {
41+
42+
geocoder.geocode({region: 'Europe'}).subscribe(response => {
4243
expect(response).toEqual({results, status} as MapGeocoderResponse);
4344
});
4445
});

‎src/google-maps/map-geocoder/map-geocoder.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {Injectable, NgZone} from '@angular/core';
1313
import {Observable} from 'rxjs';
@@ -40,7 +40,7 @@ export class MapGeocoder {
4040

4141
this._geocoder.geocode(request, (results, status) => {
4242
this._ngZone.run(() => {
43-
observer.next({results, status});
43+
observer.next({results: results || [], status});
4444
observer.complete();
4545
});
4646
});

‎src/google-maps/map-ground-overlay/map-ground-overlay.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {Directive, Input, NgZone, OnDestroy, OnInit, Output} from '@angular/core';
1313
import {BehaviorSubject, Observable, Subject} from 'rxjs';
@@ -131,7 +131,7 @@ export class MapGroundOverlay implements OnInit, OnDestroy {
131131
*/
132132
getBounds(): google.maps.LatLngBounds {
133133
this._assertInitialized();
134-
return this.groundOverlay.getBounds();
134+
return this.groundOverlay.getBounds()!;
135135
}
136136

137137
/**

‎src/google-maps/map-heatmap-layer/map-heatmap-layer.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -162,5 +162,5 @@ describe('MapHeatmapLayer', () => {
162162
class TestApp {
163163
@ViewChild(MapHeatmapLayer) heatmap: MapHeatmapLayer;
164164
options?: Partial<google.maps.visualization.HeatmapLayerOptions>;
165-
data?: HeatmapData;
165+
data?: HeatmapData|null;
166166
}

‎src/google-maps/map-heatmap-layer/map-heatmap-layer.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {
1313
Input,

‎src/google-maps/map-info-window/map-info-window.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {
1313
Directive,
@@ -147,7 +147,7 @@ export class MapInfoWindow implements OnInit, OnDestroy {
147147
*/
148148
getContent(): string|Node {
149149
this._assertInitialized();
150-
return this.infoWindow.getContent();
150+
return this.infoWindow.getContent()!;
151151
}
152152

153153
/**
@@ -157,7 +157,7 @@ export class MapInfoWindow implements OnInit, OnDestroy {
157157
*/
158158
getPosition(): google.maps.LatLng|null {
159159
this._assertInitialized();
160-
return this.infoWindow.getPosition();
160+
return this.infoWindow.getPosition() || null;
161161
}
162162

163163
/**

‎src/google-maps/map-kml-layer/map-kml-layer.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
*/
88

99
// Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1265
10-
/// <reference types="googlemaps" />
10+
/// <reference types="google.maps" />
1111

1212
import {
1313
Directive,
@@ -110,15 +110,15 @@ export class MapKmlLayer implements OnInit, OnDestroy {
110110
*/
111111
getDefaultViewport(): google.maps.LatLngBounds {
112112
this._assertInitialized();
113-
return this.kmlLayer.getDefaultViewport();
113+
return this.kmlLayer.getDefaultViewport()!;
114114
}
115115

116116
/**
117117
* See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.getMetadata
118118
*/
119119
getMetadata(): google.maps.KmlLayerMetadata {
120120
this._assertInitialized();
121-
return this.kmlLayer.getMetadata();
121+
return this.kmlLayer.getMetadata()!;
122122
}
123123

124124
/**

0 commit comments

Comments
 (0)