HTML class attribute is stripped with custom button

[chrisburton]

The way my custom button works is:

1. Highlight text
2. Click custom button in toolbar
3. prompt modal appears
4. Enter classname (e.g. typing foo into prompt should result in <code class="foo">...</code>

However, the entire class attribute is stripped and I'm not sure why. cleanPastedHtml is set to false.

Code

var CodeButton = MediumEditor.extensions.button.extend({
    // Should match what you add to the Statamic object below, and the button name.
    name: 'codeButton',

    tagNames: ['code'],
    contentDefault: '<span class="icon icon-code"></span>',
    aria: 'Code',

    handleClick: function () {
        const myClass = this.getMyClass();
        if (!myClass) return;

        const selection = this.base.options.contentWindow.getSelection().toString().trim();
        const html = `<code class="${myClass}">${selection}</code>`;
        this.base.pasteHTML(html);
        this.base.checkContentChanged();
    },

    getMyClass: function () {
        // Get the classname from a modal, etc.
        return prompt('Code type (php, file, js, terminal)?');
    }
});
// Add it to the Statamic object.
Statamic.MediumEditorExtensions.codeButton = CodeButton;

Result:

<code>Text I selected</code>

Desired Result:

<code class="foo">Text I selected</code>

[Vingtoft]

Did you resolve this issue? I have the exact same problem!

[chrisburton]

@Vingtoft This medium editor was part of a CMS I was using at the time. The CMS authors ended up going with a better alternative for their WYSIWYG editor. I was unable to solve the problem. Sorry!