akiran / akiran/react-highlight

innerHTML breaks syntax highlighting

Aperta
#85 3 commenti 0 reazioni 0 assegnatari Vedi su GitHub
Lingua principale
JavaScript
Stelle
761
Fork
82
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Descrizione

I'm on nodejs 18.3, so I'm wondering if it's a compatibility thing, but here's a [codesandbox](https://codesandbox.io/s/react-highlight-forked-1ms6sr?file=/src/index.jsl) that demonstrates it.

I was able to make it to work by hacking [here](https://github.com/akiran/react-highlight/blob/master/src/index.js#L34) to do this:
```
if (innerHTML) {
var wrapped="

" +  children + "
";
props.dangerouslySetInnerHTML = { __html: wrapped };
...
```

This is because [this function](https://github.com/akiran/react-highlight/blob/master/src/index.js#L17) doesn't find the element thanks to lack of `

` wrapper:

```
highlightCode() {
const nodes = this.el.querySelectorAll('pre code');

for (let i = 0; i < nodes.length; i++) {
hljs.highlightBlock(nodes[i])
}
}
```

I'd do a PR myself but i'm a novice at this js and react stuff and i'm pretty sure my hack isn't the right way to fix it. If you want to explain what I need to do I can submit the PR.

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Valutazione

Questa issue non è ancora stata valutata.

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.