Bug #95818
open
rte_ckeditor link around image generates faulty frontend html
0%
Description
Version 10.4.21
How to reproduce:
- include fluid styled content
- enable images for editor (if you use Default.yaml, use removePlugins: null
- create text element
- enter image
- link to an external url
- save and check frontend
Example html in editor:
<p><a href="https://www.google.de/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png"><img alt="" data-htmlarea-file-uid="5" src="https://yourdomain.com/fileadmin/_processed_/2/8/csm_e6a44eba77_2b4acbbd70.png" style="height:101px; width:300px" /></a></p>
Frontend then looks like this:<p><a href="https://www.google.de/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" target="_blank" rel="noreferrer"></a></p><p><img src="/fileadmin/_processed_/2/8/csm_e6a44eba77_b94f17b207.png" width="299" height="101"></p>
Updated by Marco H over 2 years ago
- Subject changed from rte_ckeditor external link around image causes two paragraphs in frontend, one with link, one with image to rte_ckeditor link around image generates faulty frontend html
- Description updated (diff)
Edit:
Similar problem with link to page or file, so it seems to be a general issue with images.
Also , if the link is set via the editor button, the image-html is replaced by the href-value, so
<p><img alt="" data-htmlarea-file-uid="5" src="https://yourdomain.com/fileadmin/_processed_/2/8/csm_e6a44eba77_2b4acbbd70.png" style="height:101px; width:300px" /></p>
+ adding a link turns into
<p><a href="t3://page?uid=1">t3://page?uid=1</a></p>
Updated by Riccardo De Contardi over 2 years ago
What would be the result if you use https://extensions.typo3.org/extension/rte_ckeditor_image ?
Updated by Marco H over 2 years ago
Riccardo De Contardi wrote in #note-2:
What would be the result if you use https://extensions.typo3.org/extension/rte_ckeditor_image ?
Same issue in frontend.
I was actually noticing the problem on a website that uses rte_ckeditor_image, was about to report it there but did a last check without the extension - same behaviour. What rte_ckeditor_image does fix though is the editor generation of the image after adding a link.
Updated by Lars Tode almost 2 years ago
The issue with the link is located in file RteLinkBrowser. Currently the method getSelectedText() used to get the content for the link.
If the content is an image the method return nothing since it is an element and not a text.
A simple solution could be checking if the selection is an element and the text is empty.
Example:
if (selection && selection.getSelectedElement() !== null) {
linkElement.append(selection.getSelectedElement());
} else if (selection && selection.getSelectedText()) {
linkElement.setText(selection.getSelectedText());
} else {
linkElement.setText(linkElement.getAttribute('href'));
}
Updated by Gerrit Code Review almost 2 years ago
- Status changed from New to Under Review
Patch set 1 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/74640
Updated by Gerrit Code Review almost 2 years ago
Patch set 2 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/74640
Updated by Gerrit Code Review almost 2 years ago
Patch set 3 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/74640
Updated by Gerrit Code Review almost 2 years ago
Patch set 4 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/74640
Updated by Gerrit Code Review 12 months ago
Patch set 5 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/74640