색상 텍스트를 지원하는 곳에 복사하여 붙여넣을 때 구문 하이라이트가 복사되지 않습니다

아래의 내용을 Discourse에서 내 이메일 클라이언트로 복사했을 때:

@@ -1,11 +1,11 @@
-Young volunteer award – celebrating young volunteers, aged 16-24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
+The Young Volunteer Award celebrates young volunteers, aged 16–24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
 
 Do you know a young person who:
 
-Has been volunteering with Neighbourhood Watch and making a positive impact in their community.
+• Has been volunteering with Neighbourhood Watch and making a positive impact in their community?
 
-Gives up their time to support their local community (foodbanks, community hubs and groups, homeless, faith groups)
+• Gives up their time to support their local community (foodbanks, community hubs and groups, homeless, faith groups)?
 
-Held fundraising activities with their school or college or have organised litter picks or other local events.
+• Held fundraising activities with their school or college or have organised litter picks or other local events?
 
-You think this young volunteer deserves to be recognised for their hard work and commitment to their community.
+If so, do you think this young volunteer deserves to be recognised for their hard work and commitment to their community?

…색상이 복제되지 않았습니다.

diff을 사용했나요? 아마 이메일 클라이언트가 이를 지원하지 않는 것일 수도 있습니다.

- 여기는 몇 줄의 텍스트입니다
+ 여기는 더 많은 텍스트입니다

@Lilly, 네. 디스코스에서 색상이 렌더링되려면 diff를 지정해야 합니다:

  1. ```
    @@ -1,11 +1,11 @@
    -Young volunteer award – celebrating young volunteers, aged 16-24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
    +The Young Volunteer Award celebrates young volunteers, aged 16–24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
     
     Do you know a young person who:
     
    -Has been volunteering with Neighbourhood Watch and making a positive impact in their community.
    +• Has been volunteering with Neighbourhood Watch and making a positive impact in their community?
     
    -Gives up their time to support their local community (foodbanks, community hubs and groups, homeless, faith groups)
    +• Gives up their time to support their local community (foodbanks, community hubs and groups, homeless, faith groups)?
     
    -Held fundraising activities with their school or college or have organised litter picks or other local events.
    +• Held fundraising activities with their school or college or have organised litter picks or other local events?
     
    -You think this young volunteer deserves to be recognised for their hard work and commitment to their community.
    +If so, do you think this young volunteer deserves to be recognised for their hard work and commitment to their community?
    ```
    
  2. @@ -1,11 +1,11 @@
    -Young volunteer award – celebrating young volunteers, aged 16-24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
    +The Young Volunteer Award celebrates young volunteers, aged 16–24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
     
     Do you know a young person who:
     
    -Has been volunteering with Neighbourhood Watch and making a positive impact in their community.
    +• Has been volunteering with Neighbourhood Watch and making a positive impact in their community?
     
    -Gives up their time to support their local community (foodbanks, community hubs and groups, homeless, faith groups)
    +• Gives up their time to support their local community (foodbanks, community hubs and groups, homeless, faith groups)?
     
    -Held fundraising activities with their school or college or have organised litter picks or other local events.
    +• Held fundraising activities with their school or college or have organised litter picks or other local events?
     
    -You think this young volunteer deserves to be recognised for their hard work and commitment to their community.
    +If so, do you think this young volunteer deserves to be recognised for their hard work and commitment to their community?
    

제가 클라이언트에서 CommonMark를 작성하는 것에 대해 말씀하신 건가요?

https://superuser.com/q/1361551/904401

그렇다면 그것은 다른 곳에서 다뤄야 할 문제입니다:

대신, 저는 여기서 렌더링된 마크업에서 직접 복사하는 것에 대해 말씀드리는 것입니다. 예를 들어:

네, 그건 당연히 알고 있어서 물어본 거예요

@Lilly, /1에서 확인할 수 있듯이, 나는 그것을 활용했습니다.

아, 죄송합니다. 처음에는 스크린샷인 줄 알았어요.

1개의 좋아요

오늘날에는 어떻게 복사하느냐에 따라 달라집니다.

복사 버튼을 사용할 경우:

클립보드에는 텍스트 버전만 포함됩니다. 포함된 형식은 다음과 같습니다:

TIMESTAMP,TARGETS,SAVE_TARGETS,MULTIPLE,UTF8_STRING,STRING,TEXT,text/plain,text/plain;charset=utf-8,chromium/x-internal-source-rfh-token,chromium/x-source-url

하지만 실제 텍스트를 선택하여 복사하는 것은 정상적으로 작동합니다:

브라우저를 통해 렌더링된 HTML을 복사하는 것이 Discourse가 클립보드와 상호작용하게 하는 방식이 아니기 때문에, 클립보드 사용자에게 text/HTML 형식이 사용 가능합니다:

