fleather-editor / fleather

Soft and gentle rich text editing for Flutter applications.
https://fleather-editor.github.io
Other
199 stars 36 forks source link

How to write Integration Tests targeting `Fleather Editor` and entering text in it. #115

Closed niteshsh4rma closed 1 year ago

niteshsh4rma commented 1 year ago

Steps to Reproduce

  1. Target RawEditor using final editor = find.byType(RawEditor)
  2. Tap on FleatherField using tester.tap(editor)
  3. Enter text using tester.enterText("Hey there")

Logs

Nothing happens after tester.enterText is called and test is completed, no text in the FleatherField

[✓] Flutter (Channel stable, 3.7.11, on Ubuntu 20.04.6 LTS 5.15.0-69-generic, locale en_US.UTF-8)
    • Flutter version 3.7.11 on channel stable at /home/nitesh/snap/flutter/common/flutter
    • Upstream repository git@github.com:flutter/flutter.git
    • Framework revision f72efea43c (3 weeks ago), 2023-04-11 11:57:21 -0700
    • Engine revision 1a65d409c7
    • Dart version 2.19.6
    • DevTools version 2.20.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0-rc4)
    • Android SDK at /home/nitesh/Android/Sdk
    • Platform android-33, build-tools 33.0.0-rc4
    • ANDROID_HOME = /home/nitesh/Android/Sdk
    • Java binary at: /snap/android-studio/125/android-studio/jre/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • Chrome at google-chrome

[✓] Linux toolchain - develop for Linux desktop
    • clang version 10.0.0-4ubuntu1
    • cmake version 3.16.3
    • ninja version 1.10.0
    • pkg-config version 0.29.1

[✓] Android Studio (version 2021.3)
    • Android Studio at /snap/android-studio/125/android-studio
    • Flutter plugin version 72.1.1
    • Dart plugin version 213.7433
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)

[✓] VS Code (version 1.77.1)
    • VS Code at /usr/share/code
    • Flutter extension version 3.62.0
Amir-P commented 1 year ago

It's not that convenient yet and I think we should provide some test utilities with Fleather. Right now you can use flutter_test_robots to make it a bit easier.

void main() {
  testWidgets('test', (tester) async {
    final controller = FleatherController();
    final app = MaterialApp(home: FleatherEditor(controller: controller));
    final editor = find.byType(RawEditor);
    await tester.pumpWidget(app);
    await tester.tap(editor);
    await tester.ime.typeText('My Text', finder: editor);
    expect(controller.document.toPlainText(), 'My Text\n');
    await tester.pumpAndSettle(throttleDuration);
  });
}
Amir-P commented 1 year ago

I'm closing it but feel free to reopen if it's not fixed. @niteshsh4rma

ghost commented 1 year ago

Thanks, @Amir-P for the workaround (& @niteshsh4rma for raising an issue). In my case, these lines were enough to make it work (w/o the "expect" from the initial post - it's failing on it probably because you need to trigger frame rendering firstly after action, and only after you can check the results of it):

final editor = find.byType(RawEditor);
await tester.tap(editor);
await tester.ime.typeText(commentText, finder: editor);
await tester.testTextInput.receiveAction(TextInputAction.done);
await tester.pumpAndSettle(throttleDuration);

Note (for others facing this issue & trying this approach): you need to install the "flutter_test_robots".