9

Is there any way to close a dialog by "tapping it away", i.e. tapping outside of the content to close it with Flutter Driver?

My problem is that the dialog does not have any buttons that would close it. Instead the user is expected to either tap outside of it or use the back button. However, FlutterDriver does not have a "back" option.

Hence, I am wondering how I would tap outside of the dialog in order to close it.

creativecreatorormaybenot
  • 114,516
  • 58
  • 291
  • 402
  • As the tap method taps the center of the widget, it might be a problem. Do you have an AppBar? In that case you might tap on it. –  Jun 14 '19 at 22:41
  • It looks like the only solution will be to add a close button to the dialog. –  Jun 15 '19 at 12:34
  • Any chance flutter_driver pageBack https://api.flutter.dev/flutter/flutter_driver/CommonFinders/pageBack.html will work here? – alichur Jun 24 '19 at 13:21
  • Can you try by fetching `height` or `width` of dialog and then making use of deltas (dx, dy) of `driver.scroll` to tap ? For ex : if width of dialog is 100, use `driver.scroll` s dx parameter and pass dx value as more than 100. – Darshan Jul 01 '19 at 10:09

2 Answers2

4

The key that is commonly used for modals in Flutter is ModalBarrier, which is why the following should do the trick:

await driver.tap(find.byType(ModalBarrier));

This will work as long as barrierDismissible is set to true.
Essentially, when tapping away a dialog in Flutter, you are tapping on the modal barrier, which is why above code works.

Thanks to John Muchow for finding out.

Burhanuddin Rashid
  • 5,260
  • 6
  • 34
  • 51
creativecreatorormaybenot
  • 114,516
  • 58
  • 291
  • 402
0

You would want to set the barrierDismissible property of the dialog to true and add a barrierLabel.

This will allow you to tap outside and close the dialog

https://api.flutter.dev/flutter/widgets/showGeneralDialog.html

Patrick Kelly
  • 971
  • 7
  • 15
  • The barrierDismissible argument is used to determine whether this route can be dismissed by tapping the modal barrier. This argument defaults to true. If barrierDismissible is true, a non-null barrierLabel must be provided. Did you provide a barrierLabel? Showing your code also really helps. – Patrick Kelly Jul 21 '19 at 15:30
  • The reason why you must provide a barrierLabel is for people using screen readers. If you don't provide a way for flutter to tell the screen reader that this is how to dismiss the modal then the user will not know how. Flutter enforces this. – Patrick Kelly Jul 21 '19 at 15:35
  • You wrote "Hence, I am wondering how I would tap outside of the dialog in order to close it." I provided you with the correct answer. Your issue has nothing to do with the FlutterDriver. You want to close the dialog. You are correct that barrierDismissible is set to true by default. However it's not closing when you tap outside because you have not set a barrierLabel. This is the best answer I can give you without seeing the code. Why don't you give it a try and let me know. – Patrick Kelly Jul 21 '19 at 21:01
  • My answer is true for both tests and manual input. If barrierDismissible is true, a non-null barrierLabel must be provided. Do you have a barrierLabel? If not your tests will fail. If your question is how to test for this behaviour you can edit your question and maybe get the answer you're looking for. Right now the only question I see is "I am wondering how I would tap outside of the dialog in order to close it." I was just trying to help. – Patrick Kelly Jul 21 '19 at 22:10