mardi 1 mai 2018

Detox - Testing visibility of modal in react native

We are using detox to write E2E testing of a react native app where we have a case which needs to test if a modal appears after a button tap.

But detox was not able to identify modal with the given testID thought the modal opens as expected. Is there a different way test modal in reactnative using detox?

Below is the modal JSX

<Modal
    testID="loadingModal"
    animationType="none"
    transparent
    visible={loading}
    onRequestClose={() => {}}
  >
    <View style={styles.modalContainer}>
      <View style={styles.loginModal}>
        <ActivityIndicator
          animating
          size="large"
          color="#00e0ff"
        />
        <Text style={styles.login}>Logging in...</Text>
      </View>
    </View>
  </Modal>

And below is the code to test the visibility of modal

it('should have welcome screen', async () => {      
    ....

    await element(by.text('CONTINUE')).tap();
    await waitFor(element(by.id('loadingModal'))).toBeVisible().withTimeout(5000);
    await expect(element(by.id('loadingModal'))).toBeVisible(); // this always fails    
});

Aucun commentaire:

Enregistrer un commentaire