Ensure consistent handling of classes by fenced_code and codehilite (#1033)

* All non-language classes should always be assigned to the pre tag.
* The language identifying class should never be included with the
general list of classes.

Fixes #1032

4 files changed, 30 insertions, 27 deletions

diff --git a/docs/change_log/index.md b/docs/change_log/index.md
index 40f017e..5548644 100644
--- a/docs/change_log/index.md
+++ b/docs/change_log/index.md
@@ -3,6 +3,10 @@ title: Change Log
 Python-Markdown Change Log
 =========================
 
+Under development: version 3.3.1 (a bug-fix release).
+
+* Ensure consistent class handling by `fenced_code` and `codehilite` (#1032).
+
 Oct 6, 2020: version 3.3 ([Notes](release-3.3.md)).
 
 May 8, 2020: version 3.2.2 (a bug-fix release).
diff --git a/docs/extensions/fenced_code_blocks.md b/docs/extensions/fenced_code_blocks.md
index c495475..fc5c9ca 100644
--- a/docs/extensions/fenced_code_blocks.md
+++ b/docs/extensions/fenced_code_blocks.md
@@ -130,13 +130,13 @@ In addition to the language, additional classes may be defined by prefixing them
 ````
 
 When defining multiple classes, only the first class will be used as the "language" for the code block. All others are
-assigned to the `<code>` tag unaltered. Additionally, the curly braces and dot are required for all classes, including
+assigned to the `<pre>` tag unaltered. Additionally, the curly braces and dot are required for all classes, including
 the language class if more than one class is defined.
 
 The above example will output the following HTML:
 
 ```html
-<pre><code class="language-html foo bar">&lt;p&gt;HTML Document&lt;/p&gt;
+<pre class="foo bar"><code class="language-html">&lt;p&gt;HTML Document&lt;/p&gt;
 </code></pre>
 ```
 
diff --git a/markdown/extensions/fenced_code.py b/markdown/extensions/fenced_code.py
index e3b3f1b..716b467 100644
--- a/markdown/extensions/fenced_code.py
+++ b/markdown/extensions/fenced_code.py
@@ -88,11 +88,10 @@ class FencedBlockPreprocessor(Preprocessor):
                 if m.group('attrs'):
                     id, classes, config = self.handle_attrs(get_attrs(m.group('attrs')))
                     if len(classes):
-                        lang = classes[0]
+                        lang = classes.pop(0)
                 else:
                     if m.group('lang'):
                         lang = m.group('lang')
-                        classes.append(lang)
                     if m.group('hl_lines'):
                         # Support hl_lines outside of attrs for backward-compatibility
                         config['hl_lines'] = parse_hl_lines(m.group('hl_lines'))
@@ -119,12 +118,11 @@ class FencedBlockPreprocessor(Preprocessor):
 
                     code = highliter.hilite()
                 else:
-                    id_attr = class_attr = kv_pairs = ''
+                    id_attr = lang_attr = class_attr = kv_pairs = ''
+                    if lang:
+                        lang_attr = ' class="{}{}"'.format(self.config.get('lang_prefix', 'language-'), lang)
                     if classes:
-                        class_attr = ' class="{}{}"'.format(
-                            self.config.get('lang_prefix', 'language-'),
-                            ' '.join(classes)
-                        )
+                        class_attr = ' class="{}"'.format(' '.join(classes))
                     if id:
                         id_attr = ' id="{}"'.format(id)
                     if self.use_attr_list and config and not config.get('use_pygments', False):
@@ -134,9 +132,10 @@ class FencedBlockPreprocessor(Preprocessor):
                         kv_pairs = ' ' + ' '.join(
                             '{k}="{v}"'.format(k=k, v=v) for k, v in config.items() if k != 'use_pygments'
                         )
-                    code = '<pre{id}><code{cls}{kv}>{code}</code></pre>'.format(
+                    code = '<pre{id}{cls}><code{lang}{kv}>{code}</code></pre>'.format(
                         id=id_attr,
                         cls=class_attr,
+                        lang=lang_attr,
                         kv=kv_pairs,
                         code=self._escape(m.group('code'))
                     )
diff --git a/tests/test_syntax/extensions/test_fenced_code.py b/tests/test_syntax/extensions/test_fenced_code.py
index 8fa75f7..c86a733 100644
--- a/tests/test_syntax/extensions/test_fenced_code.py
+++ b/tests/test_syntax/extensions/test_fenced_code.py
@@ -168,7 +168,7 @@ class TestFencedCode(TestCase):
     def testFencedLanguageAndHighlightLines(self):
         if self.has_pygments:
             expected = (
-                '<div class="python codehilite"><pre><span></span><code>'
+                '<div class="codehilite"><pre><span></span><code>'
                 '<span class="hll"><span class="n">line</span> <span class="mi">1</span>\n'
                 '</span><span class="n">line</span> <span class="mi">2</span>\n'
                 '<span class="hll"><span class="n">line</span> <span class="mi">3</span>\n'
@@ -177,7 +177,7 @@ class TestFencedCode(TestCase):
         else:
             expected = self.dedent(
                     '''
-                    <pre class="python codehilite"><code class="language-python">line 1
+                    <pre class="codehilite"><code class="language-python">line 1
                     line 2
                     line 3
                     </code></pre>
@@ -224,7 +224,7 @@ class TestFencedCode(TestCase):
     def testFencedLanguageDoubleEscape(self):
         if self.has_pygments:
             expected = (
-                '<div class="html codehilite"><pre><span></span><code>'
+                '<div class="codehilite"><pre><span></span><code>'
                 '<span class="p">&lt;</span><span class="nt">span</span>'
                 '<span class="p">&gt;</span>This<span class="ni">&amp;amp;</span>'
                 'That<span class="p">&lt;/</span><span class="nt">span</span>'
@@ -233,7 +233,7 @@ class TestFencedCode(TestCase):
             )
         else:
             expected = (
-                '<pre class="html codehilite"><code class="language-html">'
+                '<pre class="codehilite"><code class="language-html">'
                 '&lt;span&gt;This&amp;amp;That&lt;/span&gt;\n'
                 '</code></pre>'
             )
@@ -256,7 +256,7 @@ class TestFencedCode(TestCase):
         if self.has_pygments:
             expected = self.dedent(
                 '''
-                <div class="text codehilite"><pre><span></span><code>&amp;
+                <div class="codehilite"><pre><span></span><code>&amp;
                 &amp;amp;
                 &amp;amp;amp;
                 </code></pre></div>
@@ -265,7 +265,7 @@ class TestFencedCode(TestCase):
         else:
             expected = self.dedent(
                 '''
-                <pre class="text codehilite"><code class="language-text">&amp;
+                <pre class="codehilite"><code class="language-text">&amp;
                 &amp;amp;
                 &amp;amp;amp;
                 </code></pre>
@@ -341,7 +341,7 @@ class TestFencedCode(TestCase):
             ),
             self.dedent(
                 '''
-                <pre><code class="language-python foo bar"># Some python code
+                <pre class="foo bar"><code class="language-python"># Some python code
                 </code></pre>
                 '''
             ),
@@ -395,7 +395,7 @@ class TestFencedCode(TestCase):
             ),
             self.dedent(
                 '''
-                <pre id="foo"><code class="language-python bar"># Some python code
+                <pre id="foo" class="bar"><code class="language-python"># Some python code
                 </code></pre>
                 '''
             ),
@@ -441,7 +441,7 @@ class TestFencedCode(TestCase):
     def testFencedLanguageAndHighlightLinesInAttr(self):
         if self.has_pygments:
             expected = (
-                '<div class="python codehilite"><pre><span></span><code>'
+                '<div class="codehilite"><pre><span></span><code>'
                 '<span class="hll"><span class="n">line</span> <span class="mi">1</span>\n'
                 '</span><span class="n">line</span> <span class="mi">2</span>\n'
                 '<span class="hll"><span class="n">line</span> <span class="mi">3</span>\n'
@@ -450,7 +450,7 @@ class TestFencedCode(TestCase):
         else:
             expected = self.dedent(
                     '''
-                    <pre class="python codehilite"><code class="language-python">line 1
+                    <pre class="codehilite"><code class="language-python">line 1
                     line 2
                     line 3
                     </code></pre>
@@ -552,13 +552,13 @@ class TestFencedCode(TestCase):
         if self.has_pygments:
             expected = self.dedent(
                 '''
-                <div class="python pygments"><pre><span></span><code><span class="c1"># Some python code</span>
+                <div class="pygments"><pre><span></span><code><span class="c1"># Some python code</span>
                 </code></pre></div>
                 '''
             )
         else:
             expected = (
-                '<pre class="python pygments"><code class="language-python"># Some python code\n'
+                '<pre class="pygments"><code class="language-python"># Some python code\n'
                 '</code></pre>'
             )
         self.assertMarkdownRenders(
@@ -576,16 +576,16 @@ class TestFencedCode(TestCase):
     def testFencedLanguageAttrLinenums(self):
         if self.has_pygments:
             expected = (
-                '<table class="python codehilitetable"><tr>'
+                '<table class="codehilitetable"><tr>'
                 '<td class="linenos"><div class="linenodiv"><pre>1</pre></div></td>'
-                '<td class="code"><div class="python codehilite"><pre><span></span>'
+                '<td class="code"><div class="codehilite"><pre><span></span>'
                 '<code><span class="c1"># Some python code</span>\n'
                 '</code></pre></div>\n'
                 '</td></tr></table>'
             )
         else:
             expected = (
-                '<pre class="python codehilite"><code class="language-python linenums"># Some python code\n'
+                '<pre class="codehilite"><code class="language-python linenums"># Some python code\n'
                 '</code></pre>'
             )
         self.assertMarkdownRenders(
@@ -628,14 +628,14 @@ class TestFencedCode(TestCase):
     def testFencedLanguageAttrNoclasses(self):
         if self.has_pygments:
             expected = (
-                '<div class="python codehilite" style="background: #f8f8f8">'
+                '<div class="codehilite" style="background: #f8f8f8">'
                 '<pre style="line-height: 125%; margin: 0;"><span></span><code>'
                 '<span style="color: #408080; font-style: italic"># Some python code</span>\n'
                 '</code></pre></div>'
             )
         else:
             expected = (
-                '<pre class="python codehilite"><code class="language-python"># Some python code\n'
+                '<pre class="codehilite"><code class="language-python"># Some python code\n'
                 '</code></pre>'
             )
         self.assertMarkdownRenders(