remarkablemark/html-react-parser

Parsing wordpress category content

Closed this issue · 5 comments

ElSeniorMikael commented

Expected Behavior

Parsing the \r\n

Actual Behavior

it remove \r and keep \n

Steps to Reproduce

const text = "toto \r\n toto"

parse(text)

output "toto toto"

description

Wordpress now output some \r\n inside their description field of their category and im using wordpress as an headless cms and i fetch the data on my nextjs project but when i parse the data, im losing the flow of my content and whenever i try to use the "replace" option with the parse, it already have cleaned the "\r" from the text and i only can see those "\n" is there anyway i could include those during the parsin or i would have to replace \n by something like => <br/>

ElSeniorMikael commented

I'm expecting for it to make it a breaking line

remarkablemark commented

I can confirm that I can reproduce the issue in https://codesandbox.io/p/sandbox/html-react-parser-864-0v3xvs

This bug is coming from html-dom-parser

remarkablemark commented

@ElSeniorMikael can you do this as a workaround?

const text = "toto \r\n toto"

parse(text.replace(/\r/g, "\n"))

Or:

const text = "toto \r\n toto"

parse(text.replace(/\r|\n/g, "<br>"))

See CodeSandbox

It seems that innerHTML strips out carriage returns on the client parser