No Code Attached Yet bug
avatar Bullenwaechter
Bullenwaechter
29 Nov 2023

Steps to reproduce the issue

Since the update from Joomla 4.xx to 5.0.00, when editing an image in the frontend and/or backend via insert/edit image in TinyMCE, the existing image is not updated but a new image is created with the new settings next to the existing image. So the existing image is not edited, and the edited image comes as duplicate. The old image must then be manually deleted from the source code.

Expected result

The exsisting image should be updated.

Actual result

The image with edited parameters appears left to the old image, and the old image can only be removed via the code-editor.

System information (as much as possible)

Joomla! 5.0.1 Stable [ Kuboresha ] 28-November-2023 16:00 GMT
Database msql 10.11.4-MariaDB-1:10.11.4+maria~deb11-log
PHP-Version 8.2.12
Webserver Apache

Additional comments

avatar Bullenwaechter Bullenwaechter - open - 29 Nov 2023
avatar joomla-cms-bot joomla-cms-bot - change - 29 Nov 2023
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 29 Nov 2023
avatar chmst chmst - change - 29 Nov 2023
Title
Insert/edit image from TinyMCE copies the image with new settings
[5.0] Insert/edit image from TinyMCE copies the image with new settings
avatar chmst chmst - edited - 29 Nov 2023
avatar chmst chmst - change - 29 Nov 2023
Labels Added: bug
avatar chmst chmst - labeled - 29 Nov 2023
avatar brianteeman
brianteeman - comment - 29 Nov 2023

unable to replicate. are you sure you selected the image when you tried to edit

image1

avatar chmst
chmst - comment - 29 Nov 2023

Can replicate. First store your article. Then re-open, mark the image, activate the edit image button and change size or anything else.

avatar brianteeman
brianteeman - comment - 29 Nov 2023

I still can not replicate

image2

avatar Bullenwaechter
Bullenwaechter - comment - 29 Nov 2023

Thanks for your replies.

Please see attached screenshots - sorry they are in German language settings:

Select the image you want to edit, select insert/edit Image:
01

Edit parameters or settings and safe:
02

The result is the edited image left to the old image:
03

While the existing image should be edited, i got two....

avatar chmst
chmst - comment - 29 Nov 2023

Same here. I updated yesterday to 5.0.1. @Bullenwaechter is your Joomla Version 5.0.0 or 5.0.1?

avatar Bullenwaechter
Bullenwaechter - comment - 29 Nov 2023

My actual Joomla verstions 5.0.1,

avatar brianteeman
brianteeman - comment - 29 Nov 2023

weird - tested it on two different sites and still dont get the issue

image3

avatar chmst
chmst - comment - 29 Nov 2023

Really strange. On a fresh Installation I too cannot replicate the issue.
But on a site which is migrated and updated many times AND not for newly added images but only for older ones.

avatar brianteeman
brianteeman - comment - 29 Nov 2023

one of the sites I tested on has been upgraded all the way from 3.0

avatar Bullenwaechter
Bullenwaechter - comment - 29 Nov 2023

@chmst
Thanks for your hint, I just tried with my test installation and got the same behaviour. Old images inserted under Joomla 4.xx will be copied, while images inserted under Joomla 5.0.1 will be edited direcly.

avatar brianteeman
brianteeman - comment - 29 Nov 2023

That got me thinking that perhaps it was s9omething to do with old images just using native html syntax and when you edit/save it gets the new syntax with the extra attributes so I went back to an article from 2008 and tried to edit the image. But sadly for you it edited as expected.

avatar Bullenwaechter
Bullenwaechter - comment - 29 Nov 2023

<p><img class="float-none" style="float: right; margin: 10px;" title="Ladeschreiben" src="images/Galerie/2023_Feldlager/Ladeschreiben" alt="Ladeschreiben" width="250"><img style="float: right; margin: 10px;" title="Ladeschreiben" src="images/Galerie/2023_Feldlager/Ladeschreiben" alt="Ladeschreiben" width="300" border="0"></p>
This is the code after editing the image from 300 px width to 250 px width, storing the article and displaying the code.

avatar chmst
chmst - comment - 29 Nov 2023

Different sites on different hosters. Not all images are affected but most of them.

Here an example from my local development environment with a migrated database.

The result after editing the image is:
images

<figure class="image"><img src="images/gastro-gm/h2ostr1fa1.jpg" width="267" height="267" class="float-none" style="float: left; margin: 12px;">
<figcaption>Caption</figcaption>
</figure>
<p><img src="images/gastro-gm/h2ostr1fa1.jpg" style="margin: 12px; float: left;" caption="false" width="267" height="267">
avatar brianteeman
brianteeman - comment - 29 Nov 2023

what was the code BEFORE editing

avatar Bullenwaechter
Bullenwaechter - comment - 29 Nov 2023

Hello brianteeman

in my case:

<p><img style="float: right; margin: 10px;" title="Ladeschreiben" src="images/Galerie/2023_Feldlager/Ladeschreiben" alt="Ladeschreiben" width="300" border="0"></p>

avatar chmst
chmst - comment - 29 Nov 2023

<p><img src="images/gastro-gm/h2ostr1fa1.jpg" style="margin: 12px; float: left;" caption="false" width="267" height="267">

But I could not recognize a pattern

Maybe it is something with the style="float.
The old images seem to have all this style attribute

avatar brianteeman
brianteeman - comment - 29 Nov 2023

anything in the js console?

avatar brianteeman
brianteeman - comment - 29 Nov 2023

@chmst caption=false is very odd. Thats not an attribute I have heard of

avatar chmst
chmst - comment - 29 Nov 2023

Who knows where the editors copy/pasted this code over the years. Console says "image not found".

Here another example from another site: console says "image not found"

grafik

The code of the copy (show caption was selected)

<figure class="image"><img src="images/justizplast_ausstellungklein.jpg" title="Justizpalast: entrance to the exhibition" width="300" height="400" class="float-none" style="margin-bottom: 10px; float: right; margin-left: 10px;" alt="Justizpalast: entrance to the exhibition">
<figcaption>Caption</figcaption>
</figure>

The code of the original

<p><img style="margin-bottom: 10px; float: right; margin-left: 10px;" title="Justizpalast: entrance to the exhibition" src="images/justizplast_ausstellungklein.jpg" alt="Justizpalast: entrance to the exhibition" width="300" height="400"></p>

avatar brianteeman
brianteeman - comment - 30 Nov 2023

the message that the image is not found explains why you get the second image inserted. just need to find out why it doesnt find the image

avatar chmst
chmst - comment - 30 Nov 2023

Could be a parsing error due to the style float? Obviousely the image exists and I see that all images which cause the error have style="float ..

Add a Comment

Login with GitHub to post a comment