[web] Incorrect selection affinity #131906

angelosilvestre · 2023-08-04T02:03:02Z

Is there an existing issue for this?

I have searched the existing issues
I have read the guide to filing a bug

Steps to reproduce

Run the sample app on web
Press SHIFT, then press the arrow left key 8 times

Expected results

We should receive the following selection, as we are expanding the selection upstream:

TextSelection(
  baseOffset: 57,
  extentOffset: 49,
)

Actual results

We receive the following selection:

TextSelection(
  baseOffset: 49,
  extentOffset: 57,
)

Code sample

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({
    super.key,
  });

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with DeltaTextInputClient {
  TextInputConnection? _imeConnection;

  TextEditingValue _currentTextEditingValue = const TextEditingValue(
    text: 'Press SHIFT + Left arrow to expand the selection upstream',
    selection: TextSelection.collapsed(offset: 57),
  );

  @override
  void initState() {
    super.initState();
    _attachToIme();
  }

  @override
  void dispose() {
    _detachFromIme();
    super.dispose();
  }

  @override
  void updateEditingValueWithDeltas(List<TextEditingDelta> textEditingDeltas) {
    TextEditingValue newValue = _currentTextEditingValue.copyWith();
    for (final delta in textEditingDeltas) {
      print('Applying delta: $delta');
      newValue = delta.apply(newValue);
    }

    print('New editing value: $newValue');

    setState(() {
      _currentTextEditingValue = newValue;
    });
  }

  void _attachToIme() {
    if (_imeConnection != null && _imeConnection!.attached) {
      return;
    }

    const config = TextInputConfiguration(
      enableDeltaModel: true,
      inputType: TextInputType.multiline,
      inputAction: TextInputAction.newline,
    );
    _imeConnection = TextInput.attach(this, config);
    _imeConnection!.setEditingState(_currentTextEditingValue);
    _imeConnection!.show();
  }

  void _detachFromIme() {
    _imeConnection?.close();
    _imeConnection = null;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Focus(
        autofocus: true,
        child: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text('Text: ${_currentTextEditingValue.text}'),
              const SizedBox(height: 30),
              Text('Selection: ${_currentTextEditingValue.selection}'),
              const SizedBox(height: 30),
              Text('Selected text: ${_currentTextEditingValue.selection.textInside(_currentTextEditingValue.text)}'),
            ],
          ),
        ),
      ),
    );
  }

  @override
  void connectionClosed() {}

  @override
  AutofillScope? get currentAutofillScope => null;

  @override
  TextEditingValue? get currentTextEditingValue => _currentTextEditingValue;

  @override
  void didChangeInputControl(TextInputControl? oldControl, TextInputControl? newControl) {}

  @override
  void insertContent(KeyboardInsertedContent content) {}

  @override
  void insertTextPlaceholder(Size size) {}

  @override
  void performAction(TextInputAction action) {}

  @override
  void performPrivateCommand(String action, Map<String, dynamic> data) {}

  @override
  void performSelector(String selectorName) {}

  @override
  void removeTextPlaceholder() {}

  @override
  void showAutocorrectionPromptRect(int start, int end) {}

  @override
  void showToolbar() {}

  @override
  void updateEditingValue(TextEditingValue value) {}

  @override
  void updateFloatingCursor(RawFloatingCursorPoint point) {}
}

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Logs

No relevant logs.

Flutter Doctor output

Doctor output

[✓] Flutter (Channel master, 3.13.0-11.0.pre.18, on Microsoft Windows [versÆo 10.0.22000.2176], locale pt-BR)
    • Flutter version 3.13.0-11.0.pre.18 on channel master at c:\git\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision f8afcd5aa0 (7 days ago), 2023-07-27 19:34:03 -0400
    • Engine revision 196474bd96
    • Dart version 3.2.0 (build 3.2.0-8.0.dev)
    • DevTools version 2.25.0

