[google_maps_flutter_web] Implement my location & my location button

packages/google_maps_flutter/google_maps_flutter_web/AUTHORS

@@ -65,3 +65,4 @@ Anton Borries <[email protected]>
 Alex Li <[email protected]>
 Rahul Raj <[email protected]>
 Justin Baumann <[email protected]>
+Nguyễn Phúc Lợi <[email protected]>

packages/google_maps_flutter/google_maps_flutter_web/CHANGELOG.md

@@ -1,5 +1,6 @@
 ## 0.5.2
 
+* Add "My Location" Widget. Issue [#64073](https://github.com/flutter/flutter/issues/64073)
 * Adds options for gesture handling and tilt controls.
 
 ## 0.5.1

packages/google_maps_flutter/google_maps_flutter_web/README.md

@@ -60,11 +60,6 @@ The following map options are not available in web, because the map doesn't rota
 
 There's no "Map Toolbar" in web, so the `mapToolbarEnabled` option is unused.
 
-There's no "My Location" widget in web ([tracking issue](https://github.com/flutter/flutter/issues/64073)), so the following options are ignored, for now:
-
-* `myLocationButtonEnabled`
-* `myLocationEnabled`
-
 There's no `defaultMarkerWithHue` in web. If you need colored pins/markers, you may need to use your own asset images.
 
 Indoor and building layers are still not available on the web. Traffic is.

packages/google_maps_flutter/google_maps_flutter_web/example/integration_test/google_maps_controller_test.dart

@@ -21,6 +21,9 @@ import 'google_maps_controller_test.mocks.dart';
   MockSpec<PolygonsController>(onMissingStub: OnMissingStub.returnDefault),
   MockSpec<PolylinesController>(onMissingStub: OnMissingStub.returnDefault),
   MockSpec<MarkersController>(onMissingStub: OnMissingStub.returnDefault),
+  MockSpec<html.Geolocation>(onMissingStub: OnMissingStub.returnDefault),
+  MockSpec<html.Geoposition>(onMissingStub: OnMissingStub.returnDefault),
+  MockSpec<html.Coordinates>(onMissingStub: OnMissingStub.returnDefault),
 ])
 
 /// Test Google Map Controller
@@ -483,6 +486,107 @@ void main() {
           expect(controller.trafficLayer, isNotNull);
         });
       });
+
+      group('My Location', () {
+        testWidgets('by default is disabled', (WidgetTester tester) async {
+          controller = createController();
+          controller.init();
+
+          expect(controller.myLocationButton, isNull);
+        });
+
+        testWidgets('initializes with my location & display my location button',
+            (WidgetTester tester) async {
+          late final MockGeolocation mockGeolocation = MockGeolocation();
+          late final MockGeoposition mockGeoposition = MockGeoposition();
+          late final MockCoordinates mockCoordinates = MockCoordinates();
+          const LatLng currentLocation = LatLng(10.8231, 106.6297);
+
+          controller = createController(
+              mapConfiguration: const MapConfiguration(
+            myLocationEnabled: true,
+            myLocationButtonEnabled: true,
+          ));
+
+          controller.debugSetOverrides(
+            createMap: (_, __) => map,
+            markers: markers,
+            geolocation: mockGeolocation,
+          );
+
+          when(mockGeoposition.coords).thenReturn(mockCoordinates);
+
+          when(mockCoordinates.longitude).thenReturn(currentLocation.longitude);
+
+          when(mockCoordinates.latitude).thenReturn(currentLocation.latitude);
+
+          when(mockGeolocation.getCurrentPosition(
+            timeout: anyNamed('timeout'),
+          )).thenAnswer((_) async => mockGeoposition);
+
+          when(mockGeolocation.watchPosition()).thenAnswer((_) {
+            return Stream<MockGeoposition>.fromIterable(
+                <MockGeoposition>[mockGeoposition]);
+          });
+
+          controller.init();
+          await tester.pumpAndSettle();
+
+          final Set<Marker> capturedMarkers =
+              verify(markers.addMarkers(captureAny)).captured[1] as Set<Marker>;
+
+          expect(controller.myLocationButton, isNotNull);
+          expect(capturedMarkers.length, 1);
+          expect(capturedMarkers.first.position, currentLocation);
+          expect(capturedMarkers.first.zIndex, 0.5);
+        });
+
+        testWidgets('initializes with my location only',
+            (WidgetTester tester) async {
+          late final MockGeolocation mockGeolocation = MockGeolocation();
+          late final MockGeoposition mockGeoposition = MockGeoposition();
+          late final MockCoordinates mockCoordinates = MockCoordinates();
+          const LatLng currentLocation = LatLng(10.8231, 106.6297);
+
+          controller = createController(
+              mapConfiguration: const MapConfiguration(
+            myLocationEnabled: true,
+            myLocationButtonEnabled: false,
+          ));
+          controller.debugSetOverrides(
+            createMap: (_, __) => map,
+            markers: markers,
+            geolocation: mockGeolocation,
+          );
+
+          when(mockGeoposition.coords).thenReturn(mockCoordinates);
+
+          when(mockCoordinates.longitude).thenReturn(currentLocation.longitude);
+
+          when(mockCoordinates.latitude).thenReturn(currentLocation.latitude);
+
+          when(mockGeolocation.getCurrentPosition.call(
+            timeout: const Duration(seconds: 30),
+          )).thenAnswer((_) async => mockGeoposition);
+
+          when(mockGeolocation.watchPosition()).thenAnswer((_) {
+            return Stream<MockGeoposition>.fromIterable(
+                <MockGeoposition>[mockGeoposition]);
+          });
+
+          controller.init();
+
+          await tester.pumpAndSettle();
+
+          final Set<Marker> capturedMarkers =
+              verify(markers.addMarkers(captureAny)).captured[1] as Set<Marker>;
+
+          expect(controller.myLocationButton, isNull);
+          expect(capturedMarkers.length, 1);
+          expect(capturedMarkers.first.position, currentLocation);
+          expect(capturedMarkers.first.zIndex, 0.5);
+        });
+      });
     });
 
     // These are the methods that are delegated to the gmaps.GMap object, that we can mock...