RichText renders empty elements resulting in broken design about rich-text HOT 9 CLOSED

I see. We should definitely implement this filter in the project.

I like the idea of defining a list of elements you can remove from rendering if empty, but I think it would be better if we remove all heading elements if they have empty text. Empty headings will affect SEO, and we don't want this to happen.

About the other elements, I don't see any problem in rendering if empty. Images, Videos, iframes will never be empty. And elements like blockquote and lists don't need to be removed IMO.

from rich-text.

Hey, I've published 0.1.3 on NPM that fixes the issue!

Thanks for your help @KaterBasilisk6 ❤️

from rich-text.

Great! Thank you for fixing this so quickly! :)

from rich-text.

Hey @KaterBasilisk6, glad you have been using the project!

Do you have an image example of how it looks with this bug?

I'd love to review your PR. Let me know if you need anything to set up your environment.

from rich-text.

Hey @jpedroschmitz, thank you for your quick reply.

I do not think it should be marked as a bug, because it's caused by users providing an empty row after, for example the heading which is not converted into a paragraph. It would be an enhancement for users and developers to easily remove those elements on creation if they want to. (Maybe we could provide a default list for empty elements to remove and check if the given element belongs to this list, so the developer can keep empty tags like paragraphs, or table cells but remove a second empty heading which would also cause problems in SEO).

/// Structure of Rich Text content
{
  h2: Lorem ipsum dolor sit amet
  h2:
  p: Lorem ipsum dolor...
}

How it currently looks like:

<h2>Lorem ipsum dolor sit amet</h2>
<h2></h2>
<p>Lorem ipsum dolor...</p>

How it's intended to look like:

<h2>Lorem ipsum dolor sit amet</h2>
<p>Lorem ipsum dolor...</p>

from rich-text.

You welcome @jpedroschmitz

from rich-text.

Hi!

I'm having a similar issue with rendering empty theads. I get a validateDOMNesting error that says "Whitespace text nodes cannot appear as a child of <thead>." In the editor I have a table that has 1 row and 2 columns, and no header.

Would it be possible to include tables in the rule regulating the rendering of empty elements?

Thanks for this package btw!

from rich-text.

Hey @Endorel, sorry for the late reply. I missed this notification :(

Yeah, we can! I'll be working on this project for the next few days! I'll let you know when I add this rule =D

from rich-text.

Hey @Endorel, I just published 0.1.5 that fixes this issue! Thanks a lot for reporting it ❤️

from rich-text.