Swipe Action Doesn't Work on RN ListView?

[aarongreenwald]

See this commit - the test in question fails because it doesn't execute the swipe. Or at least I don't see it happen in the simulator when I'm running locally.

The test output:

1) sanity e2e should see more messages after scrolling:
     Error: Cannot find UI Element.
Exception with Assertion: {
  "Assert Criteria" : "assertWithMatcher: matcherForSufficientlyVisible(>=0.750000)",
  "Element Matcher" : "(((respondsToSelector(accessibilityIdentifier) && accessibilityID('0')) && !kindOfClass('RCTScrollView')) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches(((respondsToSelector(accessibilityIdentifier) && accessibilityID('0')) && kindOfClass('RCTScrollView'))))))",
  "Recovery Suggestion" : "Check if element exists in the UI, modify assert criteria, or adjust the matcher"
}

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

When I had it as a simple scrollview in the source, not a listview, the swipe worked.

[LeoNatan]

Does this still reproduce on modern RN and Detox?

[L0wry]

Hey guys,

Like to report that this still replicates.
My component is looking something like this

 render() {
    if (this.props.data.loading) {
      return (
        <View style={styles.Container}>
          <ActivityIndicator size={"large"} />
        </View>
      );
    }

    this.state = {
      dataSource: ds.cloneWithRows(
        ArticlePage.prepareDataForListView(this.props)
      )
    };
    return (
      <View testID='articleWrapper' style={styles.PageWrapper}>
        <ListView
          testID="listView"
          dataSource={this.state.dataSource}
          renderRow={ArticlePage.renderRow}
          initialListSize={10}
          scrollRenderAheadDistance={10}
          pageSize={1}
        />
      </View>
    );
  }

If I attempt to use any of the detox actions involving a swipeView
such as
await element(by.id('scrollView')).swipe('down');

I am presented with

Cannot find UI element.
    Exception with Action: {
      "Action Name" : "Scroll To Bottom content edge",
      "Element Matcher" : "(((((kindOfClass('UIScrollView') || kindOfClass('UIWebView')) && (respondsToSelector(accessibilityIdentifier) && accessibilityID('listView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches((respondsToSelector(accessibilityIdentifier) && accessibilityID('listView')))))) && !(kindOfClass('RCTScrollView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches(((((kindOfClass('UIScrollView') || kindOfClass('UIWebView')) && (respondsToSelector(accessibilityIdentifier) && accessibilityID('listView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches((respondsToSelector(accessibilityIdentifier) && accessibilityID('listView')))))) && 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" : "121"
      }
    ]

      at Invoke._callee5$ (node_modules/detox/lib/client/actions/actions.js:74:52)
      at tryCatch (node_modules/regenerator-runtime/runtime.js:63:40)
      at Generator.invoke [as _invoke] (node_modules/regenerator-runtime/runtime.js:337:22)
      at Generator.prototype.(anonymous function) [as next] (node_modules/regenerator-runtime/runtime.js:96:21)
      at step (node_modules/detox/lib/client/actions/actions.js:1:836)
      at node_modules/detox/lib/client/actions/actions.js:1:1066
      at new Promise (node_modules/core-js/modules/es6.promise.js:177:7)
      at Invoke.<anonymous> (node_modules/detox/lib/client/actions/actions.js:1:747)
      at Invoke.handle (node_modules/detox/lib/client/actions/actions.js:77:229)
      at Client._callee9$ (node_modules/detox/lib/client/Client.js:59:26)

Let me know if I can be of any more help
"react-native": "0.42.3",
"detox": "5.1.3",

[L0wry]

just seen there are new versions of detox, will upgrade and get back to you!

[L0wry]

So this half works

The component scrolls but on the Warning overlay shown below.
Not sure if this is a detox issue or a react thing

continuing to investigate

[L0wry]

stick in a console.disableYellowBox = true; in your app and this works as expected

[LeoNatan]

This issue seems like a duplicate of #85 which is supposed to be fixed in Earl Grey. Just to make sure, with the latest versions of Detox, do you still reproduce this when a yellow box is shown?