Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Irregular row lengths in tables throw error #242

Closed
drewbitt opened this issue Mar 10, 2020 · 17 comments · Fixed by #456
Closed

Irregular row lengths in tables throw error #242

drewbitt opened this issue Mar 10, 2020 · 17 comments · Fixed by #456

Comments

@drewbitt
Copy link

Table contains irregular row lengths.
Every TableRow in a Table must have the same number of children, so that every cell is filled. Otherwise, the table will contain holes.

Latest new-parser branch.
Using rich text fixes the issue.

Example:

<table>
<tbody>
<tr>
<td colspan="6">
<div style="text-align: center">&nbsp;Items</div>
</td>
</tr>
<tr>
<td colspan="1">Item Name</td>
<td colspan="1">Quantity</td>
<td colspan="1">Item&nbsp;Name</td>
<td colspan="1">Quantity&nbsp;</td>
<td colspan="1">Item&nbsp;Name</td>
<td colspan="1">Quantity&nbsp;</td>
</tr>
<tr>
<td colspan="1">Empty backpack</td>
<td colspan="1">1</td>
<td colspan="1">Spare clothes bundle</td>
<td colspan="1">1</td>
<td colspan="1">Rock bread</td>
<td colspan="1">10</td>
</tr>
<tr>
<td colspan="1">Dried meat</td>
<td colspan="1">10</td>
<td colspan="1">Deer waterskin</td>
<td colspan="1">5</td>
<td colspan="1">Sleeping bag</td>
<td colspan="1">1</td>
</tr>
<tr>
<td colspan="1">Flint</td>
<td colspan="1">1</td>
<td colspan="1">Kitchen knife</td>
<td colspan="1">1</td>
<td colspan="1">Skinning knife</td>
<td colspan="1">1</td>
</tr>
<tr>
<td colspan="1">Cooking&nbsp;pot</td>
<td colspan="1">1</td>
<td colspan="1">Whetstone Q100</td>
<td colspan="1">2</td>
<td colspan="1">Wool cloak</td>
<td colspan="1">1</td>
</tr>
<tr>
<td colspan="1">Firewood</td>
<td colspan="1">10</td>
<td colspan="1">Rose coin</td>
<td colspan="1">1</td>
<td colspan="1">Gold coin</td>
<td colspan="1">10</td>
</tr>
<tr>
<td colspan="1">Silver coin</td>
<td colspan="1">50</td>
<td colspan="1">Copper coin</td>
<td colspan="1">100</td>
</tr>
</tbody>
</table>

That's a valid HTML table.

@Sub6Resources
Copy link
Owner

Thank you. I'm aware of the issue and am working on a fix.

@vikalpnagar
Copy link

@Sub6Resources I am also facing this issue. Is there a update on its fix or a workaround?

@drewbitt I have also tried new-parser branch but still getting the same error.

@drewbitt
Copy link
Author

This should've been done before 1.0 and the removal of useRichText. It is breaking.

@kartercs
Copy link

kartercs commented Jul 8, 2020

Same issue here, i'm trying to display an html email with this package and i can't render a lot of them. The workaround for now is that i added "blacklistedElements: ['table']" so that i can render the rest without error but i hope it get fixed.
Thanks for the package tho :).

@brightonc12
Copy link

facing the same problem here.. and i don't want to remove the table element for a work around

@erickok
Copy link
Collaborator

erickok commented Aug 18, 2020

I gave a short go at this, but the problem is that the lib currently uses Flutter's Table (to great effect) and that widget doesn;t support irregular row or column lengths... So we'd have to swap out the implementation for something that can.

@TungWang
Copy link

I am using new-parser branch, but i am still facing this problem.
This is a great package, and i hope this bug will be fixed soon.
Thanks!

@MrJohn2014
Copy link

Same issue here that Table contains irregular row lengths. I also tried new-parser branch, but not working on my end. I really need this package to parse html data, please help me @Sub6Resources

@Danm72
Copy link

Danm72 commented Sep 15, 2020

Any update?

@kartercs
Copy link

Sadly looking at the #323 we can see that it shouldn't come that soon if nobody tries :/

@tneotia
Copy link
Collaborator

tneotia commented Oct 25, 2020

For all those looking for a fix on this issue, I think I have a temporary fix until we can get something that is proven to be reliable.

OP's table

image

The table in my own app that gave this exception

image

('Trimester1' is part of the table, and that row only had that one element where all the other rows have 3 cells).

See the PR for more details on what I did for this temporary fix!

@ngominhtrungit
Copy link

hello, i have same error, how to fix it? pls help

@erickok
Copy link
Collaborator

erickok commented Nov 19, 2020

Cross-posting from PR #435:

I have tried using flutter_layout_grid as well, but that library doesn't seem to support intrinsic heights at all (despite claiming otherwise). Even their examples would not render on mobile Flutter for me, always throwing 'RenderConstrainedBox object was given an infinite size during layout' errors. 🤷

Using Flutter's Rows and Columns could work but that'd require quite some wrapping of rows/columns inside those rows/columns... very fair from ideal. flutter_html < 1.0 did do this, but only supported colspan, not rowspan.

I considered flutter_staggered_grid_view but that really works just when it is it's own scroll container.

spannable_grid looked promising too, but it actually fixes every cell in the grid to be rectangular.

The Flutter isssue asking for colspan/rowspan support is totally dormant. It also doesn't mention any 3th party alternatives.

😡

I guess we have to build something custom...

@erickok
Copy link
Collaborator

erickok commented Nov 20, 2020

Actually... I got something working using flutter_layout_grid; see master...vrtdev:feature/irregular-tables

It probably does not support all styling options yet, and the behaviour doesn't exactly match the original implementation, but it certianly is getting close. Would love feedback.

Screenshot 2020-11-20 at 01 36 56

@tneotia
Copy link
Collaborator

tneotia commented Nov 20, 2020

Looks great! I think the best way to showcase this would be to add a border around the cells, but then again that's a styling thing.

What exactly doesn't match the original? Looks fine from the picture.

@erickok
Copy link
Collaborator

erickok commented Nov 20, 2020

The vertical alignment of the cells is different. We might get away with not supporting vertical alignment in cells, but as you can see in the screenshot the bottom line (which is set on the <tr> tag) is not aligning for the rowspan and colspan cells, as the intrinsic height of them are different. I am looking for a solution.

At the same time, I am realistic enough to not expect a 100% support of all the things html tables can do. But in the end that is up to this project's owners.

@erickok
Copy link
Collaborator

erickok commented Nov 20, 2020

Screenshot 2020-11-20 at 12 24 58

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.