ah crap I forgot the most important part
replace
// Preview
if (!empty($modSettings['ch_enable']) && in_array($context['current_action'], array('post', 'post2')))
$context['html_headers'] .= '
<script type="text/javascript">
var highlightPreviewCodeBlocks = function(){
if (highlightPreviewCodeBlocks.calling)
return;
highlightPreviewCodeBlocks.calling = true;
var blocks = document.querySelectorAll("#preview_body pre code");
Array.prototype.forEach.call(blocks, hljs.highlightBlock);
highlightPreviewCodeBlocks.calling = false;
};
document.querySelector("#preview_body").addEventListener("DOMSubtreeModified", highlightPreviewCodeBlocks, false);
</script>';
with
// Preview
if (!empty($modSettings['ch_enable']) && in_array($context['current_action'], array('post', 'post2')))
$context['html_headers'] .= '
<script type="text/javascript">
var highlightPreviewCodeBlocks = function(){
if (highlightPreviewCodeBlocks.calling)
return;
highlightPreviewCodeBlocks.calling = true;
var blocks = document.querySelectorAll("#preview_body pre code");
Array.prototype.forEach.call(blocks, hljs.highlightBlock);
highlightPreviewCodeBlocks.calling = false;
};
var initPreviewHighlighting = function(){
if (initPreviewHighlighting.called)
return;
initPreviewHighlighting.called = true;
document.querySelector("#preview_body").addEventListener("DOMSubtreeModified", highlightPreviewCodeBlocks, false);
};
var initPreviewHighlightingOnLoad = function(){
document.addEventListener("DOMContentLoaded", initPreviewHighlighting, false);
document.addEventListener("load", initPreviewHighlighting, false);
};
initPreviewHighlightingOnLoad();
</script>';
otherwise the code to highlight code in the preview section when you click the preview button doesn't get attached as the preview section doesn't exist yet.