11

I use integration_test package to write UI tests on Dart for iOS and Android platforms. I also have a webview in my app showing login page with text fields. I use webview_flutter for it.

Does anybody know if tester can interact with my webview within integration test? Can I find a textfield on the webpage and enter text into it?

I want to write test code like this, but for the webview:

testWidgets('Authorization test', (tester) async {
  ...
  await tester.enterText(find.byKey(Key('login_text_field')), 'login');
  await tester.enterText(find.byKey(Key('password_text_field')), 'password');
  await tester.tap(find.byKey(Key('sign_in_button')));
  await tester.pumpAndSettle();
}

Here is content of the web page:

enter image description here

Mol0ko
  • 2,938
  • 1
  • 18
  • 45
  • I don't think so. "find" depends on flutter elements (keys, icons, etc) and when you open a web view you're on a website that has a different scope to the app. That website should be tested seperately and if you're using a webview then you need to trust that the website is supposed to work the way it should. – Faisal Choura Mar 12 '21 at 09:52
  • @FaisalChoura thanks for your comment. I use this web page for authorization as you can see. And I want to write test that covers authorization process and features of authorized user that becomes available after authorization. I understand that I can't interact with webview as I do with flutter widgets (via keys). I just hope there is a workaround for webview and somebody here solved this =) – Mol0ko Mar 12 '21 at 10:06
  • For authentication it's best if you mock the response that you would get from the successful login and then test what's needed – Faisal Choura Mar 12 '21 at 10:10
  • 3
    I afraid mocking auth response is not a workaround here because I write e2e tests and need to get actual access token from test server. Mocks are needed for integration tests that test the app in isolation. – Mol0ko Mar 12 '21 at 13:41
  • Hi @Mol0ko, did you find a solution for this? I have the same problem in an e2e integration test where I want to use a web page for authorization to log into the app. – Giuseppe Cianci May 21 '21 at 13:05
  • Hi @Jeppi, no, unfortunately I didn't find a solution. Webview is a black box for flutter tests and I still don't know how to access fields. We have an intention to use native login form, so I just gave up – Mol0ko May 21 '21 at 13:17
  • 1
    @Mol0ko I know this question is related to integration_test package and I think it's not possible to access webview using this package. I had same needs and found this tool https://github.com/appium-userland/appium-flutter-driver which allows you to switch between Flutter, Native and WebView contexts. Using it I was able to click on sign in button in Flutter which opens OAuth web page where I could fill in credentials and switch back to flutter app – Sergey Anisimov Nov 27 '21 at 02:46

1 Answers1

2

This is now possible with Patrol!

You could write your test like this:

patrolTest(
  'Authorization test',
  nativeAutomation: true,
  ($) async {
    // ...
    await $.native.enterTextByIndex('login', index: 0);
    await $.native.enterTextByIndex('password', index: 1);
    await $.native.tap(Selector(text: 'Sign in'));
    // ...
  },
);
Bartek Pacia
  • 1,085
  • 3
  • 15
  • 37
  • Hi Bartek Pacia, im getting 'package:flutter/src/foundation/binding.dart': Failed assertion: line 146 pos 12: '_debugInitializedType == null': is not true. – Ashish Jan 25 '23 at 11:24
  • Hi Ashihs, if you're facing issues with Patrol, create a new issue in its repo :) – Bartek Pacia Jan 26 '23 at 10:40