TOC entry for heading with Mathjax is not rendered correctly

[yurisoba]

Is this a hackmd.io issue?

• [X] Yes, the bug happens on https://hackmd.io
• [ ] No. If it's a self-hosted CodiMD instance, please fire up the issue in the repo of CodiMD: https://github.com/hackmdio/codimd

What's the problem

TOC entry is not rendered correctly when Mathjax is used in the heading. This issue is the reported previously (#277) two years ago with no response.

Current behaviour

TOC entry for heading with Mathjax is rendered with leftover HTML, causing it to be gibberish.

Screenshot (optional)

Provide steps to reproduce:

1. Create new note
2. Add heading with Mathjax, e.g. # $\alpha$
3. Check the TOC sidebar / add [TOC]
4. See error

note link: https://hackmd.io/jCBMbG6UQpm-rdRR0pq_4w?both

Expected behaviour

Either:

• Mathjax is rendered correctly in TOC entry, or,
• Text version of the heading is used instead in TOC (e.g. using textContent, which is already been used in the title attribute of the TOC entry)

Environment

I use HackMD on:

Desktop

• OS: Windows 11
• Browser: firefox
• Browser Version: 116.0.2

Additional context

Judging by the code in codimd, the getHeaderContent() function in public/js/extra.js returns the innerHTML of the rendered HTMLHeadingElement with simple trimming, which is probably the cause of the problem.