search

daohoangson / flutter_widget_from_html

Flutter package to render html as widgets that supports hyperlink, image, audio, video, iframe and many other tags.
https://pub.dev/packages/flutter_widget_from_html
MIT License
626 stars 230 forks source link

Tables are broken #1066

Closed NamanShergill closed 11 months ago

NamanShergill commented 11 months ago

Steps to Reproduce

The tables in the repo https://github.com/firebase/flutterfire readme can be used to debug.

HTML ```html

Flutter + Firebase logo

FlutterFire

Follow on Twitter Maintained with Melos OSSF scorecard

[Changelog] β€’ [Packages]

FlutterFire is a set of Flutter plugins
that enable Flutter apps to use Firebase services. You can follow an example that shows
how to use these plugins in
the Firebase for Flutter codelab.

Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile,
web, and desktop from a single codebase. Flutter is used by developers and organizations around the world, and is free
and open source.

Documentation

Stable Plugins

Name pub.dev Firebase Product Documentation View Source Android iOS Web MacOS
Analytics Analytics pub.dev badge πŸ”— πŸ“– firebase_analytics βœ” βœ” βœ” Ξ²
Authentication Authentication pub.dev badge πŸ”— πŸ“– firebase_auth βœ” βœ” βœ” Ξ²
Cloud Firestore Cloud Firestore pub.dev badge πŸ”— πŸ“– cloud_firestore βœ” βœ” βœ” Ξ²
Cloud Functions Cloud Functions pub.dev badge πŸ”— πŸ“– cloud_functions βœ” βœ” βœ” Ξ²
Cloud Messaging Cloud Messaging pub.dev badge πŸ”— πŸ“– firebase_messaging βœ” βœ” βœ” Ξ²
Cloud Storage Cloud Storage pub.dev badge πŸ”— πŸ“– firebase_storage βœ” βœ” βœ” Ξ²
Core Core pub.dev badge πŸ”— πŸ“– firebase_core βœ” βœ” βœ” Ξ²
Crashlytics Crashlytics pub.dev badge πŸ”— πŸ“– firebase_crashlytics βœ” βœ” N/A Ξ²
Dynamic Links Dynamic Links pub.dev badge πŸ”— πŸ“– firebase_dynamic_links βœ” βœ” N/A N/A
In-App Messaging In-App Messaging pub.dev badge πŸ”— πŸ“– firebase_in_app_messaging βœ” βœ” N/A N/A
Installations Installations pub.dev badge πŸ”— πŸ“– firebase_app_installations βœ” βœ” βœ” Ξ²
Performance Monitoring Performance Monitoring pub.dev badge πŸ”— πŸ“– firebase_performance βœ” βœ” βœ” N/A
Realtime Database Realtime Database pub.dev badge πŸ”— πŸ“– firebase_database βœ” βœ” βœ” Ξ²
Remote Config Remote Config pub.dev badge πŸ”— πŸ“– firebase_remote_config βœ” βœ” βœ” Ξ²

Beta Plugins

Name pub.dev Firebase Product Documentation View Source Android iOS Web MacOS
App Check App Check pub.dev badge πŸ”— πŸ“– firebase_app_check βœ” βœ” βœ” Ξ²

Preview Plugins

Name pub.dev Firebase Product Documentation View Source Android iOS Web MacOS
ML Model Downloader ML Model Downloader pub.dev badge πŸ”— πŸ“– firebase_ml_model_downloader βœ” βœ” N/A Ξ²

Alpha Plugins

Name pub.dev Firebase Product Documentation View Source Android iOS Web MacOS
Cloud Firestore ODM Cloud Firestore ODM pub.dev badge πŸ”— πŸ“– cloud_firestore_odm βœ” βœ” βœ” Ξ²

Issues

Please file FlutterFire specific issues, bugs, or feature requests in
our issue tracker.

Plugin issues that are not specific to FlutterFire can be filed in
the Flutter issue tracker.

Contributing

If you wish to contribute a change to any of the existing plugins in this repo, please review
our contribution guide
and open a pull request.

```
`HtmlWidget` configuration ```dart HtmlWidget(html); ```
Tesing environment ``` [βœ“] Flutter (Channel stable, 3.13.7, on macOS 13.5.1 22G90 darwin-arm64, locale en-IN) β€’ Flutter version 3.13.7 on channel stable at /opt/homebrew/Caskroom/flutter/3.3.0/flutter β€’ Upstream repository https://github.com/flutter/flutter.git β€’ Framework revision 2f708eb839 (8 days ago), 2023-10-09 09:58:08 -0500 β€’ Engine revision a794cf2681 β€’ Dart version 3.1.3 β€’ DevTools version 2.25.0 [βœ“] Android toolchain - develop for Android devices (Android SDK version 33.0.1) β€’ Android SDK at /Users/naman/Library/Android/sdk β€’ Platform android-34, build-tools 33.0.1 β€’ Java binary at: /Applications/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 15.0) β€’ Xcode at /Applications/Xcode.app/Contents/Developer β€’ Build 15A240d β€’ CocoaPods version 1.13.0 [βœ“] Chrome - develop for the web β€’ Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [βœ“] Android Studio (version 2022.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 17.0.6+0-17.0.6b829.9-10027231) [βœ“] VS Code (version 1.82.3) β€’ VS Code at /Applications/Visual Studio Code.app/Contents β€’ Flutter extension version 3.74.0 [βœ“] Network resources β€’ All expected network resources are available. β€’ No issues found! ```

Expected results

a table

Actual results

no table and all the content got stacked

Breaking at:https://github.com/daohoangson/flutter_widget_from_html/blob/5304c06f4195af9fb81bba1f4850d7b0a348e197/packages/core/lib/src/widgets/html_table.dart#L834

Stack Trace ``` When the exception was thrown, this was the stack: #2 RenderBox.size (package:flutter/src/rendering/box.dart:1965:12) #3 _TableRenderObject.paint (package:flutter_widget_from_html_core/src/widgets/html_table.dart:834:23) #4 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3155:7) #5 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:252:13) #6 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:129:13) #7 _ValignBaselineClearerRenderObject.paint (package:flutter_widget_from_html_core/src/widgets/valign_baseline.dart:98:11) #8 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3155:7) #9 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:252:13) #10 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2875:15) #11 RenderFlex.paint (package:flutter/src/rendering/flex.dart:1040:7) #12 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3155:7) #13 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:252:13) #14 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:129:13) #15 RenderAnimatedOpacityMixin.paint (package:flutter/src/rendering/proxy_box.dart:1060:11) #16 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3155:7) #17 PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:168:11) #18 PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:111:5) #19 PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:1144:31) #20 RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:496:19) #21 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:918:13) #22 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:360:5) #23 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1297:15) #24 SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1227:9) #25 SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:1085:5) #26 _invoke (dart:ui/hooks.dart:170:13) #27 PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:401:5) #28 _drawFrame (dart:ui/hooks.dart:140:31) (elided 2 frames from class _AssertionError) ```

image

NamanShergill commented 11 months ago

This is on the latest version 0.14.2

daohoangson commented 11 months ago

v0.14.3 has been released with the workaround for this. When the table is too crowded (narrow width but too many columns), it will measure the minimum intrinsic width which is not allowed when a cell contains an IMG. The current fix will ignore the error and continue rendering.

NamanShergill commented 11 months ago

Yep, it’s working now. Thanks again for such a quick fix!