[GH-ISSUE #50] [Bug] Colored background of highlighted text covers cursor #25

New issue

Closed

opened 2026-03-23 20:30:38 +00:00 by mirror · 3 comments

mirror commented

2026-03-23 20:30:38 +00:00

Owner

Originally created by @myl7 on GitHub (Nov 20, 2021).
Original GitHub issue: https://github.com/AppFlowy-IO/AppFlowy/issues/50

Originally assigned to: @Hari-07 on GitHub.

Describe the bug
When text is highlighted with colored background, the background will cover the
'I' cursor put on it

To Reproduce
Run the desktop app and nagivate to "Read me" page, choose any highlighted text and put cursor on it.

Expected behavior
The cursor should be over the colored background, directly seen, like most rich-text editors.

Screenshots

The blue point in the middle is the "I" cursor, covered.

Desktop (please complete the following information):

OS: Arch Linux
Browser: Chrome
Version: 96.0.4664.45

Additional context
flutter doctor -v:

Click to expand

[✓] Flutter (Channel dev, 2.6.0-11.0.pre, on Arch Linux 5.15.2-arch1-1, locale
    en_US.UTF-8)
    • Flutter version 2.6.0-11.0.pre at /opt/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 4b330ddbed (9 weeks ago), 2021-09-16 17:29:58 -0700
    • Engine revision 5b81c6d615
    • Dart version 2.15.0 (build 2.15.0-116.0.dev)
    • Pub download mirror https://pub.flutter-io.cn
    • Flutter download mirror https://storage.flutter-io.cn

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at /home/myl/.local/lib/Android/Sdk
    • Platform android-30, build-tools 30.0.3
    • Java binary at:
      /home/myl/.local/share/JetBrains/apps/AndroidStudio/ch-0/203.7784292/jre/b
      in/java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • CHROME_EXECUTABLE = /usr/bin/google-chrome-stable

[✓] Linux toolchain - develop for Linux desktop
    • clang version 13.0.0
    • cmake version 3.21.4
    • ninja version 1.10.2
    • pkg-config version 1.8.0

[✓] Android Studio (version 2020.3)
    • Android Studio at
      /home/myl/.local/share/JetBrains/apps/AndroidStudio/ch-0/203.7784292
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189)

[✓] IntelliJ IDEA Ultimate Edition (version 2021.2)
    • IntelliJ at /home/myl/.local/share/JetBrains/apps/IDEA-U/ch-0/212.5457.46
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart

[✓] Connected device (2 available)
    • Linux (desktop) • linux  • linux-x64      • Arch Linux 5.15.2-arch1-1
    • Chrome (web)    • chrome • web-javascript • Google Chrome 96.0.4664.45

• No issues found!

Originally created by @myl7 on GitHub (Nov 20, 2021). Original GitHub issue: https://github.com/AppFlowy-IO/AppFlowy/issues/50 Originally assigned to: @Hari-07 on GitHub. **Describe the bug** When text is highlighted with colored background, the background will cover the 'I' cursor put on it **To Reproduce** Run the desktop app and nagivate to "Read me" page, choose any highlighted text and put cursor on it. **Expected behavior** The cursor should be over the colored background, directly seen, like most rich-text editors. **Screenshots** ![Cursor put on the highlighted text](https://user-images.githubusercontent.com/49339031/142719654-3942f6ae-f16f-4367-8305-69b8cdd579e0.png) The blue point in the middle is the "I" cursor, covered. **Desktop (please complete the following information):** - OS: Arch Linux - Browser: Chrome - Version: 96.0.4664.45 **Additional context** `flutter doctor -v`: <details> <summary>Click to expand</summary> ``` [✓] Flutter (Channel dev, 2.6.0-11.0.pre, on Arch Linux 5.15.2-arch1-1, locale en_US.UTF-8) • Flutter version 2.6.0-11.0.pre at /opt/flutter • Upstream repository https://github.com/flutter/flutter.git • Framework revision 4b330ddbed (9 weeks ago), 2021-09-16 17:29:58 -0700 • Engine revision 5b81c6d615 • Dart version 2.15.0 (build 2.15.0-116.0.dev) • Pub download mirror https://pub.flutter-io.cn • Flutter download mirror https://storage.flutter-io.cn [✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3) • Android SDK at /home/myl/.local/lib/Android/Sdk • Platform android-30, build-tools 30.0.3 • Java binary at: /home/myl/.local/share/JetBrains/apps/AndroidStudio/ch-0/203.7784292/jre/b in/java • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189) • All Android licenses accepted. [✓] Chrome - develop for the web • CHROME_EXECUTABLE = /usr/bin/google-chrome-stable [✓] Linux toolchain - develop for Linux desktop • clang version 13.0.0 • cmake version 3.21.4 • ninja version 1.10.2 • pkg-config version 1.8.0 [✓] Android Studio (version 2020.3) • Android Studio at /home/myl/.local/share/JetBrains/apps/AndroidStudio/ch-0/203.7784292 • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189) [✓] IntelliJ IDEA Ultimate Edition (version 2021.2) • IntelliJ at /home/myl/.local/share/JetBrains/apps/IDEA-U/ch-0/212.5457.46 • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart [✓] Connected device (2 available) • Linux (desktop) • linux • linux-x64 • Arch Linux 5.15.2-arch1-1 • Chrome (web) • chrome • web-javascript • Google Chrome 96.0.4664.45 • No issues found! ``` </details>

mirror

2026-03-23 20:30:38 +00:00

closed this issue
added the
bug
label

mirror commented

2026-03-23 20:30:38 +00:00

Author

Owner

@Hari-07 commented on GitHub (Nov 22, 2021):

I can take up this issue if no one else is working on it yet

@Hari-07 commented on GitHub (Nov 22, 2021): I can take up this issue if no one else is working on it yet

mirror commented

2026-03-23 20:30:39 +00:00

Author

Owner

@pdckxd commented on GitHub (Nov 23, 2021):

@Hari-07 , I found the root cause is in lib\workspace\presentation\stack_page\doc\doc_page.dart line 97. the editor variable should be initialized with addtional parameter "paintCursorAboveText: true,". Can you try from your side and issue the PR if it works.

@pdckxd commented on GitHub (Nov 23, 2021): @Hari-07 , I found the root cause is in lib\workspace\presentation\stack_page\doc\doc_page.dart line 97. the editor variable should be initialized with addtional parameter "paintCursorAboveText: true,". Can you try from your side and issue the PR if it works. ![image](https://user-images.githubusercontent.com/1890394/142977950-e5159614-e290-43ad-96d1-763c4af2910a.png) ![image](https://user-images.githubusercontent.com/1890394/142977998-10459a1a-9be0-49ad-bbec-a2290fed7177.png)

mirror commented

2026-03-23 20:30:39 +00:00

Author

Owner

@Hari-07 commented on GitHub (Nov 23, 2021):

Yes that worked, thank you

@Hari-07 commented on GitHub (Nov 23, 2021): Yes that worked, thank you