4

I have a Flutter AlertDiaog that comes up on my flutter app. Using Flutter Driver, I am unable to tap on either the Flutter AlertDialog or on any element on the AlertDialog. Is there a way to tap on any AlertDialog that comes up on my app?

I have tried all the below, but still no luck:

  1. First:
    await driver.tap(find.byType('ModalBarrier'));
    print('*******TAPPED - ModalBarrier*******');
  1. Second
    await driver.tap(find.byType('AlertDialog'));
    print('*******TAPPED - AlertDialog*******');
  1. Third
     await driver.tap(find.text('Gallery')); // Tapping 'Gallery', can access pics
     print('*******TAPPED - Gallery *******');
Manmeet Chadha
  • 211
  • 1
  • 6

1 Answers1

0

The idea is to first identify the text in AlertDialog by a unique key, tell the driver about it and then perform tap action on it. In your main code, add key property to parent widget that has the Text you want to tap on, for example: I am showing a simple AlertDialog that show 2 options, as below:

enter image description here

The code for this is:

showDialog(context: context,
        builder: (BuildContext context) {
          return AlertDialog(
            content: SingleChildScrollView(
              child: ListBody(
                children: <Widget>[
                  GestureDetector(
                    key: Key('firstOptionKey'),
                    child: Text('Take a picture'),
                    onTap: () {},
                  ),
                  Padding(
                    padding: EdgeInsets.all(8.0),
                  ),
                  GestureDetector(
                    key: Key('secondOptionKey'),
                    child: Text('Select from gallery'),
                    onTap: () {},
                  ),
                ],
              ),
            ),
          );
        });

As you can see, I've wrapped both the text with GestureDetector that allows us to tap on them. Also, I used key property for each GestureDetector to uniquely identify both texts.

In your driver test, you then simply need to identify each text using byValueKey and tell driver to tap on it, as below:

test('test dialog', () async {

          final firstText = find.byValueKey('firstOptionKey');
          await driver.waitFor(find.text('Tap'));  
          await driver.tap(find.text('Tap'));   // tap on this button to open alertDialog
          await driver.waitFor(firstText);      // wait for flutter driver to locate and identify the element on screen
          await driver.tap(firstText);
          print('tapped on it');
        });

enter image description here

Hope this answers your question.

Darshan
  • 10,550
  • 5
  • 49
  • 61
  • Darshan, Thanks for your response. In your main code above I see that you have not used 'return' while calling showDialog(). Are you able to return the photo gallery on screen if you add such an action under tap{} ? For me flutter driver could not locate the AlertDialog till now only because I am using 'return' for showDialog() call, such that the photo gallery is actually returned after tap. – Manmeet Chadha Dec 18 '19 at 20:15
  • I tried based on your reply and directly returned `alertDialog` on `onPressed` method and it works as expected. – Darshan Dec 19 '19 at 08:46
  • 2
    The solution worked me only after I used the runUnsynchronized method, like this: await driver.runUnsynchronized(() async { await driver.tap(find.byValueKey('firstOptionKey')); }); – Manmeet Chadha Dec 21 '19 at 09:56