Sub6Resources / flutter_html

A Flutter widget for rendering static html as Flutter widgets (Will render over 80 different html tags!)
https://pub.dev/packages/flutter_html
MIT License
1.79k stars 860 forks source link

[BUG] App crash when using textOverflow on style with version 3.0.0-alpha.6 #1200

Open luis901101 opened 1 year ago

luis901101 commented 1 year ago

Describe the bug:

Using version flutter_html: 3.0.0-alpha.6 when I set:

maxLines: 2,
textOverflow: TextOverflow.ellipsis,

App crashes, it closes abruptly. This happened to me in a project where I have a widget to show a grid with several "user reviews", so as reviews are html formatted text and are commonly long texts, lets say about 300 chars, so to make the text fit into the small grid view I use maxLines and textOverflow. If I use previous alpha version flutter_html: 3.0.0-alpha.5 I don't have any crash.

HTML to reproduce the issue:

Html is really simple, as far as I have tested just by having <p> tag is enough for crashing.

<p>This is paragraph number one.</p><p>This is paragraph number two.</p><p>This is paragraph number three.</p><p>This is paragraph number four.</p>

Html widget configuration:

Html(
  data: '<p>This is paragraph number one.</p><p>This is paragraph number two.</p><p>This is paragraph number three.</p><p>This is paragraph number four.</p>',
  style: {
    'body': Style(
      color: Colors.white70,
      maxLines: maxLines,
      textOverflow: maxLines == null ? null : TextOverflow.ellipsis,
    )
  },
),

Expected behavior:

App don't crash

Device details and Flutter/Dart/flutter_html versions:

Tested in iOS(15.7.1 and 16.1.1) and Android(from 8 to 12) devices,

flutter doctor -v logs

[✓] Flutter (Channel stable, 3.3.8, on macOS 13.0 22A380 darwin-arm, locale en-US)
    • Flutter version 3.3.8 on channel stable at /Users/user/fvm/versions/3.3.8
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 52b3dc25f6 (3 weeks ago), 2022-11-09 12:09:26 +0800
    • Engine revision 857bd6b74c
    • Dart version 2.18.4
    • DevTools version 2.15.0

Checking Android licenses is taking an unexpectedly long time...[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at /Users/user/Android/SDK
    • Platform android-33, build-tools 33.0.0
    • ANDROID_HOME = /Users/user/Android/SDK
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14B47b
    • CocoaPods version 1.11.3

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

[✓] Android Studio (version 2021.3)
    • Android Studio at /Applications/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 11.0.13+0-b1751.21-8125866)

pubspec.yaml

name: flutter_html_crash_sample
description: A sample of a crash using flutter_html plugin.

publish_to: 'none' # Remove this line if you wish to publish to pub.dev
version: 1.0.0+1

environment:
  sdk: '>=2.18.4 <3.0.0'

dependencies:
  flutter:
    sdk: flutter
  flutter_html: 3.0.0-alpha.6

  cupertino_icons: ^1.0.2

dev_dependencies:
  flutter_test:
    sdk: flutter

  flutter_lints: ^2.0.0

flutter:
  uses-material-design: true

Stacktrace/Logcat

Logs from iOS device:

* thread #10, name = 'io.flutter.1.ui', stop reason = EXC_BAD_ACCESS (code=1, address=0xffffffd94e51a030)
    frame #0: 0x000000010557ec48 Flutter`skia::textlayout::TextLine::measureTextInsideOneRun(skia::textlayout::SkRange<unsigned long>, skia::textlayout::Run const*, float, float, bool, bool) const + 888
