Multiple non-arabic character sequences are broken with RTL tag.

[berkersaptas]

Steps to Reproduce

HTML

<p dir="rtl" style="margin-bottom:0pt; line-height:normal; font-size:16pt;">
  <span style="font-family:Sakkal Majalla; font-size:32pt;; color:#0070c0">مَالِكِ</span>
  <span style="font-family:Liberation Sans Narrow font-size:16pt;">=</span>
  <span dir="ltr">
    <span style="font-family:Liberation Sans Narrow; font-size:16pt;">
      <span dir="ltr"></span>hükümrnnıdır</span>
    <sub>
      <span style="font-family:Liberation Sans Narrow font-size:30pt;; ; color:#31849b">«mãlik»</span>
    </sub>
  </span>
  <span style="font-family:Liberation Sans Narrow; font-size:16pt;">
    <span dir="rtl"></span>&#xa0;</span>
  <span style="font-family:Liberation Sans Narrow; font-size:16pt;; color:#0d0d0d">▼
  </span>
  <span style="font-family:Sakkal Majalla; font-size:32pt;; color:#0070c0">يَوْمِ</span>
  <span style="font-family:Liberation Sans Narrow font-size:16pt;">=</span>
  <span style="font-family:Liberation Sans Narrow; font-size:16pt;" dir="ltr">
    <span dir="ltr"></span>gününün</span>
  <span style="font-family:Liberation Sans Narrow; font-size:16pt;">
    <span dir="rtl"></span>&#xa0;&#xa0;&#xa0;
  </span>
  <span style="font-family:Sakkal Majalla; font-size:32pt;; color:#0070c0">الدِّينِ</span>
  <span style="font-family:Liberation Sans Narrow font-size:16pt;">=</span>
  <span dir="ltr">
    <span style="font-family:Liberation Sans Narrow; font-size:16pt;">
      <span dir="ltr"></span>o</span>
    <span style="font-family:Liberation Sans Narrow; font-size:16pt;">&#xa0;</span>
    <span style="font-family:Liberation Sans Narrow; font-size:16pt;">Ynrgılnmn</span>
    <sub>
      <span style="font-family:Liberation Sans Narrow font-size:30pt;; ; color:#31849b">«dîn»</span>
    </sub>
  </span>
</p>

`HtmlWidget` configuration

 HtmlWidget(
                    htmlData,
                  ),

Tesing environment

[✓] Flutter (Channel stable, 2.10.4, on macOS 12.2.1 21D62 darwin-x64, locale
    tr-TR)
[!] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/macos#android-setup for
      more details.
[✓] Xcode - develop for iOS and macOS (Xcode 13.3.1)
[✗] Chrome - develop for the web (Cannot find Chrome executable at
    /Applications/Google Chrome.app/Contents/MacOS/Google Chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[✓] Android Studio (version 4.1)
[✓] VS Code (version 1.66.2)
[✓] Connected device (1 available)
[✓] HTTP Host Availability

Expected results

when there are more than one non arabic words i have trouble in their place

I have tested it on third party html viewer sites and they can display data as I want to see it.

example : https://codebeautify.org/htmlviewer

Actual results

[daohoangson]

This is quite tricky to get right since Flutter currently doesn't support changing text direction in the middle of a paragraph. I'll see what can be done.

[berkersaptas]

Thanks for your reply. Will it be possible to do this?

[daohoangson]

This is currently not feasible. We will have to wait for framework support before implementing this.