Pull Request resolves # .

• I read the Generative AI policy and my contribution is either not created with the help of AI or is compatible with the policy and GNU/GPL 2 or later.

Summary of Changes

Implements the tinmyce invalid_styles functionality as an option in the plugin

With tinymce we have the ablity to set invalid elements and even to restrict that attributes that can be applied to an element. However we cannot restrict the styles that are applied to an element. tinyMCE has a setting for that invalid_styles but we dont expose it to the configuration. this PR does that.

A specific use case for this it to prevent tinymce adding a height style to a table cell or row. It does this automatically and can cause problems.

You create a table.
Everything looks fine in the editor.
But when you view the article on the front end… there’s strange white space inside some cells. This only happens in specific circumstances but if it effects you then you need to read this or spend hours pulling your hair out.

When you create a table in TinyMCE inside Joomla! and the text inside a cell wraps onto multiple lines, TinyMCE often adds an explicit height to the , or element.
<td style="height: 35.5px;">Some wrapped text</td>

Why This Causes Issues
The editor window is usually narrower than the actual website layout.

• Text wraps onto more lines
• TinyMCE calculates a height
• It saves that height inline

But on the front end:

• The page is wider
• The text wraps onto fewer lines
• The explicit height remains
• The result? Unwanted white space inside the cell.

The same thing can also happen if:

• The front-end font size differs from the editor font size
• The front-end font family renders differently
• Responsive layouts change table width
• Because the height is fixed inline, the browser cannot naturally adjust the cell height.

This PR exposes the invalid_styles setting from tinyMCE

**_DRAFT
This PR is a draft as I dont understand how to set the correct syntax when its an object and not a string. As per the docs both should work. Currently only a string works and that is global and not element specific

if you enter width height in the field then those styles are always removed in tinymce
BUT you should also be able to restrict this to the TR element

Either I am inputting the field in the incorrect syntax or a change needs to be made in the tinymce code. I just dont understand it and as its js I find it hard to debug_**

Testing Instructions

Apply PR
Go to the tinymce plugin
make sure you have Joomla text filter OFF
Enter width height in the new Prohibited Styles field
Save the settings and open an article for editing. Try and create a table and then set a height or width on the table. or paste this sample html

<table style="border-collapse: collapse; width: 100%; height: 84px;" border="1">
<colgroup><col style="width: 23.6559%;"><col style="width: 76.3441%;"></colgroup>
<tbody>
<tr style="height: 57px;">
<td> </td>
<td> </td>
</tr>
<tr style="height: 27px;">
<td> </td>
<td> </td>
</tr>
</tbody>
</table>

Actual result BEFORE applying this Pull Request

the table is saved without change

Expected result AFTER applying this Pull Request

<table style="border-collapse: collapse;" border="1"><colgroup><col><col></colgroup>
<tbody>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>

@Fedik @dgrammatiko as the only js people I know could you take a look and advise

Link to documentations

Please select:

• Documentation link for guide.joomla.org:

• No documentation changes for guide.joomla.org needed

• Pull Request link for manual.joomla.org:

• No documentation changes for manual.joomla.org needed