FIX: Syntax highlighting for shared-ai conversions with CSP enabled (#532)

- Adds a nonce to both script tags
- Removes the `onload=` inline script, and moves the tags to the end of the `<body>` instead. This provides the same UX (page will load and render, then hljs will be applied when ready)
This commit is contained in:
David Taylor 2024-03-15 02:48:24 +00:00 committed by GitHub
parent 3b8f900486
commit 8b0e9984cf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -11,14 +11,6 @@
<meta name="twitter:description" content="<%= @shared_conversation.formatted_excerpt %>">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="<%= ::UrlHelper.local_cdn_url("/plugins/discourse-ai/ai-share/share.css") %>">
<script>
window.hljs_initHighlighting = function() {
document.querySelectorAll('pre code').forEach((el) => {
hljs.highlightElement(el);
});
};
</script>
<script async src="<%= share_asset_url("highlight.min.js") %>" onload="window.hljs_initHighlighting()" ></script>
</head>
<body>
<header class="site-header">
@ -62,5 +54,11 @@
</article>
<% end %>
</section>
<script src="<%= share_asset_url("highlight.min.js") %>" nonce="<%= csp_nonce_placeholder %>" ></script>
<script nonce="<%= csp_nonce_placeholder %>">
document.querySelectorAll('pre code').forEach((el) => {
hljs.highlightElement(el);
});
</script>
</body>
</html>