DEV: removes jquery usage from highlight-syntax (#10564)
This commit is contained in:
parent
bb2e830010
commit
f8062300da
|
@ -6,6 +6,6 @@ export default Component.extend({
|
|||
@on("didInsertElement")
|
||||
@observes("code")
|
||||
_refresh() {
|
||||
highlightSyntax($(this.element), this.siteSettings, this.session);
|
||||
highlightSyntax(this.element, this.siteSettings, this.session);
|
||||
}
|
||||
});
|
||||
|
|
|
@ -10,7 +10,7 @@ export default {
|
|||
withPluginApi("0.1", api => {
|
||||
const siteSettings = container.lookup("site-settings:main");
|
||||
const session = container.lookup("session:main");
|
||||
api.decorateCooked(
|
||||
api.decorateCookedElement(
|
||||
elem => {
|
||||
return highlightSyntax(elem, siteSettings, session);
|
||||
},
|
||||
|
|
|
@ -1,34 +1,52 @@
|
|||
import loadScript from "discourse/lib/load-script";
|
||||
import deprecated from "discourse-common/lib/deprecated";
|
||||
|
||||
/*global hljs:true */
|
||||
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
|
||||
? "pre code"
|
||||
: "pre code[class]",
|
||||
path = session.highlightJsPath;
|
||||
? "pre code"
|
||||
: "pre code[class]";
|
||||
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) {
|
||||
return;
|
||||
}
|
||||
|
||||
$(selector, $elem).each(function(i, e) {
|
||||
// Large code blocks can cause crashes or slowdowns
|
||||
if (e.innerHTML.length > 30000) {
|
||||
return;
|
||||
}
|
||||
return loadScript(path).then(() => {
|
||||
customHighlightJSLanguages();
|
||||
|
||||
$(e).removeClass("lang-auto");
|
||||
loadScript(path).then(() => {
|
||||
customHighlightJSLanguages();
|
||||
elem.querySelectorAll(selector).forEach(e => {
|
||||
// Large code blocks can cause crashes or slowdowns
|
||||
if (e.innerHTML.length > 30000) {
|
||||
return;
|
||||
}
|
||||
|
||||
e.classList.remove("lang-auto");
|
||||
hljs.highlightBlock(e);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
export function registerHighlightJSLanguage(name, fn) {
|
||||
_moreLanguages.push({ name: name, fn: fn });
|
||||
_moreLanguages.push({ name, fn });
|
||||
}
|
||||
|
||||
function customHighlightJSLanguages() {
|
||||
|
|
|
@ -13,7 +13,7 @@ componentTest("highlighting code", {
|
|||
this.set("code", "def test; end");
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
test(assert) {
|
||||
assert.equal(
|
||||
find("code.ruby.hljs .hljs-function .hljs-keyword")
|
||||
.text()
|
||||
|
@ -32,7 +32,7 @@ componentTest("large code blocks are not highlighted", {
|
|||
this.set("code", LONG_CODE_BLOCK);
|
||||
},
|
||||
|
||||
async test(assert) {
|
||||
test(assert) {
|
||||
assert.equal(
|
||||
find("code")
|
||||
.text()
|
||||
|
|
Loading…
Reference in New Issue