unclean work with class names (adding unneeded spaces during DOM manipulations)

Information:

• Prism version: latest (from the master branch)
• Plugins: none
• Environment: Browser

Description

The way how PrismJS works with class attributes for languages (See: https://github.com/PrismJS/prism/blob/master/components/prism-core.js#L260) is unclean since it introduces unnecessary leading white space, e.g. if the original HTML was:

<pre class="highlight">
  <code class="language-css">
     some code
  </code>
</pre>

After PrismJS.highlightAll() it would become (there are two spaces in front of language-XXX instead of one:

<pre class="highlight  language-css">
  <code class="  language-css">
     some code
  </code>
</pre>

It is a minor, mostly cosmetic issue, but it would be nice if PrismJS did the right thing and introduced the leading white space only if there is something in the class line already (and definitely use one space in that case 😃 )

[RunDevelopment]

So it actually does cause problems. I’ll make a fix shortly.

[xjArea]

@RunDevelopment

Oh, thank you very much for your quick reply. In fact, I was already writing, but I made a mistake in a parameter, so it did not take effect. See your code, I corrected the first parameter of the function, and it was able to run. On this basis, I tried to add the class on the <pre>(if it exists), and done.

👏👏👏 😀

Prism.hooks.add('complete', function(env){
	
    function addClass(node){ node.classList.add('prism-highlighted') };
    var parentNode = env.element.parentNode;
	
    if(parentNode && parentNode.nodeName.toLowerCase() === 'pre'){ addClass(parentNode) }
    else{ addClass(env.element) };
	
});