리치 텍스트 에디터가 bb코드를 디스플레이 수학으로 변환합니다

기여 버그
, ,
1

설명

리치 텍스트 에디터에 BBCode를 붙여 넣으면 괄호가 \[ 및 \]로 이스케이프됩니다. 그러나 이는 유효한 디스플레이 수학 블록이 되므로, 수학식으로 잘못 렌더링됩니다.

재현 방법

  1. 다음 텍스트를 복사합니다

    [details="summary"]
some text
[/details]

  2. 메모장(notepad.exe)과 같은 프로그램에 붙여 넣습니다

  3. 메모장에서 다시 복사하여 서식 정보를 제거합니다

  4. 리치 텍스트 에디터에 붙여 넣습니다

  5. 텍스트가 코드로 표시되어야 합니다. 일반 텍스트로 만들기 위해 “코드” 토글 버튼을 해제합니다

대신, 위에서 표시된 BBCode를 리치 텍스트 에디터에 수동으로 입력할 수도 있습니다.

예상 동작

아래 중 하나입니다.

summary

some text

이는 BBCode의 원래 의미이므로 문제가 없습니다. 또는

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

이는 WYSIWYG 에디터에서 보이는 내용과 일치하므로 역시 문제가 없습니다.

실제 동작

details="summary"

some text

/details

이는 문제가 있습니다.

2개의 좋아요
2

이 문제를 재현하지 못했습니다. Macbook Pro와 Windows 데스크톱 모두에서 재현 방법을 그대로 따라 해 보았지만, 두 경우 모두 Firefox 웹 브라우저를 사용하여 해당 사이트에 접속했습니다.

2개의 좋아요
3

마크 씨,

리치 텍스트 에디터에 bbcode를 직접 입력해(복사해서 붙여넣지 않고) 재현해볼 수 있을까요? 클립보드 형식 처리는 정말 복잡한 문제입니다…

4

BBCode를 붙여넣는 사용자가 있다면, discourse_math_enable_latex_delimiters를 비활성화해 볼 수 있습니다.

하지만 저 역시 문제를 재현하지 못했습니다. 제 경우 클립보드에 저장된 내용은 다음과 같았습니다:

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]'

또는 일반 텍스트 버전:

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

브라우저의 복사/붙여넣기(복사 버튼 대신)를 사용하면 클립보드에는 다음이 저장되었습니다:

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]'

하지만 이 경우에도 붙여넣기는 정상적으로 작동했습니다.

5

네, 이제 Rich Text 편집기에 직접 입력하여 이 동작을 확인할 수 있습니다:

details=”summary”

여기 꽤 숨겨지지 않은 세부 정보가 있습니다.

/details

그러나 리치 에디터는 이러한 유형의 내용을 포인트 앤 클릭 인터페이스를 통해 입력할 수 있는 도구를 제공합니다. 숨겨진 세부 정보를 입력하려면 해당 인터페이스를 사용하는 것이 좋습니다.

Screenshot 2026-02-19 at 8.58.45 PM
Screenshot 2026-02-19 at 8.58.45 PM1516×634 63.4 KB

동작하는지 확인해 보겠습니다:

Summary

이 텍스트는 정말로 숨겨져 있습니다!!

1개의 좋아요
6

내 시스템이 클립보드를 위해 <pre><code>를 주입하는 것 같습니다…

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

어쨌든, 핵심은 WYSIWYG 에디터에서 보는 것과 실제로 가져오는 내용이 다르다는 것입니다.

7

맞습니다!

저희 인스턴스에서 일어난 일은 누군가가 다른 사람들이 채울 수 있는 템플릿을 제공한 것이었습니다. 다음과 같은 형태였죠 …

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

… 그리고 나서 많은 사람들이 (예상치 못하게) 다음과 같은 디스플레이 수학(display maths)으로 돌아왔습니다 …

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

관심 가져주셔서 다시 한번 감사합니다!

1개의 좋아요