Html-react-parser: Como lidar com! Importante nos atributos de estilo?

@linkurzweg Talvez você não precise de html-react-parser . Veja violino . Esteja ciente da vulnerabilidade de XSS se você usar dangerouslySetInnerHTML .

@remarkablemark Ah, eu nem pensei em
Nenhum risco real para XSS no meu caso, então não tem problema.

O problema é que ainda preciso executar tudo por meio do html-react-parser, porque o corpo pode conter elementos que preciso substituir por algum componente React. Somente se o elemento tiver um atributo de estilo, posso renderizá-lo como está.
Existe alguma maneira de converter o domNode de volta em uma string durante a análise?

Muito obrigado!

@linkurzweg Você pode passar seu domNode em domToReact() e ele irá renderizá-lo como um elemento React. Veja exemplos de substituição .

@remarkablemark Obrigado novamente! Eu sei disso, mas não vejo como isso ajudaria no meu caso.
Eu ainda precisaria obter o domNode de volta para uma string que eu pudesse usar com dangerouslySetInnerHTML ou não estou recebendo algo?

@linkurzweg Não sigo seu caso de uso. Você pode fornecer um exemplo usando CodeSandbox , JSFiddle ou Repl.it ?

@remarkablemark veja o violino aqui: https://jsfiddle.net/9bezs1rt/.
Então, é assim: eu recebo uma string enorme com todo o html nela, que precisa ser analisada de alguma forma (pode conter tags de script, iframes, incorporações de mídia social etc.). Eu preciso iterar por todos os nós dom e lidar com muitos casos diferentes.

Se o nó dom tiver alguns estilos embutidos anexados a ele, posso presumir que não preciso substituí-lo por algum componente React e quero apenas transmiti-lo, incluindo estilos que têm! Important. E infelizmente esses se perdem.

@linkurzweg Obrigado por criar o violino. Portanto, a razão pela qual os estilos não são renderizados corretamente é porque os estilos embutidos não precisam de !important .

Depois de remover !important , fiz a borda vermelha aparecer. Veja violino atualizado.

@remarkablemark Claro, sou bobo! Pode haver algumas outras tags de estilo com! Important dentro da string html (é tudo muito confuso) que podem entrar em conflito com os estilos embutidos. Mas posso remover o! Important lá também, então deve ficar tudo bem. : D Muito obrigado por olhar para isso e sua ajuda!