[✓] Windows Version (Installed version of Windows is version 10 or higher)

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at C:\Users\angelo\AppData\Local\Android\sdk
    • Platform android-33, build-tools 33.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.12+7-b1504.28-7817840)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[✓] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.5.3)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.5.33516.290
    • Windows 10 SDK version 10.0.22621.0

[✓] Android Studio (version 2021.2)
    • Android Studio at C:\Program Files\Android\Android Studio
    • 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.12+7-b1504.28-7817840)

[✓] VS Code (version 1.80.2)
    • VS Code at C:\Users\angelo\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.70.0

[✓] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [versÆo 10.0.22000.2176]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 115.0.5790.111
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 115.0.1901.188

[✓] Network resources
    • All expected network resources are available.

• No issues found!

angelosilvestre · 2023-08-04T02:03:31Z

Cc @Renzo-Olivares @justinmc

danagbemava-nc · 2023-08-04T08:37:36Z

Reproducible using the code sample provided above.

flutter doctor -v

[✓] Flutter (Channel stable, 3.10.6, on macOS 13.4.1 22F770820d darwin-arm64, locale en-GB)
    • Flutter version 3.10.6 on channel stable at /Users/nexus/dev/sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision f468f3366c (3 weeks ago), 2023-07-12 15:19:05 -0700
    • Engine revision cdbeda788a
    • Dart version 3.0.6
    • DevTools version 2.23.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
    • Android SDK at /Users/nexus/Library/Android/sdk
    • Platform android-33, build-tools 33.0.1
    • Java binary at: /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/223.8836.35.2231.10406996/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3)
    • Xcode at /Applications/Xcode-14.3.0.app/Contents/Developer
    • Build 14E222b
    • CocoaPods version 1.12.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.2)
    • Android Studio at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/222.4459.24.2221.10121639/Android Studio.app/Contents
    • 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 17.0.6+0-17.0.6b802.4-9586694)

[✓] Android Studio (version 2022.3)
    • Android Studio at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/223.8836.35.2231.10406996/Android Studio.app/Contents
    • 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 17.0.6+0-17.0.6b829.9-10027231)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.2)
    • IntelliJ at /Users/nexus/Applications/JetBrains Toolbox/IntelliJ IDEA Ultimate.app
    • Flutter plugin version 74.0.5
    • Dart plugin version 232.8660.129

[✓] IntelliJ IDEA Ultimate Edition (version 2023.1.4)
    • IntelliJ at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/IDEA-U/ch-0/231.9225.16/IntelliJ IDEA.app
    • 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

[✓] IntelliJ IDEA Ultimate Edition (version 2023.2)
    • IntelliJ at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/IDEA-U/ch-0/232.8660.185/IntelliJ IDEA.app
    • 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

[✓] VS Code (version 1.80.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.70.0

[✓] Connected device (3 available)
    • Nexus (mobile)  • 00008020-001875E83A38002E • ios            • iOS 16.6 20G75
    • macOS (desktop) • macos                     • darwin-arm64   • macOS 13.4.1 22F770820d darwin-arm64
    • Chrome (web)    • chrome                    • web-javascript • Google Chrome 115.0.5790.114

[✓] Network resources
    • All expected network resources are available.

• No issues found!

[!] Flutter (Channel master, 3.13.0-17.0.pre.44, on macOS 13.4.1 22F770820d darwin-arm64, locale en-GB)
    • Flutter version 3.13.0-17.0.pre.44 on channel master at /Users/nexus/dev/sdks/flutters
    ! Warning: `flutter` on your path resolves to /Users/nexus/dev/sdks/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutters. Consider adding /Users/nexus/dev/sdks/flutters/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/nexus/dev/sdks/flutter/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutters. Consider adding /Users/nexus/dev/sdks/flutters/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision a353826b70 (2 hours ago), 2023-08-04 02:07:07 -0400
    • Engine revision de0ec1c971
    • Dart version 3.2.0 (build 3.2.0-35.0.dev)
    • DevTools version 2.26.1
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
    • Android SDK at /Users/nexus/Library/Android/sdk
    • Platform android-33, build-tools 33.0.1
    • Java binary at: /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/223.8836.35.2231.10406996/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3)
    • Xcode at /Applications/Xcode-14.3.0.app/Contents/Developer
    • Build 14E222b
    • CocoaPods version 1.12.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.2)
    • Android Studio at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/222.4459.24.2221.10121639/Android Studio.app/Contents
    • 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 17.0.6+0-17.0.6b802.4-9586694)

