html-react-parser
html-react-parser copied to clipboard
remarkablemark
Parsing `html` tag without `body` tag failed
Expected Behavior
parse('<html><p>Hello, World!</p></html>') should return a html tag, with a p child tag
Actual Behavior
It returns empty react element. console.log gives the following:
{
...
props: {children: null}
...
}
Steps to Reproduce
Call parse('<html><p>Hello, World!</p></html>')
Reproducible Demo
Environment
- Version: v3.0.8
- Platform: node v18.12.1, TypeScript 4.9.5
- Browser: Chrome v108
- OS: macOS
Keywords
@harryzcy This is expected behavior since if you're trying to render an <html> tag inside of a root element in a <body>, then you'll get the error:
Warning: validateDOMNesting(...): <html> cannot appear as a child of <div>.
See reproduced demo.
This leads me to the question: are you unable to strip out the <html> from your string before parsing?
That's not the point I'm making. The warning that <html> cannot appear as a child of <div> is for when it's actually rendered in browser. But the bug I'm pointing out here is when it's parsed by html-react-parser, before it's even rendered by the browser.
I'm using the replace function in HTMLReactParserOptions to replace out the html tag, but it's not working for this specific case.
For reference, parse('<html><body><p>Hello, World!</p></body></html>') does work but parse('<html><p>Hello, World!</p></html>') doesn't. See this demo
So I still think it's a bug within the library.
Hmm perhaps I am misunderstanding something @harryzcy, but your demo seems to be working correctly? I inspected the console output and it is rendering html > body > p and text