Issue on replacing image inserted from URL using 'image block'

[alanjacobmathew]

Description

Issue
When an image is inserted to the post using 'upload from URL', clicking the replace image does not always work as expected. In cases where the inserted image link doesn't have an compatible extension at the end (eg: .png, .jpeg etc), the edit icon is inaccesible and overlaps the link. Trying to click on edit icon opens the link.

Eg: https://images.unsplash.com/photo-1703192163759-316babf88c76

This is an issue only with some sites like Unsplash.

Step-by-step reproduction instructions

1. Go to post editor and create a post.
2. Add image block and insert image through URL. (Use : https://images.unsplash.com/photo-1703192163759-316babf88c76)
3. Now click the replace button on the image block.
4. Click on the pencil icon to edit the link

Now simply remove the image, and redo steps 2, 3 & 4, while making sure the image has an extension at the end.
Now the image won't work, but the replace button issue is solved.

Screenshots, screen recording, code snippet

No response

Environment info

WP 6.4.2 GB: 17.3.0. Browser: FF and Chromium. Windows 10

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[t-hamano]

Thanks for the report.

I believe this issue is related to #54920. Media that is rendered on the server side probably doesn't have an extension, so truncating the URL won't work as well.