[✓] Android Studio (version 2022.3)
    • Android Studio at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/223.8836.35.2231.10406996/Android Studio.app/Contents
    • 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 17.0.6+0-17.0.6b829.9-10027231)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.1.4)
    • IntelliJ at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/IDEA-U/ch-0/231.9225.16/IntelliJ IDEA.app
    • 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

[✓] IntelliJ IDEA Ultimate Edition (version 2023.2)
    • IntelliJ at /Users/nexus/Library/Application Support/JetBrains/Toolbox/apps/IDEA-U/ch-0/232.8660.185/IntelliJ IDEA.app
    • 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

[✓] VS Code (version 1.80.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.70.0

[✓] Connected device (3 available)
    • Nexus (mobile)  • 00008020-001875E83A38002E • ios            • iOS 16.6 20G75
    • macOS (desktop) • macos                     • darwin-arm64   • macOS 13.4.1 22F770820d darwin-arm64
    • Chrome (web)    • chrome                    • web-javascript • Google Chrome 115.0.5790.114

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

knopp · 2023-08-14T19:14:28Z

There is a selectionDirection property on textarea and input elements with possible values on none, forward and backward that can be used to determine that the selection is directional. The issue here is that most of the IME code doesn't seem to handle non-normalized text range or directional selection correctly.

knopp · 2023-08-16T13:41:22Z

I have a possible fix for it here: https://github.com/knopp/engine/commits/web_selection_inverted

But it depends on flutter/engine#44693

Fixes flutter/flutter#131906 *List which issues are fixed by this PR. You must list at least one issue.* *If you had to change anything in the [flutter/tests] repo, include a link to the migration guide as per the [breaking change policy].* [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

github-actions · 2023-09-26T07:00:39Z

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

angelosilvestre mentioned this issue Aug 4, 2023

[SuperEditor][web] Fix text input after a deletion (Resolves #1224) superlistapp/super_editor#1269

Merged

danagbemava-nc added the in triage Presently being triaged by the triage team label Aug 4, 2023

danagbemava-nc changed the title ~~[web] Incorret selection affinity~~ [web] Incorrect selection affinity Aug 4, 2023

justinmc assigned Renzo-Olivares Aug 10, 2023

knopp mentioned this issue Aug 17, 2023

[Web] Properly report inverted selection flutter/engine#44806

Merged

8 tasks

auto-submit bot closed this as completed in flutter/engine#44806 Sep 12, 2023

danagbemava-nc added the r: fixed Issue is closed as already fixed in a newer version label Sep 12, 2023

github-actions bot locked as resolved and limited conversation to collaborators Sep 26, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[web] Incorrect selection affinity #131906

[web] Incorrect selection affinity #131906

angelosilvestre commented Aug 4, 2023

angelosilvestre commented Aug 4, 2023

danagbemava-nc commented Aug 4, 2023

knopp commented Aug 14, 2023

knopp commented Aug 16, 2023

github-actions bot commented Sep 26, 2023

[web] Incorrect selection affinity #131906

[web] Incorrect selection affinity #131906

Comments

angelosilvestre commented Aug 4, 2023

Is there an existing issue for this?

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

angelosilvestre commented Aug 4, 2023

danagbemava-nc commented Aug 4, 2023

knopp commented Aug 14, 2023

knopp commented Aug 16, 2023

github-actions bot commented Sep 26, 2023