Html Admin API incorrectly parses figure with a href as img

[Petromir Petrov]

Issue Summary

Editing a post, using Ghost API, that has a figure with a link inside replaces the link with an image.

Steps to Reproduce

1. Have a post with the following element in the content:

<figure class=\"kg-card kg-bookmark-card\"><a class=\"kg-bookmark-container\" href=\"__GHOST_URL__/article-url/\"><div class=\"kg-bookmark-content\"><div class=\"kg-bookmark-title\">Some title</div><div class=\"kg-bookmark-description\">Some text</div><div class=\"kg-bookmark-metadata\"><img class=\"kg-bookmark-icon\" src=\"__GHOST_URL__/content/images/size/w256h256/2022/08/[e-mail]\" alt=\"\"><span class=\"kg-bookmark-author\">Ghost Blog</span><span class=\"kg-bookmark-publisher\">Author</span></div></div><div class=\"kg-bookmark-thumbnail\"><img src=\"__GHOST_URL__/content/images/2023/10/cover.jpg\" alt=\"\"></div></a></figure>

2. Run this script:

const postsRaw = await api.posts.browse({ formats: 'html', limit: 'all' })
for await (const post of postsRaw) {
    try {
		await api.posts.edit({ id: post.id, updated_at: post?.updated_at, html: post.html }, { source: 'html' })
	} catch (e) {
		console.log(`Error while updating post ${(post.id}!`, e)
	}
}

3. The figure from above is replaced with:

<figure class=\"kg-card kg-image-card\"><img src=\"__GHOST_URL__/content/images/size/w256h256/2022/08/[e-mail]\" class=\"kg-image\" alt=\"\" loading=\"lazy\"></figure>

Ghost Version

5.75.2 local, reproduced in 5.54.0 production too

Node.js Version

16.13.0

How did you install Ghost?

Followed this guide: https://ghost.org/docs/install/local/. OS: Fedora 39

Database type

SQLite3

Browser & OS version

No response

Relevant log / error output

No response

Code of Conduct

• I agree to be friendly and polite to people in this repository

[Daniel Lockyer]

Hey there, thank you so much for the bug report.

That does look like something that shouldn't happen! A PR to fix this issue would be very welcome 🙂