Find element by text doesn't function with minimal project on latest version of RN and detox

[Rob117]

Description

I have a very, very simple project set up with one file, using the detox getting started guide. While searching by element id, I have no problem finding the element and all tests pass.

However, the problem is that searching by text returns an error saying that the UI element could not be found. I am not using any extra libraries or toolkits at all, and I have tried to run the tests with both Jest and Mocha using detox test.

Please find very simple project attached:

Project

Main File

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, Button } from 'react-native';

type Props = {};

export default class App extends Component<Props> {
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <View testID="welcome" style={styles.container}>
        <Text style={styles.welcome}>Welcome to React Native!</Text>
        <Text style={styles.instructions}>
          This is a React Native snapshot test.
        </Text>
        <Button title="Say Hello" color="#814584" testID="hello_button" />
        <Button title="To The World" color="#814584" testID="world_button" />
        <Text>Hello!!!</Text>
        <Text>World!!!</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF'
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5
  }
});

• Detox: 7.1.0
• Detox-server: 7.0.0
• Detox-cli: 1.1.0-alpha.0449f580
• Node: 9.4.0
• Device: iPhone 7 Emulator
• Xcode: 9.2
• macOS: 10.12.6
• react-native-cli: 2.0.1
• react-native: 0.53.0

I ran the tests with loglevel set to verbose. The output was huge, however, so I attached it in a gist.

https://gist.github.com/Rob117/57defa8a9c166bba2e2199d194a62ee1

If there is any additional information I could provide to be useful, or something obvious that I am overlooking here, please let me know.

Thank you.

[chadlwilson]

Yeah, seems something to do with the text view elements not matching on RN 0.53.0.

For an example assertion that worked fine on earlier RN (0.50.3) with Detox 7.1.0

expect(element(by.id("blahBlah-value"))).toHaveText("7,032");

we now get

Error: An assertion failed.
    Exception with Assertion: {
      "Assertion Criteria" : "assertWithMatcher:((kindOfClass('UILabel') || kindOfClass('UITextField') || kindOfClass('UITextView')) && hasText('7,032'))",
      "Element Matcher" : "(((respondsToSelector(accessibilityIdentifier) && accessibilityID('blahBlah-value')) && !(kindOfClass('RCTScrollView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches(((respondsToSelector(accessibilityIdentifier) && accessibilityID('blahBlah-value')) && kindOfClass('RCTScrollView'))))))"
    }

    Error Trace: [
      {
        "Description" : "Assertion with matcher [M] failed: UI element [E] failed to match the following matcher(s): [S]",
        "Description Glossary" :     {
          "M" : "((kindOfClass('UILabel') || kindOfClass('UITextField') || kindOfClass('UITextView')) && hasText('7,032'))",
          "E" : "<RCTTextView:0x7f96d9fac5f0; AX=Y; AX.id='blahBlah-value'; AX.label='7,032'; AX.frame={{418.5, 318}, {64.5, 40.5}}; AX.activationPoint={450.75, 338.25}; AX.traits='UIAccessibilityTraitStaticText'; AX.focused='N'; frame={{33, 0}, {64.5, 40.5}}; alpha=1>",
          "S" : "kindOfClass('UILabel'), kindOfClass('UITextField'), kindOfClass('UITextView')"
        },
        "Error Domain" : "com.google.earlgrey.ElementInteractionErrorDomain",
        "Error Code" : "3",
        "File Name" : "GREYAssertions.m",
        "Function Name" : "+[GREYAssertions grey_createAssertionWithMatcher:]_block_invoke",
        "Line" : "75"
      }
    ]

Given this is looking up by accessibility ID, it looks like the kindOfClass matchers aren't working now.

[LeoNatan]

Thanks guys, we'll look at this issue soon.

[kumarpatel]

Same problem.
Detox: 7.1.0
react-native: 0.53.0

It does work when react-native is downgraded to 0.50. But this isn't an option for us as there are critical bug fixes between RN .50 and .53

Any ideas as to where problem is? what file?

[chadlwilson]

@kumarpatel Detox 7.1.0 is working fine on RN 0.52.3, so you don't have to go as far back as 0.50 to still use Detox.

[LeoNatan]

I guess something changed with RN 0.53.0
I haven't yet had opportunity to debug.

0.52.x should be fully supported, so stick to that for now.

[LeoNatan]

Fixed

[chadlwilson]

Great, thanks a lot @LeoNatan !

[maxkomarychev]

@LeoNatan thanks for the fix!
do you plan to publish an update to npm anytime soon?
It's not possible to install detox as detox@wix/detox#master since it's monorepo managed with lerna is it?

[LeoNatan]

Soon. There are still issues in CI with my fix, which I am working on right now.

[Rob117]

You are awesome, thank you so much!

• ninja edit -> This is working in the latest version of RN with the latest version of Detox.