DEV: removes jquery usage from highlight-syntax (#10564)

This commit is contained in:
Joffrey JAFFEUX 2020-09-01 09:50:49 +02:00 committed by GitHub
parent bb2e830010
commit f8062300da
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 36 additions and 18 deletions

View File

@ -6,6 +6,6 @@ export default Component.extend({
@on("didInsertElement") @on("didInsertElement")
@observes("code") @observes("code")
_refresh() { _refresh() {
highlightSyntax($(this.element), this.siteSettings, this.session); highlightSyntax(this.element, this.siteSettings, this.session);
} }
}); });

View File

@ -10,7 +10,7 @@ export default {
withPluginApi("0.1", api => { withPluginApi("0.1", api => {
const siteSettings = container.lookup("site-settings:main"); const siteSettings = container.lookup("site-settings:main");
const session = container.lookup("session:main"); const session = container.lookup("session:main");
api.decorateCooked( api.decorateCookedElement(
elem => { elem => {
return highlightSyntax(elem, siteSettings, session); return highlightSyntax(elem, siteSettings, session);
}, },

View File

@ -1,34 +1,52 @@
import loadScript from "discourse/lib/load-script";
import deprecated from "discourse-common/lib/deprecated";
/*global hljs:true */ /*global hljs:true */
let _moreLanguages = []; let _moreLanguages = [];
import loadScript from "discourse/lib/load-script"; export default function highlightSyntax(elem, siteSettings, session) {
if (!elem) {
return;
}
export default function highlightSyntax($elem, siteSettings, session) {
const selector = siteSettings.autohighlight_all_code const selector = siteSettings.autohighlight_all_code
? "pre code" ? "pre code"
: "pre code[class]", : "pre code[class]";
path = session.highlightJsPath; const path = session.highlightJsPath;
if (elem instanceof jQuery) {
deprecated(
"highlightSyntax now takes a DOM node instead of a jQuery object.",
{
since: "2.6.0",
dropFrom: "2.7.0"
}
);
elem = elem[0];
}
if (!path) { if (!path) {
return; return;
} }
$(selector, $elem).each(function(i, e) { return loadScript(path).then(() => {
// Large code blocks can cause crashes or slowdowns customHighlightJSLanguages();
if (e.innerHTML.length > 30000) {
return;
}
$(e).removeClass("lang-auto"); elem.querySelectorAll(selector).forEach(e => {
loadScript(path).then(() => { // Large code blocks can cause crashes or slowdowns
customHighlightJSLanguages(); if (e.innerHTML.length > 30000) {
return;
}
e.classList.remove("lang-auto");
hljs.highlightBlock(e); hljs.highlightBlock(e);
}); });
}); });
} }
export function registerHighlightJSLanguage(name, fn) { export function registerHighlightJSLanguage(name, fn) {
_moreLanguages.push({ name: name, fn: fn }); _moreLanguages.push({ name, fn });
} }
function customHighlightJSLanguages() { function customHighlightJSLanguages() {

View File

@ -13,7 +13,7 @@ componentTest("highlighting code", {
this.set("code", "def test; end"); this.set("code", "def test; end");
}, },
async test(assert) { test(assert) {
assert.equal( assert.equal(
find("code.ruby.hljs .hljs-function .hljs-keyword") find("code.ruby.hljs .hljs-function .hljs-keyword")
.text() .text()
@ -32,7 +32,7 @@ componentTest("large code blocks are not highlighted", {
this.set("code", LONG_CODE_BLOCK); this.set("code", LONG_CODE_BLOCK);
}, },
async test(assert) { test(assert) {
assert.equal( assert.equal(
find("code") find("code")
.text() .text()