Tables do not use inline style when useClasses is false

[JaxonWright]

Expected behavior.

Tables should use inline styles when useClasses is set to false. This way, when in an email, the table looks as it did in the editor.

Actual behavior.

borders are lost and the table does not even look like a table anymore.

Steps to reproduce the problem.

• add a table to the editor
• observe via inspect element that there are missing inline styles for elements and the
  Get the contents of the editor to display somewhere else that does not have froala CSS applied to it.

  In the editor:

  In Gmail or any other email client:

  Editor version.

  3.1.0

  OS.

  Windows 10, but this doesn't matter

  Browser.

  Chrome 80, but this doesn't matter

[LukeHartcher]

I am having similar struggles - however I determined that inline styles do work, but you cannot override the "border" attribute. For example I am able to get the background colour output as in inline style but when adding the border attribute to the same class that I use, it does not get output inline and the default border styling does. This makes it impossible to remove the border!

[st-abarker]

I second what @LukeHartcher said. There needs to be a way to easily remove the borders. Our users see the borders in the editor as a way to see the table while editing their content. Since other software may be handling the display of the content generated in the editor, we set useClasses to false so that we don't need to bundle in the style sheets or convert it to inline styling. However, this results in the borders always being included with the tables.

[st-abarker]

I think I figured out part of the problem when investigating why I am having issues with useClasses: false and the Alternate table style. It looks like the function that converts the classes to inline styles is cleaning up the selectors to remove certain parts of the selectors. The problem is that the method used to remove body also converts a selector like tbody tr to ttr.

I think the proper fix is to change the appropriate regex from /body |\.fr-view /g to /\bbody |\.fr-view /g so that it looks specifically for the term body where it is not part of a different term.

[ffjanhoeck]

@st-abarker did you got it fixed in your application ? Where can I change this regex ?

[st-abarker]

@ffjanhoeck - We do not currently have a fix in place for this issue. We are working with members of the froala team to get this issue resolved.

[heinydo]

@st-abarker - Have you found a solution? I have the same bug and I am also in contact with Froala support. Unfortunately, the Froala dev team sees the bug as normal behavior.

[st-abarker]

@heinydo -

I don't yet have a solution. I have had to present this issue to them a few times, and every time they have tried telling me that it is working as expected, until I provide a detailed breakdown of exactly what is happening, and suggesting the fix I mention in my comment above from Dec 2020. I'm currently trying to get an ETA on this issue and another that we are waiting on.

[mozgras]

Any update with this?

[st-abarker]

@mozgras - The issues I was seeing with the inline styles not converting properly were resolved in version 4.0.11 from May 2022.