Can't use .scroll() and .swipe() for MapView from react-native-maps

[mhyousefi]

I have a MapView from react-native-maps in my app somewhere and would like to move the chosen location using the scroll or the swipe action methods.

It works (and zooms a bit) when I try:

await expect(element(by.id(<map test ID>)).toBeVisible()
await element(by.id(<map test ID>)).multiTap(2)

But when trying this:

await expect(element(by.id(<map test ID>)).toBeVisible()
await element(by.id(<map test ID>)).scroll(50, 'down')

or this

await expect(element(by.id(<map test ID>)).toBeVisible()
await element(by.id(<map test ID>)).swipe('down', 'slow')

I get the following error:

Error: Cannot find UI element.
Exception with Action: {
  "Action Name" : "Scroll Down for 100",
  "Element Matcher" : "(((((kindOfClass('UIScrollView') || kindOfClass('UIWebView')) && (respondsToSelector(accessibilityIdentifier) && accessibilityID('SetLocationView-MapView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches((respondsToSelector(accessibilityIdentifier) && accessibilityID('SetLocationView-MapView')))))) && !(kindOfClass('RCTScrollView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches(((((kindOfClass('UIScrollView') || kindOfClass('UIWebView')) && (respondsToSelector(accessibilityIdentifier) && accessibilityID('SetLocationView-MapView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches((respondsToSelector(accessibilityIdentifier) && accessibilityID('SetLocationView-MapView')))))) && kindOfClass('RCTScrollView'))))))",
  "Recovery Suggestion" : "Check if the element exists in the UI hierarchy printed below. If it exists, adjust the matcher so that it accurately matches element."
}

Error Trace: [
  {
    "Description" : "Interaction cannot continue because the desired element was not found.",
    "Error Domain" : "com.google.earlgrey.ElementInteractionErrorDomain",
    "Error Code" : "0",
    "File Name" : "GREYElementInteraction.m",
    "Function Name" : "-[GREYElementInteraction matchedElementsWithTimeout:error:]",
    "Line" : "124"
  }
]

[isnifer]

I had the same result with appium. Sadly, but react-native-maps inaccessible for now

[sraikimaxime]

Hi there @LeoNatan, first of all thanks for the amazing library, I'd love to start improving the detox experience on react native maps as I'd want to use it on the project I'm currently working on, is there any other work ongoing on this topic ? Thank you for your time !

[LeoNatan]

Hello

Thank you for your desire to contribute! There is no other effort in this area that I am aware of.

[sraikimaxime]

Sweet, do you have any advice before I start digging ? :)

[LeoNatan]

I suggest looking first at how Earl Grey on iOS and Espresso on Android handle map scrolling. If it works but is broken in Detox, I suggest looking at which view Detox attempts to scroll.
If it doesn't work, I would either suggest creating an enhancement with Earl Grey or doing it directly in Detox. Let's discuss further once we have deeper understanding of Earl Grey.

[sraikimaxime]

Hey @LeoNatan, thank you for your help, sorry I have not been really focus these days with the end of year celebrations :).

So I've been looking at Earl Grey for now and I have understood that they use swipe and pinch actions to interact with maps. Also I've started the implementation of EARLGrey actions to allow us to pinch and did a first test with a map having the expected behavior. I opened a WIP PR so that you could challenge the implementation as soon as possible. next step for me is to make sure coverage is reached :)
Here is the PR and the associated issue, I was not sure if I was supposed to open a new one or to refer this one.

Thank you for your time and help. Oh and a very merry Christmas & happy new year :)

[LeoNatan]

Since this has been resolved in PRs, I am closing the issue. Thanks