2 Screen same layout Multiple Matches Issue

[heuism]

Description

I got 1 layout that are the same but only the content is different, so you can imagine that for user it gonna be 3 different screen A -> B -> C. But in fact the underlying scenes are only A -> B -> A'(which is A with new text). So now i put the id there, and they say it is multiple matches. I tried to use the text for the header to be the additional key to differentiate between the two.

However, the Header is identify by the Redux store and therefore it change both of the A and the A' content at the same time (as i understand this, i could be wrong, i am still new). So even if i put the header in, they are still the same testID and therefore can not press the button on the screen.

Is there a way to fix this? or way to work around this? Thanks

[mfrachet]

Does your screen A always exist when A' exists too ?

Can you provides some code snippets / github project to check this :).

In fact it can be multiple things dealing with your context. I don't know if you're using a special kind of navigation (react-navigation and stackNavigator ?) for your transition scenes, or if layout A can exist when layou A' exists.

[heuism]

The current project is running using Router from 'react-native-router-flux'. I guess in the code they just use the Actions. to navigate between screen, so A when press a button on A will execute Actions.B (with B is the name of the screen B) then from B -> Actions.C. It shouldn't be co exist. But then i guess with the Actions in Router flux, they literally still co-exist. Cause there is no other screen i put that testID

[mfrachet]

It seems that react-native-router uses a navStack, so it may cumulates the routes inside of a stack.

From the example on react-native-router-flux :

// go back (i.e. pop the current screen off the nav stack)
Actions.pop()

And it seems that your router, under the hood, deals with react-navigation :

• react-native-router-flux/navigationStore

• react-native-router-flux/package.json

It seems possible that you're using a scene stack under the hood, without knowing it. It can cause you detox failures due to multiple equals matchers. I suggest to take a deeper look inside your codebase / react-native-router-flux implementation to check if it's the case and adjust your test suites :)

[heuism]

Yeah i guess it actually stack up the scene. I just found the work around that because i have the storing my current screen -> so i can check stop at the screen B then reload the app. But it would be better if there is proper way to work around this stuff.

[LeoNatan]

Sounds like the frameworks loads all views in memory on the screen. If all native views are loaded, this means terrible news for performance and memory usage. Please consider https://github.com/wix/react-native-navigation

Detox matchers assume single element is available at any single time. Please post the view hierarchy from Xcode.

[ferrannp]

Yea it happens to me with react-navigation. If for example you use a matcher by.text, if the text is in two screens, you will get the error of multiple matches. You need to use really good testID...

[markhu]

In my case, I had to replace this first line with the second:

-    this.props.navigation.navigate(WELCOME_ROUTE);
+    this.props.navigation.pop();