Flutter`skia::textlayout::TextLine::measureTextInsideOneRun:
->  0x10557ec48 <+888>: ldr    x1, [x9, #0x30]
    0x10557ec4c <+892>: str    x1, [x19, #0x8]
    0x10557ec50 <+896>: madd   x8, x25, x8, x24
    0x10557ec54 <+900>: ldrb   w9, [x8, #0x4e]
Target 0: (Runner) stopped.
Lost connection to device.

Logs from Android device:

F/libc    (19412): Fatal signal 11 (SIGSEGV), code 1 (SEGV_MAPERR), fault addr 0x8ea84be0ce in tid 19446 (1.ui), pid 19412 (ml_crash_sample)
*** *** *** *** *** *** *** *** *** *** *** *** *** *** *** ***
Build fingerprint: 'TCL/T671O/Austin:11/RKQ1.201112.002/2BED:user/release-keys'
Revision: '0'
ABI: 'arm64'
Timestamp: 2022-12-02 14:39:11-0500
pid: 19412, tid: 19446, name: 1.ui  >>> com.flutter_html_crash_sample.flutter_html_crash_sample <<<
uid: 10253
signal 11 (SIGSEGV), code 1 (SEGV_MAPERR), fault addr 0x8ea84be0ce
    x0  b400008ea84be080  x1  0000006f63ff8f10  x2  ffffffffffffffff  x3  b400006fc2410548
    x4  0000000000000001  x5  0000000000000000  x6  0000000000000002  x7  0000000000000077
    x8  b400006f686f2b80  x9  0000000000000050  x10 0000000000000001  x11 b400006fc240a130
    x12 0000000000000001  x13 0000000000000003  x14 0000000000000001  x15 0000006f611079d0
    x16 00000070570489b8  x17 000000705703ce9c  x18 0000006f60018000  x19 0000006f611076d0
    x20 b400006fc2410548  x21 b400006fc240a0f8  x22 0000006f611076b8  x23 ffffffffffffffff
    x24 0000006f63ff8f10  x25 0000006f611077cc  x26 b400008ea84be080  x27 b400008ea84be080
    x28 0000006f611076d4  x29 ffffffffffffffff
    lr  0000006f63ba0358  sp  0000006f611075d0  pc  0000006f63ba03c4  pst 00000000a0000000
backtrace:
      #00 pc 00000000019863c4  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #01 pc 0000000001988cfc  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #02 pc 0000000001986964  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #03 pc 00000000019852cc  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #04 pc 0000000001986d18  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #05 pc 0000000001982ed4  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #06 pc 0000000001932bd8  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #07 pc 00000000019abab4  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #08 pc 00000000019a3170  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #09 pc 00000000019a3128  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #10 pc 0000000001aa9f78  /data/app/~~zNCFHroOUCsx4Q6aDlIA_w==/com.flutter_html_crash_sample.flutter_html_crash_sample-IFoCD0ZhT4YWL00W9XXilQ==/lib/arm64/libflutter.so (BuildId: d4ff4e896acecea4c25f81864600185cb1f37fb7)
      #11 pc 0000000000002c0c  [anon:dart-codespace]
Lost connection to device.

Additional info:

Sample code to reproduce the issue

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

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(const MyApp());
}

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

  @override
  State createState() => _AppState();
}

class _AppState extends State {
  int? maxLines;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('Flutter Html crash sample'),),
        floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
        floatingActionButton: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              color: Colors.black87,
              margin: const EdgeInsets.symmetric(horizontal: 16),
              child: const Text('Tap button below a couple of times until app crashes', textAlign: TextAlign.center, style: TextStyle(color: Colors.red),)
            ),
            ElevatedButton(
                onPressed: () => setState(() => maxLines = 2),
                child: const Text('Set maxLines and textOverflow')
            ),
          ],
        ),
        body: Center(
          child: SingleChildScrollView(
            child: Wrap(
              spacing: 8,
              runSpacing: 8,
              children: List.generate(18, (index) => FractionallySizedBox(
                widthFactor: 0.3,
                child: Card(
                  child: Container(
                    color: Colors.black,
                    padding: const EdgeInsets.all(8),
                    child: Html(
                      data: '<p>This is paragraph number one.</p><p>This is paragraph number two.</p><p>This is paragraph number three.</p><p>This is paragraph number four.</p>',
                      style: {
                        'body': Style(
                          color: Colors.white70,
                          maxLines: maxLines,
                          textOverflow: maxLines == null ? null : TextOverflow.ellipsis,
                        )
                      },
                    ),
                  ),
                ),
              )),
            ),
          ),
        ),
      ),
    );
  }
}

A picture of a cute animal (not mandatory but encouraged)

And the most important: programmer cat

apope1 commented 1 year ago

I have also encountered this issue and after some more testing it seems that the issue is related to the textOverflow parameter. If you remove it (or just change it from ellipsis to anything else) it does not crash anymore.

luis901101 commented 1 year ago

I have also encountered this issue and after some more testing it seems that the issue is related to the textOverflow parameter. If you remove it (or just change it from ellipsis to anything else) it does not crash anymore.

Yeah I know, but in my use case I need to use TextOverflow.ellipsis. In fact using textoverflow ellipsis is a very common use case so I thinks it’s important to fix this for the next alpha release

apope1 commented 1 year ago

I agree, it is also needed for us, just wanted to make sure that it is visible that there are more people having this problem 😄

020996 commented 1 year ago

I have the same problem

balaji101010 commented 1 year ago

I have the same problem, any alternative solutions ?

luis901101 commented 1 year ago

@balaji101010 alternative solution for me so far is to use: flutter_html: 3.0.0-alpha.5

balaji101010 commented 1 year ago

It still crashses in 3.0.0-alpha.5 @luis901101

luis901101 commented 1 year ago

@balaji101010 check you are using fixed version, note it is flutter_html: 3.0.0-alpha.5 without ^. And also check your pubspec.lock make sure it is using the fixed version. You can delete .lock and run flutter pub get

balaji101010 commented 1 year ago

Pubspeck.lock

  flutter_html:
    dependency: "direct main"
    description:
      name: flutter_html
      url: "https://pub.dartlang.org"
    source: hosted
    version: "3.0.0-alpha.5"

Pubscpec.yaml

flutter_html: 3.0.0-alpha.5 Still it crashes, its ok thanks for your time! I prefer using stable version instead of alpha version. I will wait

NamanVaishnav commented 1 year ago

facing same issue. any solution/help.

Sub6Resources commented 1 year ago

I wasn't able to reproduce the crash, but I got an ASSERT: 784.000000 != 0.000000 in my console and maxLines wasn't handled correctly. Seems like there's a bad engine issue. Hope to look into it further soon.