mobile-dev-inc / maestro

Painless Mobile UI Automation
https://maestro.mobile.dev/
Apache License 2.0
5.86k stars 278 forks source link

Feature request: add support for tapping on markers in Google Maps #1613

Open BoGlavatki opened 11 months ago

BoGlavatki commented 11 months ago

Hello! I'm new to programming and Maestro. I'm developing a native Vue 3 application that uses the Google Maps plugin. I've added multiple markers on the map and need to perform some tests, specifically tapping on a marker. I have installed Maestro with Maestro Studio. I've tried to write some tests in .yaml, but it doesn't work. I cannot tap on the marker on the map. Here is the code from my app where I add a marker: `


<script lang="ts" setup>
import { ref, $navigateBack } from 'nativescript-vue';
import { GoogleMap, MapType, MapReadyEvent, MapView, MarkerOptions, Marker, MapTapEvent } from '@nativescript/google-maps';

const mapView = ref<GoogleMap | null>(null);
function onReady(event: MapReadyEvent) {
  mapView.value = event.map;

  const markerOptions: MarkerOptions = {
    position: {
        lat:51.33,
        lng:12.37
    },
    title: "New_Marker",

};
  const newMarker: Marker = event.map.addMarker(markerOptions);
  console.log("MARKEER INFO: " + newMarker);

}
function onTap(event: MapTapEvent) {
  console.log("Map tapped!", event);

}
function addMarker(map: GoogleMap, markerOptions: MarkerOptions): Marker {
  return map.addMarker(markerOptions);
}

function mapLongPress(event: MapTapEvent){

}

</script>

<template>
<Page actionBarHidden="true">
<GridLayout rows="auto, *">
<Label
      testID="goBack"
        text="Go Back"
        @tap="$navigateBack"
        class="text-center px-4 py-10 text-2xl text-gray-900 font-bold"
      />

<ContentView row="1" class="bg-[#65adf1] rounded-t-3xl">
<MapView
        testID="gMaps"
        @onTap ="onTap"        
        @ready="onReady"
        @mapLongPress="mapLongPress"

/>
</ContentView>
</GridLayout>
</Page>
</template>`

``
//and here is my firstTest.yaml:

`
```yaml
appId: org.nativescript.myAwesomeApp

- launchApp:
      clearState: true

- tapOn:
      id: "gMap"
- tapOn:
        containsDescendants:
        text: "New_Marker"`

//output in terminal: 

Waiting for flows to complete...

[Failed] markerTest (41s) (Element not found: Text matching regex: New_Marker)

1/1 Flow Failed
axelniklasson commented 11 months ago

Could you please share a screenshot from Studio with information about what selector is available for your marker when you click on it? Thanks!

BoGlavatki commented 11 months ago

Hi Axel, When I tap on the marker, it only returns the coordinates '50%, 55%', without any additional identifiers. The same values are obtained when I tap elsewhere on the map. It seems like the system only recognizes the map view and not any other objects within it, as if it's solely focused on the overall map display. MicrosoftTeams-image (2) MicrosoftTeams-image (1) MicrosoftTeams-image

BoGlavatki commented 11 months ago

Could you please share a screenshot from Studio with information about what selector is available for your marker when you click on it? Thanks!

Hi Axel, When I tap on the marker, it only returns the coordinates '50%, 55%', without any additional identifiers. The same values are obtained when I tap elsewhere on the map. It seems like the system only recognizes the map view and not any other objects within it, as if it's solely focused on the overall map display. MicrosoftTeams-image (2) MicrosoftTeams-image (1) MicrosoftTeams-image

axelniklasson commented 11 months ago

@BoGlavatki thanks for the context! The New_Marker text, has that been suggested by Studio or is that you putting in the text manually? It does suggest that the markers are simply not visible in the view hierarchy and then the only solution is to fallback to using coordinates for tapping instead.

BoGlavatki commented 11 months ago

@BoGlavatki thanks for the context! The New_Marker text, has that been suggested by Studio or is that you putting in the text manually? It does suggest that the markers are simply not visible in the view hierarchy and then the only solution is to fallback to using coordinates for tapping instead.

Thank you for your help. Yes, I entered the text manually. Are you suggesting that I can tap on the marker with coordinates on my screen? Or is there a possibility to verbally instruct the system, like saying 'Maestro, latitude and longitude,' to tap my marker on the map?

axelniklasson commented 11 months ago

Got it -- maestro has no first class support for interacting with maps I am afraid so the best approach right now is to rely on coordinates to tap on the right place in the map.

axelniklasson commented 11 months ago

@BoGlavatki what Vue framework are you using specifically for building your app?

BoGlavatki commented 11 months ago

@axelniklasson I use nativescript - https://nativescript.org , Vue 3 - https://vuejs.org/