Rich text editor converts bbcode into display math

Description

When pasting bbcode into rich text editor, brackets are escaped as \[ and \]. However, this makes it a valid display math block, so it is erroneously rendered as math.

Reproduction

  1. Copy the following text

    [details="summary"]
    some text
    [/details]
    
  2. Paste into something like notepad.exe

  3. Copy from notepad.exe to remove formatting information

  4. Paste into rich text editor

  5. The text should display as code; uncheck the “code” toggle button to make it plain text

Alternatively, you can type the bbcode shown above manually into the rich text editor.

Expected behaviour

Either

summary

some text

which is fine, since that is the original meaning of the bbcode, or

[details=“summary”]
some text
[/details]

which is also fine, since that is what you see in the wysiwyg editor.

Actual behaviour

details="summary"

some text

/details

which is not fine.

2 Likes

I have not been able to reproduce this problem. I’ve tried on both my Macbook Pro and on a Windows desktop, where I was able to follow your Reproduction instructions verbatim.

In both cases, I accessed the site using the Firefox web browser.

2 Likes

Hi Mark,

Can you reproduce by manually typing some bbcode into the rich text editor (i.e. not pasting into it)? Clipboard formatting is indeed a complicated manner…

If you have people pasting bbcode, you can try disabling discourse_math_enable_latex_delimiters.

But I also can’t reproduce the problem. In my case what was available on the clipboard was:

Formats: TIMESTAMP,TARGETS,SAVE_TARGETS,MULTIPLE,STRING,UTF8_STRING,TEXT,text/plain,text/plain;charset=utf-8,chromium/x-internal-source-rfh-token,chromium/x-source-url
'[details="summary"]\nsome text\n[/details]'

or the plain version:

Formats: TARGETS,UTF8_STRING
'[details="summary"]\nsome plain text\n[/details]\n'

Using browser copy/paste (instead of the copy button) I had on my clipboard:

Formats: TIMESTAMP,TARGETS,SAVE_TARGETS,MULTIPLE,STRING,UTF8_STRING,TEXT,text/html,text/plain,text/plain;charset=utf-8,chromium/x-internal-source-rfh-token,chromium/x-source-url
UTF8_STRING:
b'[details="summary"]\nsome text\n[/details]'
text/html:
b'<span style="color: rgb(199, 199, 199); font-family: &quot;JetBrains Mono&quot;, Consolas, Monaco, monospace; font-size: 15.75px; font-style: normal; font-variant-ligatures: none; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: pre; background-color: rgba(0, 0, 0, 0.25); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">[details="summary"]\nsome text\n[/details]</span>'
text/plain:
b'[details="summary"]\nsome text\n[/details]'
text/plain;charset=utf-8:
b'[details="summary"]\nsome text\n[/details]'

but even that pasted fine.

Yes, I can now verify this behavior by simply typing into the Rich Text editor:

details=”summary”

Here are the not-so hidden details.

/details

Having said that, the rich editor provides tools to enter these type of things via a point and click interface. If you want to enter hidden details, then I guess you should use that interface.

Let’s see if it works:

Summary

This text really is hidden!!

1 Like

It seems that my system injects a <pre><code> for the clipboard…

> arguments[0].clipboardData.getData('text/html')
'<pre><code class="lang-plaintext hljs language-plaintext" data-highlighted="yes">[details="summary"]
some text
[/details]
</code></pre>' 

Anyway, the main point is that what you see in the wysiwyg editor is not what you get.

Yes!

What happened on our instance was that someone provided a template for others to fill in; something like …

[details="Part 1"]
- [ ] check
- [ ] check
- [ ] check
[/details]
[details="Part 2"]
- [ ] check
- [ ] check
- [ ] check
[/details]
...

… and then many people came back (unexpectedly) with display maths like …

details="Part 1"
  • [ ] check
  • [x] check
  • [ ] check
/details
details="Part 2"
  • [x] check
  • [ ] check
  • [x] check
/details

Thanks again for your attention!

1 Like