Свойство CSS `white-space` для данных буфера обмена не учитывается при вставке в WYSIWYG-редактор

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

Конечно. Я рад, если эта информация окажется полезной. Позвольте мне повторить своё предыдущее утверждение:

Однако я не против ошибаться насчёт этого :slightly_smiling_face:.

  1. Скопируйте следующий код на C++:
    #include <iostream>
int main() {
  std::cout << __FILE__;
}
  2. Откройте редактор сообщения.
  3. Переключите редактор в режим «богатого текста».
  4. Вставьте скопированный контент в редактор.

:slightly_frowning_face: Контент повреждён:

#include
int main() {
std::cout << FILE;
}

(обратите внимание, что <iostream> был удалён, так как был воспринят как неподдерживаемый HTML-тег, а __FILE__ был обработан как жирный шрифт)

Это можно считать ошибкой пользователя, поскольку её можно избежать, предварительно активировав блок кода перед вставкой контента, не являющегося обычным текстом. Однако мы могли бы ожидать, что альтернативный рабочий процесс — применение форматирования блока кода постфактум к вставленному контенту — будет столь же допустимым (как это работает при использовании редактора Markdown).

Оборудование

  • Любая плата Arduino (как официальная, так и сторонняя)

Инструкция

  1. Установите Arduino IDE 2.3.6, которую можно загрузить со страницы «Software» на сайте Arduino:
    https://www.arduino.cc/en/software/#ide-download-section
  2. Запустите Arduino IDE.
  3. В меню Arduino IDE выберите File > New Sketch.
  4. Замените содержимое нового скетча следующим кодом:
    void setup() {
  Serial.begin(9600);
  while (!Serial) {}  // Ждём открытия последовательного порта.
  delay(500);         // Некоторым платам требуется задержка после инициализации последовательного порта.
  Serial.println("foo");
  Serial.println("bar");
}
void loop() {}
  5. В меню Arduino IDE выберите Tools > Serial Monitor, чтобы открыть окно Serial Monitor, если оно ещё не открыто.
  6. В окне Serial Monitor выберите «9600» в меню скорости передачи данных (baud rate).
  7. Загрузите скетч на вашу плату Arduino.
  8. Выделите вывод в поле окна Serial Monitor.
  9. Скопируйте выделенный контент.
  10. Откройте редактор сообщения в Discourse.
  11. Переключите редактор в режим «богатого текста».
  12. Вставьте скопированный контент в редактор.

:slightly_frowning_face: Каждая строка скопированного контента помещается в отдельный блок кода:

foo


bar

Если вы проверите содержимое буфера обмена, то увидите, что помимо ожидаемого контента типа text/plain:

foo
bar

оно также содержит следующий контент типа text/html:

<div style="color: rgb(78, 91, 97); font-family: monospace; font-size: 13px; font-style: normal; font-variant-ligatures: normal; 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: nowrap; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; position: absolute; left: 0px; top: 0px; height: 18px; width: 1862px;"><pre style="margin: 0px;">foo
</pre></div><div style="color: rgb(78, 91, 97); font-family: monospace; font-size: 13px; font-style: normal; font-variant-ligatures: normal; 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: nowrap; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; position: absolute; left: 0px; top: 18px; height: 18px; width: 1862px;"><pre style="margin: 0px;">bar</pre></div>

Поскольку монитор последовательного порта Arduino IDE 2.x ошибочно оборачивает каждую строку скопированного контента типа text/html в теги <pre>, отображение каждой строки вставленного контента как отдельного блока кода в редакторе богатого текста Discourse является правильным и ожидаемым.

Как и в случае с другой проблемой, описанной выше, неожиданное форматирование можно избежать, заблаговременно применив форматирование блока кода перед вставкой контента.

2 лайка