Add custom markdown quote bbcode tags

Canapin · January 7, 2025, 12:46pm

I think it’s the DecorateCallBack functions:

plugins/spoiler-alert/assets/javascripts/initializers/spoiler-alert.js

affe26f0d


      
            icon: "wand-magic",
            label: "spoiler.title",
            action: (toolbarEvent) => {
              toolbarEvent.applySurround("[spoiler]", "[/spoiler]", "spoiler_text", {
                multiline: false,
                useBlockMode: true,
              });
            },
          });
          
          addTagDecorateCallback(function () {
            const { attributes } = this.element;
          
            if (/\bspoiled\b/.test(attributes.class)) {
              this.prefix = "[spoiler]";
              this.suffix = "[/spoiler]";
            }
          });
          
          addBlockDecorateCallback(function (text) {
            const { name, attributes } = this.element;

Related test:

github.com/discourse/discourse

plugins/spoiler-alert/test/javascripts/unit/lib/to-markdown-test.js

affe26f0d

import { module, test } from "qunit";
import { withPluginApi } from "discourse/lib/plugin-api";
import toMarkdown from "discourse/lib/to-markdown";
import { initializeSpoiler } from "discourse/plugins/spoiler-alert/initializers/spoiler-alert";

module("Spoiler Alert | Unit | to-markdown", function (hooks) {
  hooks.beforeEach(function () {
    withPluginApi("0.5", initializeSpoiler);
  });

  test("handles spoiler tags", function (assert) {
    let html = `<div>Text with a</div><div class="spoiled spoiler-blurred">spoiled</div><div>word.</div>`;
    let markdown = `Text with a\n\n[spoiler]\nspoiled\n[/spoiler]\n\nword.`;

    assert.strictEqual(toMarkdown(html), markdown, "creates block spoiler tag");

    html = `Inline <span class="spoiled">spoiled</span> word.`;
    markdown = `Inline [spoiler]spoiled[/spoiler] word.`;
    assert.strictEqual(
      toMarkdown(html),

This file has been truncated. show original

To help debug by returning the content of the text on selection, you can console.log(_selectedText); after this line in a core file:

github.com/discourse/discourse

app/assets/javascripts/discourse/app/components/post-text-selection.gjs

affe26f0d


      
          ) {
            if (element.tagName === "ASIDE" && element.classList.contains("quote")) {
              opts.username = element.dataset.username || getQuoteTitle(element);
              opts.post = element.dataset.post;
              opts.topic = element.dataset.topic;
              break;
            }
          }
          
          const quoteState = this.args.quoteState;
          quoteState.selected(postId, _selectedText, opts);
          
          let supportsFastEdit = this.canEditPost;
          
          const start = getElement(selection.getRangeAt(0).startContainer);
          
          if (!start || start.closest(CSS_TO_DISABLE_FAST_EDIT)) {
            supportsFastEdit = false;
          }
          
          if (supportsFastEdit) {

A screenshot of a browser console interface with various textual elements and a navigation bar. (Captioned by AI)

Topic		Replies	Views
Quoting spoiler text doesn't include spoiler tags in the quote Bug fixed	8	1248	May 28, 2024
Cannot quote spoiler text Feature	18	2067	August 1, 2018
Spoiler tags and embedded Markdown/BBCode issue Bug	1	1660	August 21, 2015
Spoiler with text on the same line as the tag no longer works Product Support	11	3595	July 19, 2017
Markdown / bbcode code/quote bug Bug	5	564	March 14, 2024

Add custom markdown quote bbcode tags

Related topics