[Flutter] Phantom element being tapped instead of actual element

[tide-conrad]

Describe the bug

What appears to be a phantom DOM of the current screen appears in the top left of the app and is causing tests to intermittently fail on Apple. When performing an action the event is redirected to the phantom DOM not the actual screen.

The DOM appears when interacting with input fields (sometime when the keyboard is displayed) When selecting field which has text entered

To Reproduce Steps to reproduce the behavior, e.g.:

1. Enter text into field
2. Wait ~20 sec
3. TapOn text

Expected behavior

When tapping on field which contains text, focus should change to that field and the keyboard should show or hide (depending on its current state)

Screenshots

Environment information (please complete the following information):

• Maestro version 1.29.0
• Platform: iOS 16.4
• Framework: Flutter
• Device model and OS version: N/A
• Simulator
• Host Mac

Workspace (if applicable) N/A

Bugreport output (if applicable) N/A

Additional context N/A

[igorsmotto]

Hey @tide-conrad,

1. Could you share the hierarchy before inputting the text? Is the phantom element there?
2. What happens if you try to tapOn in the element itself and not the text of it? (with an id)
3. What happens if you don't wait those ~20 seconds?

From the get-go, It looks to me this is something specifically related about your app. Could you test this in a different App?

[tide-conrad]

1. hierarchy before and after reproducing problem before adding.txt after reproducing problem.txt

a. it is possible to tapOn field, enter text and phantom DOM does not occur b. it is intermittent when issue reproduces. Sometime, the first time text is clicked other times it occurs after clicking text multiple times. (Note, automated test is only clicking field once) c. fields have accessibility text which is being used to find element 3. the delay was only for reproducing the issue. I can reproduce issue without delay.

[igorsmotto]

Thank you for sharing these.

Inspecting the hierarchy files, nothing really pops out, there is no "new element" being suddenly created, as both JSONs have the same keys. This makes sense, Maestro being a BlackBox testing tool does not run an App differently than what it a human would do in a Simulator.

Strangely, the difference between before and after hierarchy is that for some reason the bounds of some elements are being updated. This doesn't make that much sense, Maestro can only obtain the ViewHierarchy and never update the bounds of anything, so I suspect this is something not related to Maestro.

I've failed to reproduce this scenario in a basic Flutter sample app. Could you try to reproduce it in a different App? I have a strong feeling that this is a bug in your App.

As a Workarond, I suggest you try tapping at a relative position avoiding this invisible element:

- tapOn:
     point: 50%,18% # 50% of X-axis and 18% of Y-axis

[tide-conrad]

Tapping based on co-ordinates has been seen not to be reliable depending on the use and what animations are on the screen. also, out app inserts marketing content which can affect the co-ordinates.

I am trying to create an app to reproduce the problem. I will let you know if I am successful.

[alexmercerind]

Any workaround?

[dominicmh]

I'm having the same issue. But I don't think this is related to Maestro. If you inspect the app's layout with Xcode's Accessibility Inspector, you'll see the same layout as presented in Maestro. So this seems more like a Flutter bug on the iOS native side. Found this issue: https://github.com/flutter/flutter/issues/125489.