Image in title: `Stray end tag "img"` in TOC

[Salamandar]

Have you read the Contributing Guidelines on issues?

• I have read the Contributing Guidelines on issues.

Prerequisites

• I'm using the latest version of Docusaurus.
• I have tried the npm run clear or yarn clear command.
• I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
• I have tried creating a repro with https://new.docusaurus.io.
• I have read the console error message carefully (if applicable).

Description

Adding future: { experimental_faster: true} triggers some new warnings on a working website:

## <img src="/img/some_image.png" height="32" /> Some title

Triggers:

[WARNING] Docusaurus static site generation process emitted warnings for 1 paths
This is non-critical and can be disabled with DOCUSAURUS_IGNORE_SSG_WARNINGS=true
Troubleshooting guide: https://github.com/facebook/docusaurus/discussions/10580

- "/administer/tutorials/external_storage":
  - [HTML minifier diagnostic - error] Stray end tag "img" - {"primary_spans":[{"end":66301,"start":66295}],"span_labels":[]}

Indeed I can find some javascript files with value="<img></img> Some title", it seems to be related to the table of contents. Indeed the image is not visible in it and that makes sense.

I can find the same <img></img> without docusaurus faster, so it only reveals a pre-existing issue.

Reproducible demo

No response

Steps to reproduce

Put an img in title

Expected behavior

no warning

Actual behavior

warnings about </img>

Your environment

• Public source code: https://github.com/yunohost/doc/tree/docusaurus
• Public site URL: none yet
• Docusaurus version used: 3.7.0
• Environment name and version (e.g. Chrome 89, Node.js 16.4): Node 19
• Operating system and version (e.g. Ubuntu 20.04.2 LTS): Archlinux

Self-service

• I'd be willing to fix this bug myself.

[slorber]

Agree there's something wrong here. However as you noticed, this problem was already here before and we just emit a new warning about it.

Expected behavior
no warning

Nop, we can't silent the warning, it is legit. The underlying problem is that the TOC item HTML markup is wrong, containing empty img tags

"<img></img> Some title"

To fix this issue, we should change the HTML markup, which will remove the warning as a side effect.

However, it's not clear what's the expected behavior. For this heading, should we:

• Display the image in the TOC?
• Display the alt text of the image in the TOC
• Not display the image in the TOC (like now, but without the empty <img> tag)

The last solution probably the simplest and safest (not likely to break users sites) to implement. The HTML markup would be pure text "Some title" instead of " Some title"

---

Here's the beginning of a fix: #11004

[slorber]

Going to use the last solution (no TOC <img> tag), it's the safest and also the most retrocompatible with our existing behavior.

So far nobody complained that heading images do not appear in the TOC. We'll see if anyone ask for this as a feature request.

However we had the case where people add tags to headings and expect them to be rendered in the TOC, for example: <span className="tag">iOS</span> works.