[BUG]: Broken image thumbnail is not displayed in the editor

[Maks-Yaremenko]

I'm submitting a

• Bug report

Description

You can successfully add an image using the add image tool, then you have to delete the image on the server. After you'll load a document that contained a deleted (on the server) image, the broken image won't be reflected in the document - but it will be there.

Version Information

ngx-editor: 5.2.0
angular: 9.1.9

Browser

• Chrome - Version 87.0.4280.88 (Official Build) (x86_64)

[sibiraj-s]

@Maks-Yaremenko Please follow the issue template.

Issue title and issue description are totally different.

[Maks-Yaremenko]

okay, fixed. sorry

[sibiraj-s]

based on my understanding I updated the title. can you confirm if that is the bug?

[sibiraj-s]

Can you paste the document sample with which you are facing the issue

[Maks-Yaremenko]

no no, incorrect. Let me explain - You can successfully add an image using the add image tool, then you have to delete the image on the server. After you'll load a document that contained a deleted (on the server) image, the broken image won't be reflected in the document - but it will be there.

I can confirm that the broken image is still in the document because it is reflecting when I'm rendering HTML data using inner HTML in any blocks.

[sibiraj-s]

Oh. got it. the broken thumbnail is not showing up.

[Maks-Yaremenko]

yes, exactly!

[Maks-Yaremenko]

ps: is there a way to pass custom validator for image link? I am facing issues with some URLs, that contain сyrillic fonts, or some characters... like times.. for example when an image has dimensions like 1200x1500

[sibiraj-s]

Can you open a new discussion for that? lets keep the discussion here for this issue alone

[Maks-Yaremenko]

Do you mean request?

[sibiraj-s]

no here https://github.com/sibiraj-s/ngx-editor/discussions/categories/q-a

[sibiraj-s]

@Maks-Yaremenko I was able to see the broken thumbnail when I tested it.

[sibiraj-s]

@Maks-Yaremenko Let me know if this is an issue or can be closed

[Maks-Yaremenko]

I can confirm that the thumbnail exists in the record of the document, but not reflecting in the editor.

in editor (image exist on the server)

in HTML (image exist on the server)

in the editor (the image was removed from the server, no placeholder in the editor)

seems like after clicking multiple times in the place where the image should locate I can select its block

in the HTML (the image was removed from the server, placeholder shows correct thumbnail)

ps: sad to me that you making all fixes for the latest version... I tested it and unfortunately unable to update the existing implementation to use the newer version, too many errors occur to me. None of the versions starting from 5.3 not working for me.

[sibiraj-s]

ps: sad to me that you making all fixes for the latest version...

Migrating to v6 is very straightforward. Can you refer this one to upgrade https://sibiraj-s.github.io/ngx-editor/#/migration-5-6 let me know if you face any issues. I will assist you along the migration.

[sibiraj-s]

v6 allows to extend features very easy both internally and for developers too. I heavily recommend you to upgrade it.

[Maks-Yaremenko]

yes, I used this guide to migrate to a newer version but received errors with childCount, same as on v 5.3. + I created a wrapper to use editor inside mat-form-field, so I got some style issues during migration. Unfortunately, I'm not allowed to spend any more time with the editor on my project. Probably I'll try to migrate one more time after work hours.

[sibiraj-s]

Sure.

[sibiraj-s]

Thanks for sharing the screenshots I was able to reproduce that. The Images without alt text is the ones that doesn't have thumbnails. The rest works fine. I will debug this.

[Maks-Yaremenko]

Thank you! You are doing a great job!

[sibiraj-s]

Thanks. Consider a star for the project. If you like the work.

[Maks-Yaremenko]

done)

[sibiraj-s]

Turns out it is just a css issue. Fixed in v6.1.0-beta.1.

Since you have v5. I suggest a small patch.

.NgxEditor img {
  height: 100%;
}

[Maks-Yaremenko]

thank you a lot!

[github-actions[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs and link to relevant comments in the thread.