<span class="hljs-meta" style="color: rgb(133, 133, 133); font-style: italic; font-family: &quot;JetBrains Mono&quot;, Consolas, Monaco, monospace; font-size: 15.75px; 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; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">@@ -1,11 +1,11 @@</span><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;">\n</span><span class="hljs-deletion" style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(79, 24, 11); color: rgb(222, 113, 118); 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; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">-Young volunteer award \xe2\x80\x93 celebrating young volunteers, aged 16-24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.</span><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;">\n</span><span class="hljs-addition" style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(11, 66, 32); color: rgb(118, 196, 144); 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; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">+The Young Volunteer Award celebrates young volunteers, aged 16\xe2\x80\x9324, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.</span><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;">\n</span><br class="Apple-interchange-newline">

복사 버튼을 통해 이를 지원하려면, 렌더링된 색상 버전(라이브러리를 통해 색상이 적용되었기 때문)을 가져와 text/html 형식으로 클립보드에 전송하는 기능을 추가해야 합니다. 이는 가능할 것입니다(테마 컴포넌트로서도 가능할 수 있음) 하지만, 그 동안에는 항상 선택하여 복사하는 옵션이 있습니다.

3개의 좋아요

@supermathie, 감사합니다. 그렇다면 문제는 제 클라이언트(protonMail/webClients, 5.0.115.3 β)에 있는 것 같습니다:

Screencast_20260522_180439

그러나 색상 지정(coloration)은 thunderbird-149.0.1-2.fc44에서도 복제되지 않습니다. 귀하에게는 원하시는 대로 복제되는 것처럼 보이는데도 말입니다:

`Screencast_20260522_181149`

혹시 다르게 하시는 부분이 있는지, 있다면 무엇인지 알 수 있을까요?

Protonmail로 복사할 때, 웹 클라이언트이므로 일반 텍스트 버전을 사용하는 것처럼 보입니다. 폰트를 오버라이드하고 있어서 확신하기는 어렵지만, 서식 구분이 없다는 점을 주목할 만합니다.

Thunderbird에 붙여넣은 경우와 비교해 보세요:

일부 서식은 인식하지만, 모든 서식은 아닙니다.

복사하면 모든 서식을 가져옵니다:

이 문제를 파악하려면 다음 중 어떤 상황인지 구별해야 합니다:

  • 모든 스타일이 복사되지 않는 경우
  • 모든 스타일이 붙여넣기지 않는 경우

확장 프로그램이 없는 깨끗한 브라우저로 시작하면 도움이 될 수 있습니다. 예를 들어, 확장 프로그램이 없는 개인 브라우저 등을 사용하면 다음 결과가 나옵니다:

제가 작성한 이 스크립트를 사용하면 클립보드에 대한 가시성을 확보할 수 있어 도움이 될 수 있습니다.

(아니면 Arch » Fedora :face_with_tongue:)

2개의 좋아요

@supermathie, 그것은 ProtonMail의 기본 스타일시트가 매우 형편없기 때문입니다.

안내해 주신 대로, Firefox 자체(프로파일이 아닙니다. about:profiles에서 새로 생성한 프로필에서도 재현되므로)가 이를 복사하지 못하고 있음을 확인했습니다:

정말 감사합니다!

네! 저도 동일한 동작을 확인했습니다.

엄밀히 말하면, 이는 버그가 아닙니다. Firefox는 요청대로 HTML을 그대로 복사하고 있습니다:

<meta http-equiv="content-type" content="text/html; charset=utf-8">
<p dir="auto">Discourse에서 아래 내용을 내 이메일 클라이언트로 복사했을 때:</p>
<pre data-code-wrap="diff" dir="auto" class="codeblock-buttons">
		<div class="codeblock-button-wrapper" style="right: 0px;"></div>
		<code class="lang-diff hljs language-diff" data-highlighted="yes">
			<span class="hljs-meta">@@ -1,11 +1,11 @@</span>
			<span class="hljs-deletion">-Young volunteer award – celebrating young volunteers, aged 16-24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.</span>
			<span class="hljs-addition">+The Young Volunteer Award celebrates young volunteers, aged 16–24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.</span>
		</code>
	</pre>

복사 후 나타나는 차이는 Chromium이 스타일을 인라인으로 처리하는 반면, Firefox는 그렇지 않기 때문입니다. 한 줄로 줄여보면 무슨 일이 일어나고 있는지 잘 드러납니다[1]:

# firefox
<span
  class="hljs-deletion">
-Young volunteer award – celebrating young volunteers, aged 16-24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
</span>
# chromium
<span
  class="hljs-deletion"
  style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 224, 224); color: rgb(192, 45, 46);">
-Young volunteer award – celebrating young volunteers, aged 16-24, who go the extra mile in their local communities, demonstrating our values and the importance of connection and action.
</span>

(줄바꿈 추가됨)

Chromium은 class="hljs-deletion"에서 인라인 CSS인 style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 224, 224); color: rgb(192, 45, 46);"을 span에 인라인으로 삽입합니다. 이는 스타일링된 대상에 붙여넣을 때 해당 스타일이 없을 가능성이 높기 때문입니다.


  1. heh ↩︎

2개의 좋아요

@supermathie, 정말 포괄적인 답변이네요. 만약 Chromium 소스에서 관련 세그먼트를 찾을 수 있다면, CRBUG를 인용하고 있을 것이며, 이는 참고 구현을 제공해 줄 것입니다.

1개의 좋아요