samclarke / SCEditor

A lightweight HTML and BBCode WYSIWYG editor
http://www.sceditor.com/
Other
659 stars 188 forks source link

Simple "format" and "html" instructions doesn't work #960

Closed shadow2560 closed 6 months ago

shadow2560 commented 6 months ago

I'm trying the example to add headers as custom commands and bbcode but this one doesn't work for bbcode, the content displayed is the good level header but the content is always "0" when I change WYSIWYG to source or source to WYSIWYG, no diference: sceditor.formats.bbcode.set("h2", { tags: { h2: null }, format: "[h2]{0}[/h2]", html: "<h2>{0}</h2>", isInline: false });

But with this it work perfectly: `sceditor.formats.bbcode.set('h2', { tags: { h2: null }, format: function (elm, content) { return '[h2]' + content + '[/h2]'; }, html: function (token, attrs, content) { return '

' + content + '

'; }, isInline: false });

Firefox 124.0.1, Windows 11 up to date, SCEditor 3.2.0. Not tested on an other configuration.

Configuration of SCEditor option is:

sceditor.create(textarea, {
    format: 'bbcode',
    locale: 'fr',
    id: 'sce_txt_text',
    // toolbarContainer: null,
    plugins: 'undo',
    toolbar: 'bold,italic,underline|left,center,right,justify|size,color,bacolor|link,image,youtube|headers,bulletlist,orderedlist,table,code,quote|horizontalrule,date,time|removeformat,unlink|maximize,source',
    toolbarExclude: 'print,ltr,rtl,emoticon,email,cut,copy,paste,pastetext,superscript,subscript,strike,font',
    // fonts: 'Arial,Arial Black,Comic Sans MS,Courier New,Georgia,Impact,Sans-serif,Serif,Times New Roman,Trebuchet MS,Verdana',
    // colors: 'white,black,red,green,blue,yellow,orange,pink',
    parserOptions: {
        breakBeforeBlock: false,
        breakStartBlock: false,
        breakEndBlock: false,
        breakAfterBlock: true,
        removeEmptyTags: false,
        fixInvalidNesting: true,
        fixInvalidChildren: false,
        quoteType: sceditor.BBCodeParser.QuoteType.auto
    },
    startInSourceMode: true,
    readOnly: false,
    emoticonsEnabled: false,
    dateFormat: 'day-month-year',
    autofocusEnd: false,
    autoExpand: true,
    autoUpdate: true,
    disableBlockRemove: false,
    style: 'js/sceditor/minified/themes/content/default.min.css'
});

Steps to reproduce the problem

  1. Declare the minified necessary files
  2. Declare the custom commands.
  3. Create the editor.
  4. Create a level 2 header, in WYSIWYG or source mode.
  5. Click on the buton to toggle source/WYSIWYG mode.
  6. The content of the header should be, in source mode, "[h2]0[/h2]".
shadow2560 commented 6 months ago

I answer to myself, this is caused by my use of smarty templates during my tests so in this case the { and }, in this particular context, should be escaped.

I'm closing this issue.