Merge pull request #20539 from edx/usama/learner-7023-Mathjax-Configurations

MathJax Output Format in LMS

Issue: 
MathJax expressions were not rendering properly in the drop-down menu. 

Reason: 
MathJax SVG configurations do not work properly in case of a drop-down menu.

Solution:
The output format for MathJax expressions changed from SVG to HTML to allow the MathJax rendering in the drop-down menu as well. 

common/static/common/js/discussion/mathjax_include.js

@@ -50,6 +50,6 @@ if (typeof MathJax === 'undefined') {
             explorer: true
         }
     };
-    vendorScript.src = 'https://cdn.jsdelivr.net/npm/mathjax@2.7.5/MathJax.js?config=TeX-MML-AM_SVG';
+    vendorScript.src = 'https://cdn.jsdelivr.net/npm/mathjax@2.7.5/MathJax.js?config=TeX-MML-AM_HTMLorMML';
     document.body.appendChild(vendorScript);
 }

common/templates/mathjax_include.html

@@ -89,5 +89,5 @@
 <!-- This must appear after all mathjax-config blocks, so it is after the imports from the other templates.
      It can't be run through static.url because MathJax uses crazy url introspection to do lazy loading of
      MathJax extension libraries -->
-<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/mathjax@2.7.5/MathJax.js?config=TeX-MML-AM_SVG"></script>
+<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/mathjax@2.7.5/MathJax.js?config=TeX-MML-AM_HTMLorMML"></script>
 %endif

common/test/acceptance/pages/lms/problem.py

@@ -91,7 +91,7 @@ class ProblemPage(PageObject):
         """
         def mathjax_present():
             """ Returns True if MathJax css is present in the problem body """
-            mathjax_container = self.q(css="div.problem p .MathJax_SVG")
+            mathjax_container = self.q(css="div.problem p .MathJax")
             return mathjax_container.visible and mathjax_container.present
 
         self.wait_for(
@@ -106,7 +106,7 @@ class ProblemPage(PageObject):
 
         def mathjax_present():
             """ Returns True if MathJax css is present inside the preview """
-            mathjax_container = self.q(css="div.problem div .MathJax_SVG")
+            mathjax_container = self.q(css="div.problem div .MathJax")
             return mathjax_container.visible and mathjax_container.present
 
         self.wait_for(
@@ -120,7 +120,7 @@ class ProblemPage(PageObject):
         """
         def mathjax_present():
             """ Returns True if MathJax css is present in the problem body """
-            mathjax_container = self.q(css="div.problem div.problem-hint .MathJax_SVG")
+            mathjax_container = self.q(css="div.problem div.problem-hint .MathJax")
             return mathjax_container.visible and mathjax_container.present
 
         self.wait_for(

common/test/acceptance/pages/lms/tab_nav.py

@@ -49,7 +49,7 @@ class TabNavPage(PageObject):
         """
         Check that MathJax has rendered in tab content
         """
-        mathjax_container = self.q(css=".static_tab_wrapper .MathJax_SVG")
+        mathjax_container = self.q(css=".static_tab_wrapper .MathJax")
         EmptyPromise(
             lambda: mathjax_container.present and mathjax_container.visible,
             "MathJax is not visible"

common/test/acceptance/tests/discussion/test_discussion.py

@@ -1008,7 +1008,9 @@ class DiscussionEditorPreviewTest(UniqueCourseTest):
             'Text line 2 \n'
             '$$e[n]=d_2$$'
         )
-        self.assertEqual(self.page.get_new_post_preview_text(), 'Text line 1\nText line 2')
+        self.assertEqual(self.page.get_new_post_preview_text(),
+                         'Text line 1\ne[n]=\nd\n1\nText line 2\ne[n]=\nd\n2'
+                         )
 
     def test_inline_mathjax_rendering_in_order(self):
         """
@@ -1023,7 +1025,9 @@ class DiscussionEditorPreviewTest(UniqueCourseTest):
             'Text line 2 \n'
             '$e[n]=d_2$'
         )
-        self.assertEqual(self.page.get_new_post_preview_text('.wmd-preview > p'), 'Text line 1 Text line 2')
+        self.assertEqual(self.page.get_new_post_preview_text('.wmd-preview > p'),
+                         'Text line 1\ne[n]=\nd\n1\nText line 2\ne[n]=\nd\n2'
+                         )
 
     def test_mathjax_not_rendered_after_post_cancel(self):
         """

lms/static/lms/js/spec/main.js

@@ -56,7 +56,7 @@
             'squire': 'common/js/vendor/Squire',
             'jasmine-imagediff': 'xmodule_js/common_static/js/vendor/jasmine-imagediff',
             'domReady': 'xmodule_js/common_static/js/vendor/domReady',
-            mathjax: 'https://cdn.jsdelivr.net/npm/mathjax@2.7.5/MathJax.js?config=TeX-MML-AM_SVG&delayStartupUntil=configured',  // eslint-disable-line max-len
+            mathjax: 'https://cdn.jsdelivr.net/npm/mathjax@2.7.5/MathJax.js?config=TeX-MML-AM_HTMLorMML&delayStartupUntil=configured',  // eslint-disable-line max-len
             'youtube': '//www.youtube.com/player_api?noext',
             'js/src/ajax_prefix': 'xmodule_js/common_static/js/src/ajax_prefix',
             'js/instructor_dashboard/student_admin': 'js/instructor_dashboard/student_admin',