Repository: flutter
Issue: [web] SelectableText: Incorrect behavior on double click
Labels: a: text input,framework,platform-mac,platform-web,a: desktop,has reproducible steps,P2,found in release: 2.1,found in release: 2.2,team-framework,triaged-framework

<!-- Thank you for using Flutter!

     If you are looking for support, please check out our documentation
     or consider asking a question on Stack Overflow:
      * https://flutter.dev/
      * https://api.flutter.dev/
      * https://stackoverflow.com/questions/tagged/flutter?sort=frequent

     If you have found a bug or if our documentation doesn't have an answer
     to what you're looking for, then fill out the template below. Please read
     our guide to filing a bug first: https://flutter.dev/docs/resources/bug-reports
-->

## Steps to Reproduce

1. Use the [`SelectableText`](https://api.flutter.dev/flutter/material/SelectableText-class.html) widget with `https://m.media-amazon.com/images/I/9135KRo8Q7L._SS500_.jpg` as text. 
2. Run the app on the web
3. Double click the url as shown in the videos below

**Expected results:** 

<table>
  <tr></tr>
  <tr>
    <th>Double click</th>
    <th>Double click + drag</th>
  </tr>
    <tr>
      <td>
<video src="https://user-images.githubusercontent.com/46222898/115145295-1b8db900-a051-11eb-8846-810a688772cc.mp4"/>
      </td>
       <td>
         <video src="https://user-images.githubusercontent.com/46222898/115145289-1466ab00-a051-11eb-8663-13e2ed3d9c0a.mp4"/>
       </td>
    </tr>
</table>

**Actual results:** <!-- what did you see? -->

<table>
  <tr></tr>
  <tr>
    <th>Double click</th>
    <th>Double click + drag</th>
  </tr>
    <tr>
      <td>
<video src="https://user-images.githubusercontent.com/46222898/115145517-2c8afa00-a052-11eb-82bc-ffa4cc074aee.mp4"/>
      </td>
       <td>
         <video src="https://user-images.githubusercontent.com/46222898/115145510-21d06500-a052-11eb-9ffb-2bb6363eb81c.mp4"/>
       </td>
    </tr>

<tr>
<td>SelectableText selects amazon.com while the correct behavior would be com or amazon</td>
<td>SelectableText selects each char while the correct behavior would be a selection by words</td>
</tr>
</table>

<details>
  <summary>Logs</summary>

<!--
      Run your application with `flutter run --verbose` and attach all the
      log output below between the lines with the backticks. If there is an
      exception, please see if the error message includes enough information
      to explain how to solve the issue.
-->



<!--
     Run `flutter analyze` and attach any output of that command below.
     If there are any analysis errors, try resolving them before filing this issue.
-->



<!-- Finally, paste the output of running `flutter doctor -v` here. -->

```
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel master, 2.2.0-11.0.pre.152, on Microsoft Windows [Version 10.0.19042.867], locale en-DE)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[√] Chrome - develop for the web
[X] Visual Studio - develop for Windows
    X Visual Studio not installed; this is necessary for Windows development.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 4.0)
[√] IntelliJ IDEA Community Edition (version 2020.3)
[√] IntelliJ IDEA Community Edition (version 2021.1)
[√] Connected device (3 available)

! Doctor found issues in 1 category.
```

</details>