Подсветка синтаксиса не копируется при вставке в место, поддерживающее цветной текст

Внести вклад Ошибка
11

Да! У меня наблюдается такое же поведение.

И если быть точным, это не баг. 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], что происходит:

<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-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. ха-ха ↩︎

1 лайк