mlang tags are surrounded by <p>-tags

[28Smiles]

Definition of {mlang} tags in the html editor on rootlevel e.g.

{mlang de}
<p>Hallo</p>
{mlang} {mlang other}
<p>Hello</p>
{mlang}

yields in surrounding by p-tags:

<p>{mlang de}</p>
<p>Hallo</p>
<p>{mlang} {mlang other}</p>
<p>Hello</p>
<p>{mlang}</p>

which in turn yields to invalid html and broken markup. Seems to be a problem with sanitisation config in the configuration.js. Maybe extended_valid_elements needs to be added.

[srobotta]

Hi Leon,

This is "intended": Moodle uses elements for language customization. Inside the editor the {mlang} tags are also replaced by elements (not the same as the standard Moodle uses - but to highlight that there is a language tag start or end in WYSIWYG mode). The is an inline element while the

is a block element. Block elements cannot be children of an inline element, thus being invalid HTML. Whenever you use the HTML editor, do not write these {mlang} tags by hand, use the buttons to insert them or select some text and insert/change them via the gui. That should not lead to broken HTML. If you change to the source code and type invalid html, the editor itself will filter such things out without the plugin having the chance to see this text and do something about it. I hope my assumptions are correct and this helps you further. If not, please do a screencast to see what you are refering to and what we may do about it.

Best regards, Stephan

[28Smiles]

Thank you for your fast and elaborate response. I was unaware of the moodle internals and thought of the {mlang} tags as a kind of switch on html level. I am still a little bit confused about the innerworkings of the filter, since if provided with a link, the {mlang} does work like a switch, but i guess I will have to look into the moodle core then. I did not anticipate it to be this complex.

Best Regards, Leon

[28Smiles]

@srobotta If I understand the moodle-filter_multilang2 plugin correct, it is working like a switch, removing everything except the correct language. https://github.com/iarenaza/moodle-filter_multilang2/blob/master/filter.php#L207 Therefore the input (using the wysiwyg editor)

{mlang de}
Hallo
{mlang}
{mlang other}
Hello
{mlang}

resulting in this html:

<p>{mlang de}</p>
<p>Hallo</p>
<p>{mlang}</p>
<p>{mlang other}</p>
<p>Hello</p>
<p>{mlang}</p>

will generate for de:

<p></p>
<p>Hallo</p>
<p></p>
<p></p>

and in en:

<p></p>
<p></p>
<p>Hello</p>
<p></p>

This html is perfectly valid, but (this is where my issue was raised) seems like its unintentionally cut apart:

<p><!-- {mlang de}</p>
<p>Hallo</p>
<p>{mlang}--></p>
<p>{mlang other}</p>
<p>Hello</p>
<p>{mlang}</p>

Just so to explain my issue.

[28Smiles]

Also "funny" behavior. Inserting a link with mlang tags in the url like http://{mlang de}test{mlang}{mlang other}testi{mlang}, opening the html content view and closing it ("cancel"), results in broken html. Before:

<p><a href="http://{mlang de}test{mlang}{mlang other}testi{mlang}">http://{mlang de}test{mlang}{mlang other}testi{mlang}</a></p>

After:

<p><a class="multilang-begin mceNonEditable" lang="de" xml:lang="de" href="http://&lt;span contenteditable=" false"="">{mlang de}test{mlang}{mlang other}testi{mlang}"&gt;http://{mlang de}test{mlang}{mlang other}testi{mlang}</a></p>

[srobotta]

The problem here is that when you use a plain text area with html content (but not the TinyMCE) you can be more creative in where to place the tags and event write invalid html. This might be fixed when filters (not only multilang) are applied and then served to the browser or even served to the browser broken, but the browser still accepts it and renders it more or less correct. Even your URL example might work. However, having the editor in place then you are somewhat limited on how to use content. When saving the text (or switching between source and wysiwyg mode), the html must be correct, i.e. the editor filters/escapes invalid html. So the TinyMCE itself lets you produce valid html only.

[28Smiles]

So putting in a link like this http://{mlang de}test{mlang}{mlang other}testi{mlang} with the TinyMCE, saving it and reopening it again, and then breaking the html is intentional and valid?

[srobotta]

I tried your example with plain text and that doesn work reliable:

<p>{mlang en}This is a test{mlang}{mlang de}Das ist ein Test{mlang}.</p>
<p>This is a multilang link: <a href="https://google.com?lang={mlang de}de-DE{mlang}{mlang en}en-EN{mlang}">{mlang de}de{mlang}{mlang en}other{mlang}</a></p>
<p></p>
<br/>
<p>{mlang other}This is a test{mlang}{mlang de}Das ist ein Test{mlang}.</p>
<p>This is a multilang link: <a href="https://google.com?lang={mlang de}de-DE{mlang}{mlang other}en-EN{mlang}">{mlang de}de{mlang}{mlang other}other{mlang}</a></p>

Apparently the first (where defining the language explicit) is working the second with the fallback other is not showing up. I agree with you that the TinyMCE with the multilang plugin does more harm to the links and actually breaks it. There is room for improvement, checking that the {mlang} tags remain untouched when inside some inline element (e.g. an anchor tag or similar).