MathJAX notation not appearing in matching question answers

MathJAX notation not appearing in matching question answers

by Dave Laurie -
Number of replies: 13

Hi all,

We're not seeing MathJAX notation rendered in the answers for matching questions but the question text seems fine... a screenshot is attached. The same MathJax notation also displays correctly in regular multiple choice question answers.

We're using Moodle 2.8.5 with a custom theme but I tested our UAT with Clean and see the same issue.

Is this expected? And if so, can anyone suggest a workaround?


Cheers,
Dave

Attachment Screen Shot 2015-09-21 at 2.43.38 PM.jpg
Average of ratings: -
In reply to Dave Laurie

Re: MathJAX notation not appearing in matching question answers

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

Yes, this is expected. The answers to matching questions are plain text.

In reply to Dave Laurie

Re: MathJAX notation not appearing in matching question answers

by AL Rachels -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

As Tim said, the answers in regular multiple choice are plain text. If you use CLOZE type multiple choice (MULTICHOICE or MC), represented as a dropdown menu in-line in the text, you can get what you want. You will have to be very careful constructing your answers as some keystrokes will have to be delimited for them to render correctly.



In reply to AL Rachels

Re: MathJAX notation not appearing in matching question answers

by AL Rachels -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

Here is a picture of the answer for the third question so it doesn't get partially rendered in this Moodle:

In reply to Dave Laurie

Re: MathJAX notation not appearing in matching question answers

by Daniel Thies -
Picture of Core developers Picture of Plugin developers Picture of Testers

Dave,

I did not understand what your where doing from earlier. Tim is right of course this is not suppose to work, but there are work arounds. In the embedded answer(cloze) question type you can do multichoice drop down, and use several multichoice answers to mimic matching, but this works in the Chrome browser, but not Firefox or IE as far as I know. A better solution might be to use the Drag and Drop Matching Type which will work with MathJax or TeX notation filter.



In reply to Daniel Thies

Re: MathJAX notation not appearing in matching question answers

by Dave Laurie -

Thanks everyone,

This has been super helpful!

Al, I was able to get your CLOZE syntax working. (I had tried that as my initial workaround but was delimiting the keystrokes incorrectly.) However this workaround only displays correctly for me in Firefox (v.40.0.3 on OSX), not in Chrome (I did not check IE).

Daniel, you mentioned that AFAYK this would work the opposite way (ie. in Chrome, not FF). Are there any tricks to make things functional in Chrome? (Those are our 2 recommended browsers so if we could cover them both we would get the instructor to go this way for the short term.)

We'll be taking a look at Drag and Drop matching for the longer term.

Thanks,
Dave

In reply to Dave Laurie

Re: MathJAX notation not appearing in matching question answers

by Daniel Thies -
Picture of Core developers Picture of Plugin developers Picture of Testers
Dave, I think I did get the browsers backwards. Firefox is the only one that display correctly. As a work around the simplest and safest would be to you would be plain text like 'square root of 2' instead of \(\sqrt2\).
Alternatively, I was able to get nearly acceptable output on Chrome and IE by using the Fast HTML rendering mode instead of HTML-CSS. The top of the surd was clipped so the bar was not visible, but otherwise appears alright. This may be able to be fixed with CSS changing line height.
In reply to Daniel Thies

Re: MathJAX notation not appearing in matching question answers

by Dave Laurie -

Thanks Daniel,

These leads me to a few follow-ups:

1) Can I just clarify that Fast HTML comes in with v 2.9+ when the default MathJAX shifts from version 2.3 to 2.5? (I am pretty sure I read that in my googling around forums somewhere in the past couple of days but can't remember where...) Is this something editable through the MathJAX settings in versions prior to 2.9+?

2) Will shifting to Fast HTML rendering break the correct output currently available in Firefox (ie. is it an EITHER-OR scenario, as in either FF or Chrome/IE?)

3) Is switching the renderer a user preference? Or somehow stored in the user's browser?

Thanks for your time.

Dave

In reply to Dave Laurie

Re: MathJAX notation not appearing in matching question answers

by Daniel Thies -
Picture of Core developers Picture of Plugin developers Picture of Testers

MathJax is not actually part of Moodle, but is a separate javascript library from mathjax.org. The MathJax filter loads the library from a url specified in the settings. If you have an older version of Moodle, you can change this setting to http://cdn.mathjax.org/mathjax/2.5-latest/MathJax.js to switch versions.

There is also a configuration setting that configures MathJax defaults.  The user can normally set the display mode by right clicking any mathematical expression and finding the desired option. (You should try this to test your question first). The default renderer can be specified with the MathJax configuration in the settings, by adding something like

MMLorHTML: {
    prefer: {
      Chrome: "CommonHTML"
    }
  }
See the MathJax Documentation. This may work, but no guarantee. You will need to test it. Installing a different question type, may be easier.
In reply to Daniel Thies

Re: MathJAX notation not appearing in matching question answers

by Dave Laurie -

This is great - thanks!

Dave

In reply to Dave Laurie

Re: MathJAX notation not appearing in matching question answers

by Daniel Thies -
Picture of Core developers Picture of Plugin developers Picture of Testers

I tried the configuration above and it did not seem to work for me. in setting the renderer to CommonHTML, but it can be set using javascript with

MathJax.Hub.setRenderer('CommonHTML');

You probably would want add a browser test to make sure it is not Firefox.

In reply to Daniel Thies

Re: MathJAX notation not appearing in matching question answers

by Mauno Korpelainen -

Daniel,

the point here is that no matter what settings of MathJax or other math renderers are selected you can't change the behaviour of browsers using <option> tags. Permitted content is only Text with eventually escaped characters (like é). You can use html entities and unicode characters there but no html elements inside option tag. The only browser that can render some html inside <option> tags is Firefox but it's not valid html (in this case Firefox breaks the rules - not IE or Chrome) - see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option

If the dropdown lists in quizzes were built for example with <li> tags dropdown lists could use flow content like modern navigation menus nowadays do. It would allow all kinds of selection lists with all kinds of answer options.


Average of ratings: Useful (1)
In reply to Mauno Korpelainen

Re: MathJAX notation not appearing in matching question answers

by Daniel Thies -
Picture of Core developers Picture of Plugin developers Picture of Testers

Mauno,

I do agree with you, this is a fundamentally a bad way to design a question. TeX should not be rendered at all in the options, but unfortunately the core filter is configured to do so with cloze, and this leads teachers to try it. I did not mean to encourage it.

In reply to Dave Laurie

Re: MathJAX notation not appearing in matching question answers

by Mauno Korpelainen -

There is no cross-browser way to style select and option elements and therefore only FF (Mozilla) browsers render any maths in drop down lists in Quiz.

The best workaround would be to replace those traditional dropdown lists (select and option html tags) with pure css based or javascript based "drop down lists" that use other elements - for example normal ul & li elements like navigation blocks and this way drop down lists could use any math renderer and show images in those lists as well. For example Bootstrap themes have built in css classes for such lists called Button dropdowns.