Allow linking images - editing

[jodator]

📝 Provide a description of the new feature

Implement link on images editing:

• add proper schema rules and converters to load / save link on image
  • the <a> element should be inside image's <figure> and set on <img> element
  • current converters and its utils should work with that structure (might assume first child of <figure> in the view
• check LinkCommand behavior - it should be tested that this is possible
• manual tests are welcome (loading data)
• adjust all image features to new view (like image resize)
• check how image/link behaves when plugin is not enabled
• separate plugin in ckeditor5-link.
• should be enabled in Essentials plugin

---

If you'd like to see this feature implemented, add a 👍 reaction to this post.

[pomek]

• the <a> element should be inside image's <figure> and set on <img> element

Should the following HTML work as well?

<a href="http://localhost">
	<img alt="bar" src="sample.jpg">
</a>

[jodator]

Should the following HTML work as well?

For upcast - sure.

We already enforce <figure> on <img> so <a> should follow that.

OTOH, I'm not sure how it will handle <a><figure><img> in the content but the output should be taken from the model anyway so if will upcast href to <image> in the model we will output <figure><a><img>.

[pomek]

<a><figure><img> seems to be invalid structure.

<a>
  <figure>
    <img>
    <figcaption>
      <a>...

What now? :D

[jodator]

What now? :D

This might need to be checked if this is possible in the HTML - how it behaves then. It looks like the outer <a> is for <img> and the inner for $text in caption.

[pomek]

check how image/link behaves when plugin is not enabled

Links are lost. For me, it sounds good.

[pomek]

What now? :D

This might need to be checked if this is possible in the HTML - how it behaves then. It looks like the outer <a> is for <img> and the inner for $text in caption.

Nested <a> elements are invalid. I guess we're safe if we assume that a link wraps an <img> element.