toHtml produces invalid HTML for void elements inside <foreignObject> #49
Description
Initial checklist
- I read the support docs
- I read the contributing guide
- I agree to follow the code of conduct
- I searched issues and discussions and couldn’t find anything (or linked relevant results below)
Affected package
[email protected], hast-util-to-html@8
Steps to reproduce
Run the following script to stringify a <br> element inside <foreignObject>:
import { toHtml } from 'hast-util-to-html'
console.log(
toHtml({
type: 'root',
children: [
{
type: 'element',
tagName: 'svg',
properties: {},
children: [
{
type: 'element',
tagName: 'foreignObject',
properties: {},
children: [
{
type: 'element',
tagName: 'br',
properties: {},
children: []
}
]
}
]
}
]
})
)Actual behavior
This produces the following string. The void <br> element has a closing tag.
<svg><foreignObject><br></br></foreignObject></svg>Interestingly Chrome and Firefox interpret this HTML string differently.
Expected behavior
The <br> element isn’t closed. It may or may not self-close.
Runtime
Node.js 24.11.1
Package manager
npm
Operating system
Pop!_OS 22.04
Build and bundle tools
No response